Promise
<aside>
๐ก ๋น๋๊ธฐ ์์
์ ์ฒ๋ฆฌํ๋๋ฐ ์ฌ์ฉ๋๋ ๊ฐ์ฒด
</aside>
const promise = new Promise((resolve, reject) => {
});
- promise๊ฐ ์์ฑ๋ ์์ ์ ์ ์๋์ง ์์ ๊ฐ์ ํํํ๊ธฐ ์ํ ๋์ฒด์ฌ
- ๋น๋๊ธฐ ์ฐ์ฐ์ด ์ข
๋ฃ๋ ์ดํ์ ๊ฒฐ๊ณผ ๊ฐ๊ณผ ์คํจ ์ฌ์ ๋ฅผ ์ฒ๋ฆฌํ๊ธฐ ์ํ handler๋ฅผ ์ฐ๊ฒฐํ ์ ์๋ค.
- ๊ทธ๋ ๊ธฐ์ promise๊ฐ ๋ฐํํ๋ ๊ฒ์ ๊ฒฐ๊ณผโ๊ฐโ์ด ์๋๋ผ, ์ถํ์ ์ด๋ค ์์ ์ ๊ฒฐ๊ณผ๋ฅผ ์ ๊ณตํ๊ฒ ๋ค๋ ์ฝ์, โPromiseโ๋ฅผ ๋ฐํํ๋ค.
์ ๋์์ฃ ?
- JS๋ ๋น๋๊ธฐ ์ฒ๋ฆฌ๋ฅผ ์ํ ๋ฐฉ๋ฒ์ผ๋ก ๋น์ ์ฝ๋ฐฑ ํจ์๋ฅผ ์ฌ์ฉํด ์๋๋ฐ, ์ ํต์ ์ธ ์ฝ๋ฐฑ ํจํด์ Callback Hell๋ก๋ ๋ถ๋ฆฌ๋ ๋ฎ์ ๊ฐ๋
์ฑ, ๋น๋๊ธฐ ์ฒ๋ฆฌ ์ค ๋ฐ์ํ ์๋ฌ ์ฒ๋ฆฌ์ ์ด๋ ค์, ๋ค์์ ๋น๋๊ธฐ ์ฒ๋ฆฌ๋ฅผ ๋์์ ์ฒ๋ฆฌํ๋ ๊ฒ์๋ ํ๊ณ๊ฐ ์์๋ค.

- ์ด๋ฅผ ์ฒ๋ฆฌํ๊ธฐ ์ํด ES6์์ ๋์
๋ ํจํด์ด Promise๋ค.
new Promise {
state: pending | fulfilled | rejected
result: undefined | value | error
}
- Promise ๊ฐ์ฒด๋ ๊ธฐ๋ณธ์ ์ผ๋ก
state
์ result
์์ฑ์ ๊ฐ์ง๋ฉฐ,
- state
- pending(๋๊ธฐ)
- fulfilled(์ดํ๋จ)
- rejected(๊ฑฐ๋ถ๋จ)
- result
์์ ๊ฐ์ด ์ํฉ์ ๋ฐ๋ผ ์์ฑ๋ณ 3๊ฐ์ง์ ์ํ๋ฅผ ๊ฐ์ง๋ค.
- React Suspense ์ญ์ Promise์ state๋ฅผ ๊ธฐ๋ฐ์ผ๋ก ๋ง๋ค์ด์ก๋ค.
