- ex) ์ฝ๋ฐฑ, ํ๋ก๋ฏธ์ค, async await
- ex) ๋น๋๊ธฐ ์ฒ๋ฆฌ์ ํน์ฑ ๋ฐ ์๋ฌ ์ฒ๋ฆฌ ๋ฐฉ๋ฒ?
๐ฌ Answer
๐ ๋๊ธฐ์ ๋น๋๊ธฐ
๐ ๋๊ธฐ(synchronous)
๋๊ธฐ๋ ์์ฒญ์ ๋ณด๋ธ ํ ์๋ต์ ๋ฐ์์ผ์ง๋ง ๋ค์ ๋์์ด ์ด๋ฃจ์ด์ง๋ ๋ฐฉ์
๋ชจ๋ ์ผ์ด ์์ฐจ์ ์ผ๋ก ์คํ๋จ.
๐ ๋น๋๊ธฐ(Asynchronous)
์์ฒญ์ ์ฆ์ ์ฒ๋ฆฌํ์ง ์์๋ ๊ทธ ๋๊ธฐ ์๊ฐ ๋์ ๋ ๋ค๋ฅธ ๋์์ด ์ด๋ฃจ์ด์ง๋ ๋ฐฉ์
๋ชจ๋ ์ผ์ด ๋ณ๋ ฌ์ ์ผ๋ก ์คํ
๐ Callback๊ณผ Promise, Async & Await
๐ Callback
- ๋ง ๊ทธ๋๋ก ๋์ค์ ํธ์ถํ ํจ์.
- ์ฒ๋ฆฌ ์์๋ฅผ ๋ณด์ฅํ๊ธฐ ์ํด ํจ์๋ฅผ ์ค์ฒฉํ๊ฒ ์ฌ์ฉํ์ฌ Callback Hell์ด ๋ฐ์
- ์๋ฌ ํธ๋ค๋ง๋ ๊ฐ ์ฝ๋ฐฑํจ์๋ง๋ค ํด์ค์ผ๋์ ๊ฐ๋
์ฑ์ด ๋จ์ด์ง.
๐ Promise
- ์ด๋ค ์์
์ ์ค๊ฐ ์ํ๋ฅผ ๋ํ๋ด๋ Object
- ๋ฏธ๋์ ์ด๋ค ์ข
๋ฅ์ ๊ฒฐ๊ณผ๊ฐ ๋ฐํ๋จ์ ์ฝ์ํด์ฃผ๋ Object
- ES6๋ถํฐ Callback์ ๋จ์ ์ ๋ณด์ํจ.
- ์คํ์ด ์ ์ฑ๊ณตํ๋์ง, ์คํจํ๋์ง, ์ฑ๊ณตor ์คํจ๊ฒฐ๊ณผ๊ฐ ๋ฌด์์ธ์ง ๋ฐํ
- ์์ฑ์ ํจ์๋ฅผ ์ด์ฉํ์ฌ ์ธ์คํด์คํ.
- then๊ณผ catch๋ก ์ ๊ทผ์ด ๊ฐ๋ฅํ๊ณ , finally๋ ์ฒ๋ฆฌ๋ง ๋๋ ํจ์
๐ Async & Await
- ๊ฐ์ฅ ์ต๊ทผ์ ๋์จ ๋น๋๊ธฐ ์ฒ๋ฆฌ ํจํด
- ๊ธฐ์กด์ ๋น๋๊ธฐ ์ฒ๋ฆฌ ๋ฐฉ์์ธ callback๊ณผ promise์ ๋จ์ ์ ๋ณด์
- ํจ์ ์๋ถ๋ถ์ async, ํจ์ ๋ด๋ถ์ Promise์ ์๋ถ๋ถ์ await ์ฌ์ฉ.
- ๋๊ธฐ์ ์ธ ํ๋ฆ์ผ๋ก ๊ฐ๋ฐ์ด ๊ฐ๋ฅ.
- ๊ฐ๋ฐ์๊ฐ ์ฝ๊ธฐ ์ข์ ์ฝ๋๋ฅผ ์์ฑํ ์ ์๊ฒํจ.
- try catch๋ก ํธ๋ค๋ง
๐ ์ฐธ๊ณ
https://joshua1988.github.io/web-development/javascript/js-async-await/#async--await
https://sunnykim91.tistory.com/121