From 5ea83c1c7358f52934a326cb378f65c2660de4f9 Mon Sep 17 00:00:00 2001 From: Jiyeon Baek <58380158+100Gyeon@users.noreply.github.com> Date: Mon, 11 Nov 2024 02:44:54 +0900 Subject: [PATCH] =?UTF-8?q?docs:=20=EC=B1=95=ED=84=B0=207=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../\353\260\261\354\247\200\354\227\260.md" | 114 ++++++++++++++++++ 1 file changed, 114 insertions(+) diff --git "a/\354\261\225\355\204\260_7/\353\260\261\354\247\200\354\227\260.md" "b/\354\261\225\355\204\260_7/\353\260\261\354\247\200\354\227\260.md" index e59d40f..7ee8426 100644 --- "a/\354\261\225\355\204\260_7/\353\260\261\354\247\200\354\227\260.md" +++ "b/\354\261\225\355\204\260_7/\353\260\261\354\247\200\354\227\260.md" @@ -523,4 +523,118 @@ export default CreateClassWithMixinComponent; - πŸ‘ : λ°μ½”λ ˆμ΄ν„° νŒ¨ν„΄ (베이슀 객체에 μ†μ„±μ΄λ‚˜ λ©”μ„œλ“œλ₯Ό μΆ”κ°€ν•΄ κ°„μ†Œν™”) - πŸ‘Ž : μ„œλΈŒν΄λž˜μ‹± (λŠ˜μ–΄κ°€λŠ” λŠ₯λ ₯의 수λ₯Ό 감당할 수 μ—†μŒ) +#### μž₯점 + +- 베이슀 객체 λ³€κ²½ κ±±μ • 없이 μ‚¬μš© κ°€λŠ₯ +- μˆ˜λ§Žμ€ μ„œλΈŒν΄λž˜μŠ€μ— μ˜μ‘΄ν•  ν•„μš” μ—†μŒ + +#### 단점 + +- μ• ν”Œλ¦¬μΌ€μ΄μ…˜ ꡬ쑰λ₯Ό λ³΅μž‘ν•˜κ²Œ λ§Œλ“€ μˆ˜λ„ 있음 +- λ°μ½”λ ˆμ΄ν„° νŒ¨ν„΄μ— μ΅μˆ™ν•˜μ§€ μ•Šμ€ κ°œλ°œμžλŠ” λͺ©μ μ„ νŒŒμ•…ν•˜κΈ° μ–΄λ €μ›Œ 관리 νž˜λ“€μ–΄μ§ + + + +
+ν”ŒλΌμ΄μ›¨μ΄νŠΈ νŒ¨ν„΄ + +## ν”ŒλΌμ΄μ›¨μ΄νŠΈ νŒ¨ν„΄ + +#### μ •μ˜ + +반볡되고 느리고 λΉ„νš¨μœ¨μ μœΌλ‘œ **데이터λ₯Ό 곡유**ν•˜λŠ” μ½”λ“œλ₯Ό μ΅œμ ν™”ν•˜λŠ” ꡬ쑰적 ν•΄κ²° 방법 + +#### νŠΉμ§• + +- μ—°κ΄€λœ 객체끼리 데이터λ₯Ό 곡유 +- **λ©”λͺ¨λ¦¬ κ³΅κ°„μ˜ κ²½λŸ‰ν™”**, **λ©”λͺ¨λ¦¬ μ ˆμ•½**이 λͺ©ν‘œ +- κ°μ²΄λ§ˆλ‹€ 데이터 μ €μž₯ (x) ν•˜λ‚˜μ˜ 의쑴 μ™ΈλΆ€ 데이터에 λͺ¨μ•„μ„œ 데이터 μ €μž₯ (o) + +#### μ˜ˆμ‹œ + +- **데이터 λ ˆμ΄μ–΄**, **DOM λ ˆμ΄μ–΄**μ—μ„œ ν”ŒλΌμ΄μ›¨μ΄νŠΈ νŒ¨ν„΄ μ‚¬μš© + +
+ +## ν–‰μœ„ νŒ¨ν„΄ + +ν–‰μœ„ νŒ¨ν„΄μ€ **객체 κ°„μ˜ μ˜μ‚¬μ†Œν†΅μ„ λ•λŠ” νŒ¨ν„΄** + +
+κ΄€μ°°μž νŒ¨ν„΄ + +## κ΄€μ°°μž νŒ¨ν„΄ + +#### μ •μ˜ + +ν•œ 객체가 λ³€κ²½λ˜μ—ˆμŒμ„ λ‹€λ₯Έ κ°μ²΄λ“€μ—κ²Œ μ•Œλ €μ£ΌλŠ” νŒ¨ν„΄ + +#### νŠΉμ§• + +- ν•œ 객체(subject)λ₯Ό κ΄€μ°°ν•˜λŠ” μ—¬λŸ¬ 객체듀(object)이 쑴재 +- 주체의 μƒνƒœκ°€ λ³€ν™”ν•˜λ©΄ κ΄€μ°°μžλ“€μ—κ²Œ μžλ™μœΌλ‘œ μ•Œλ¦Όμ„ 보냄 +- μžλ°”μŠ€ν¬λ¦½νŠΈ ν™˜κ²½μ—μ„œλŠ” κ΄€μ°°μž νŒ¨ν„΄λ³΄λ‹€ Publish/Subscribe νŒ¨ν„΄μ„ μ‚¬μš©ν•˜κ³  있음 +- μ‹œμŠ€ν…œμ˜ ꡬ성 μš”μ†Œ 간에 **λŠμŠ¨ν•œ κ²°ν•©**을 도λͺ¨ν•œλ‹€λŠ” 것이 핡심 + +#### μž₯점 + +- ꡬ성 μš”μ†Œ κ°„μ˜ 관계λ₯Ό κ³ λ―Όν•΄ λ³Ό 수 μžˆλŠ” 기회 +- ꡬ성 μš”μ†Œλ“€μ΄ 직접 μ—°κ²°λœ 곳을 주체-κ΄€μ°°μž κ΄€κ³„λ‘œ λŒ€μ²΄ν•˜λ©΄ λŠμŠ¨ν•œ κ²°ν•©μœΌλ‘œ κ°œμ„ λ˜μ–΄ μ½”λ“œ μž¬μ‚¬μš©μ„±μ„ 높일 수 있음 +- 클래슀λ₯Ό κ°•ν•˜κ²Œ κ²°ν•©ν•˜μ§€ μ•Šκ³ λ„ κ΄€λ ¨ 객체듀 μ‚¬μ΄μ˜ 일관성을 μœ μ§€ν•  수 있음 + +#### 단점 + +- 관계λ₯Ό μΆ”μ ν•˜κΈ° μ–΄λ €μšΈ 수 있음 + +> μ±…μ—μ„œλŠ” μ–ΈκΈ‰ν•˜μ§€ μ•Šμ•˜μ§€λ§Œ λ©”λͺ¨λ¦¬ λˆ„μˆ˜κ°€ λ°œμƒν•  수 μžˆλ‹€λŠ” 단점도 μžˆμ–΄μš” + +#### μ˜ˆμ‹œ + +RxJSμ—μ„œλŠ” κ΄€μ°°μžλ₯Ό λ§Œλ“€μ–΄ νŠΉμ • 이벀트λ₯Ό ꡬ독할 수 있음 + +
+ +
+μ€‘μž¬μž νŒ¨ν„΄ + +## μ€‘μž¬μž νŒ¨ν„΄ + +#### μ •μ˜ + +ν•˜λ‚˜μ˜ 객체가 이벀트 λ°œμƒ μ‹œ μ—¬λŸ¬ κ°μ²΄λ“€μ—κ²Œ μ•Œλ¦Όμ„ 보낼 수 μžˆλŠ” νŒ¨ν„΄ + +#### νŠΉμ§• + +- **쀑앙 집쀑식 ν†΅μ œ** +- ꡬ성 μš”μ†Œ κ°„μ˜ 관계λ₯Ό κ΄€λ¦¬ν•¨μœΌλ‘œμ¨ 직접 μ°Έμ‘° 제거 β†’ λŠμŠ¨ν•œ κ²°ν•© (μ‹œμŠ€ν…œ 결합도 ↓, μž¬μ‚¬μš©μ„± ↑) +- 이벀트λ₯Ό μ˜μ‚¬κ²°μ •μ— ν™œμš©ν•  μˆ˜λŠ” μžˆμ§€λ§Œ, fire and forgetκ³ΌλŠ” 거리가 있음 +- 두 개 μ΄μƒμ˜ 객체가 간접적인 관계λ₯Ό 가지고 있고, λΉ„μ¦ˆλ‹ˆμŠ€ λ‘œμ§μ΄λ‚˜ μ›Œν¬ν”Œλ‘œμ— 따라 μƒν˜Έμž‘μš© 및 쑰정이 ν•„μš”ν•œ κ²½μš°μ— 유용 +- νΌμ‚¬λ“œ νŒ¨ν„΄μ€ λ‹€λ₯Έ λͺ¨λ“ˆμ΄ νΌμ‚¬λ“œμ˜ κ°œλ…μ„ μ§μ ‘μ μœΌλ‘œ μΈμ§€ν•˜μ§€ λͺ»ν•˜λ―€λ‘œ 단방ν–₯μ„±μ΄μ§€λ§Œ, + μ€‘μž¬μž νŒ¨ν„΄μ€ λͺ¨λ“ˆμ΄ λͺ…μ‹œμ μœΌλ‘œ μ€‘μž¬μžλ₯Ό μ°Έμ‘°ν•¨μœΌλ‘œμ¨ μƒν˜Έμž‘μš©μ„ μ€‘μ•™μ§‘μ€‘ν™”ν•˜κ³  **λ‹€λ°©ν–₯μ„±**을 μ§€λ‹˜ + +
+ +
+μ»€λ§¨λ“œ νŒ¨ν„΄ + +## μ»€λ§¨λ“œ νŒ¨ν„΄ + +#### μ •μ˜ + +λ©”μ„œλ“œ 호좜, μš”μ²­ λ˜λŠ” μž‘μ—…μ„ 단일 객체둜 μΊ‘μŠν™”ν•˜μ—¬ 좔후에 μ‹€ν–‰ν•˜λŠ” νŒ¨ν„΄ + +#### νŠΉμ§• + +- μ‹€ν–‰ μ‹œμ μ„ μœ μ—°ν•˜κ²Œ μ‘°μ •ν•˜κ³  ν˜ΈμΆœμ„ λ§€κ°œλ³€μˆ˜ν™” +- λͺ…령을 μ‹€ν–‰ν•˜λŠ” 객체와 λͺ…령을 λ‚΄λ¦¬λŠ” 객체 κ°„μ˜ λŠμŠ¨ν•œ 결합을 톡해 객체 변경에 λŒ€ν•œ μœ μ—°μ„±μ„ ν–₯μƒμ‹œν‚΄ +- λͺ…령을 μ‹€ν–‰ν•˜λŠ” 객체와 λͺ…령을 λ‚΄λ¦¬λŠ” 객체의 μ±…μž„μ„ λΆ„λ¦¬ν•˜λŠ” 게 κΈ°λ³Έ 원칙 + +> λ„€μ΄λ²„μ—μ„œ μ›Ή 기반 κ·Έλž˜ν”½ νŽΈμ§‘κΈ°λ₯Ό κ°œλ°œν•  λ•Œ μ»€λ§¨λ“œ νŒ¨ν„΄μ„ μ μš©ν–ˆλ‹€κ³  ν•΄μš”πŸ‘ +> https://youtu.be/IaIFGYWDuuo?t=2365 +> +> [μ˜μƒμ— λ‚˜μ˜¨ 팁] +> +> - Command 객체의 undo, redoλ₯Ό 일일이 κ΅¬ν˜„ν•˜μ§€ μ•ŠμœΌλ €λ©΄ immutability ν™œμš©ν•˜λ©΄ λœλ‹€. +> - immerλ₯Ό μ΄μš©ν•˜λ©΄ μƒμœ„ ν΄λž˜μŠ€μ—μ„œ undo, redo ν•œ 번만 κ΅¬ν˜„ν•˜κ³  ν•˜μœ„ ν΄λž˜μŠ€μ—μ„œλŠ” 상속받아 μ“°λ©΄ λœλ‹€. +