From cafb5e494ee093e474f410975207f3bb2653bc11 Mon Sep 17 00:00:00 2001
From: SangBeom Park <tkdqja4164@naver.com>
Date: Sun, 17 Nov 2024 23:36:00 +0900
Subject: [PATCH] =?UTF-8?q?Create=20=EC=83=81=EB=B2=94.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../\354\203\201\353\262\224.md"              | 60 +++++++++++++++++++
 1 file changed, 60 insertions(+)
 create mode 100644 "\354\261\225\355\204\260_9/\354\203\201\353\262\224.md"

diff --git "a/\354\261\225\355\204\260_9/\354\203\201\353\262\224.md" "b/\354\261\225\355\204\260_9/\354\203\201\353\262\224.md"
new file mode 100644
index 0000000..ffc4839
--- /dev/null
+++ "b/\354\261\225\355\204\260_9/\354\203\201\353\262\224.md"
@@ -0,0 +1,60 @@
+# 9장 비동기 프로그래밍 패턴
+
+## 콜백함수
+다른 함수에 인수로서 전달되어 비동기 작업이 완료된 후 실행
+
+단점 : 중첩된 콜백구조로 인해 코드 가독성과 유지보수성이 크게 저하될 수 있음
+
+```js
+// 콜백이 동기적 흐름처럼 보일 수 있지만 비동기적으로 실행됨
+function fetchData(callback) {
+  console.log('Fetching data...');
+  setTimeout(() => {
+    callback('Data received!');
+  }, 1000); // 비동기 작업
+}
+
+console.log('Start');
+fetchData((data) => {
+  console.log(data); // 나중에 실행됨 (비동기)
+});
+console.log('End');
+// Start
+// Fetching data...
+// End
+// Data received!
+```
+
+## 프로미스 패턴
+콜백보다 체계적이고 가독성이 높은 방법으로 비동기 작업 처리 가능, 이해하기 쉽고 유지보수성 높은 코드 작성 가능
+
+## async/await 패턴
+비동기 코드를 마치 동기 코드처럼 작성할 수 있게 도와주는 자바스크립트 기능
+
+
+```js
+function fetchData() {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve('Data received!');
+    }, 1000);
+  });
+}
+
+(async () => {
+  console.log('Start');
+  const data = await fetchData(); // 비동기 작업 대기
+  console.log(data);
+  console.log('End');
+})();
+
+// Start
+// Data received!
+// End
+```
+
+## async/await 데코레이터
+- 아직 실험적 기능지만 개발환경에선 사용 가능 (타입스크립트나 바벨 플러그인 쓰면 적용가능)
+
+> 데코레이터는 HOC와 비슷해서 꺼려짐
+