-
Notifications
You must be signed in to change notification settings - Fork 0
/
12367934.7f7bba26.js
1 lines (1 loc) · 49.6 KB
/
12367934.7f7bba26.js
1
(window.webpackJsonp=window.webpackJsonp||[]).push([[30],{482:function(e,t,r){"use strict";r.d(t,"a",(function(){return p})),r.d(t,"b",(function(){return j}));var n=r(0),l=r.n(n);function a(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function o(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function c(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?o(Object(r),!0).forEach((function(t){a(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):o(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function i(e,t){if(null==e)return{};var r,n,l=function(e,t){if(null==e)return{};var r,n,l={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(l[r]=e[r]);return l}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r])}return l}var s=l.a.createContext({}),b=function(e){var t=l.a.useContext(s),r=t;return e&&(r="function"==typeof e?e(t):c(c({},t),e)),r},p=function(e){var t=b(e.components);return l.a.createElement(s.Provider,{value:t},e.children)},m={inlineCode:"code",wrapper:function(e){var t=e.children;return l.a.createElement(l.a.Fragment,{},t)}},u=l.a.forwardRef((function(e,t){var r=e.components,n=e.mdxType,a=e.originalType,o=e.parentName,s=i(e,["components","mdxType","originalType","parentName"]),p=b(r),u=n,j=p["".concat(o,".").concat(u)]||p[u]||m[u]||a;return r?l.a.createElement(j,c(c({ref:t},s),{},{components:r})):l.a.createElement(j,c({ref:t},s))}));function j(e,t){var r=arguments,n=t&&t.mdxType;if("string"==typeof e||n){var a=r.length,o=new Array(a);o[0]=u;var c={};for(var i in t)hasOwnProperty.call(t,i)&&(c[i]=t[i]);c.originalType=e,c.mdxType="string"==typeof e?e:n,o[1]=c;for(var s=2;s<a;s++)o[s]=r[s];return l.a.createElement.apply(null,o)}return l.a.createElement.apply(null,r)}u.displayName="MDXCreateElement"},93:function(e,t,r){"use strict";r.r(t),r.d(t,"frontMatter",(function(){return o})),r.d(t,"metadata",(function(){return c})),r.d(t,"toc",(function(){return i})),r.d(t,"default",(function(){return b}));var n=r(3),l=r(7),a=(r(0),r(482)),o={},c={unversionedId:"javascript/asynchronous_programming/Promise",id:"javascript/asynchronous_programming/Promise",isDocsHomePage:!1,title:"Promise",description:"Promise",source:"@site/docs/javascript/asynchronous_programming/Promise.md",slug:"/javascript/asynchronous_programming/Promise",permalink:"/docs/javascript/asynchronous_programming/Promise",version:"current",lastUpdatedAt:1626882853,sidebar:"javascript",previous:{title:"\ucf5c\ubc31 Callback",permalink:"/docs/javascript/asynchronous_programming/\ucf5c\ubc31 Callback"},next:{title:"JOBS",permalink:"/docs/javascript/asynchronous_programming/JOBS"}},i=[{value:"Promise",id:"promise",children:[]},{value:"Promise \uac1d\uccb4 \uc0dd\uc131",id:"promise-\uac1d\uccb4-\uc0dd\uc131",children:[]},{value:"\ube44\ub3d9\uae30 \uc791\uc5c5\uc744 \ud558\ub294 Promise \uac1d\uccb4 \uc0dd\uc131",id:"\ube44\ub3d9\uae30-\uc791\uc5c5\uc744-\ud558\ub294-promise-\uac1d\uccb4-\uc0dd\uc131",children:[]},{value:"Promise \uc0dd\uc131\uc790",id:"promise-\uc0dd\uc131\uc790",children:[]},{value:"Promise \uac1d\uccb4\uc758 \ub0b4\ubd80 \ud504\ub85c\ud37c\ud2f0",id:"promise-\uac1d\uccb4\uc758-\ub0b4\ubd80-\ud504\ub85c\ud37c\ud2f0",children:[]},{value:"Promise \ud578\ub4e4\ub7ec .then/catch/finally",id:"promise-\ud578\ub4e4\ub7ec-thencatchfinally",children:[{value:"Promise Executor \uc640 Handler \uc758 Error \ucc98\ub9ac",id:"promise-executor-\uc640-handler-\uc758-error-\ucc98\ub9ac",children:[]},{value:"then",id:"then",children:[]},{value:"catch",id:"catch",children:[]},{value:"finally",id:"finally",children:[]}]},{value:"HTTP \ud1b5\uc2e0\uc758 Promise",id:"http-\ud1b5\uc2e0\uc758-promise",children:[]},{value:"Promise.all(iterable)",id:"promisealliterable",children:[{value:"\ub9e4\uac1c\ubcc0\uc218",id:"\ub9e4\uac1c\ubcc0\uc218",children:[]},{value:"\ubc18\ud658 \uac12",id:"\ubc18\ud658-\uac12",children:[]},{value:"\uc608\uc2dc",id:"\uc608\uc2dc",children:[]}]},{value:"Promise.allSettled",id:"promiseallsettled",children:[]},{value:"Promise.race(iterable)",id:"promiseraceiterable",children:[{value:"\ubc18\ud658 \uac12",id:"\ubc18\ud658-\uac12-1",children:[]}]},{value:"Promise.resolve(value)",id:"promiseresolvevalue",children:[]},{value:"Promise.reject(error)",id:"promiserejecterror",children:[]},{value:"\ud504\ub85c\ubbf8\uc2a4\ud654 Promisification",id:"\ud504\ub85c\ubbf8\uc2a4\ud654-promisification",children:[{value:"\ucf5c\ubc31\uc758 setTimeout \uc744 Promise \ub85c \ub9cc\ub4e4\uae30",id:"\ucf5c\ubc31\uc758-settimeout-\uc744-promise-\ub85c-\ub9cc\ub4e4\uae30",children:[]}]},{value:"\ub9c8\uc774\ud06c\ub85c \ud0dc\uc2a4\ud06c",id:"\ub9c8\uc774\ud06c\ub85c-\ud0dc\uc2a4\ud06c",children:[{value:"\ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c \ud050 (PromiseJobs)",id:"\ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c-\ud050-promisejobs",children:[]},{value:"\ucc98\ub9ac\ub418\uc9c0 \ubabb\ud55c \uac70\ubd80 unhandledrejection",id:"\ucc98\ub9ac\ub418\uc9c0-\ubabb\ud55c-\uac70\ubd80-unhandledrejection",children:[]}]},{value:"Promise \uc7a5\uc810",id:"promise-\uc7a5\uc810",children:[]},{value:"Promise \uc758 \ube44\ud310",id:"promise-\uc758-\ube44\ud310",children:[]},{value:"thenable \uac1d\uccb4\ub97c \ubc18\ud658\ud558\ub294 \ud578\ub4e4\ub7ec",id:"thenable-\uac1d\uccb4\ub97c-\ubc18\ud658\ud558\ub294-\ud578\ub4e4\ub7ec",children:[{value:"thenable \uac1d\uccb4",id:"thenable-\uac1d\uccb4",children:[]}]}],s={toc:i};function b(e){var t=e.components,r=Object(l.a)(e,["components"]);return Object(a.b)("wrapper",Object(n.a)({},s,r,{components:t,mdxType:"MDXLayout"}),Object(a.b)("h2",{id:"promise"},"Promise"),Object(a.b)("p",null,"\uc5b8\uc820\uac00 \ub05d\ub098\ub294 \uc791\uc5c5\uc758 \uacb0\uacfc\uac12\uc744 \ub2f4\ub294 \uac1d\uccb4"),Object(a.b)("h2",{id:"promise-\uac1d\uccb4-\uc0dd\uc131"},"Promise \uac1d\uccb4 \uc0dd\uc131"),Object(a.b)("p",null,"\uc815\uc801 \uba54\uc11c\ub4dc ",Object(a.b)("inlineCode",{parentName:"p"},"Promise.resolve")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const p = Promise.resolve(1);\n")),Object(a.b)("p",null,"Promise \uac1d\uccb4\uc758 \ud504\ub85c\ud37c\ud2f0"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-text"},'[[PromiseState]]: "fulfilled"\n[[PromiseResult]]: 1\n')),Object(a.b)("h2",{id:"\ube44\ub3d9\uae30-\uc791\uc5c5\uc744-\ud558\ub294-promise-\uac1d\uccb4-\uc0dd\uc131"},"\ube44\ub3d9\uae30 \uc791\uc5c5\uc744 \ud558\ub294 Promise \uac1d\uccb4 \uc0dd\uc131"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const p = new Promise((resolve, reject) => {\n setTimeout(() => {\n console.log('2\ucd08\uac00 \uc9c0\ub0ac\uc2b5\ub2c8\ub2e4. ');\n resolve('hello');\n }, 2000);\n})\n")),Object(a.b)("h2",{id:"promise-\uc0dd\uc131\uc790"},"Promise \uc0dd\uc131\uc790"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},'Promise \uc0dd\uc131\uc790\uc758 \uc778\uc218 "',Object(a.b)("strong",{parentName:"li"},"\ucf5c\ubc31"),'"',Object(a.b)("ul",{parentName:"li"},Object(a.b)("li",{parentName:"ul"},"executor(\uc2e4\ud589\uc790, \uc2e4\ud589 \ud568\uc218)"),Object(a.b)("li",{parentName:"ul"},"new Promise \uc0dd\uc131\uc790\ub85c \ud504\ub85c\ubbf8\uc2a4\uac00 \ub9cc\ub4e4\uc5b4 \uc9c8 \ub54c \uc790\ub3d9\uc73c\ub85c \uc2e4\ud589\ub428"))),Object(a.b)("li",{parentName:"ul"},"\ucf5c\ubc31(Executor) \uc758 \uc778\uc218",Object(a.b)("ul",{parentName:"li"},Object(a.b)("li",{parentName:"ul"},"\uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8 \uc5d4\uc9c4\uc774 \ubbf8\ub9ac \uc815\uc758\ud55c \ud568\uc218")),Object(a.b)("ol",{parentName:"li"},Object(a.b)("li",{parentName:"ol"},Object(a.b)("inlineCode",{parentName:"li"},"resolve(value)"),Object(a.b)("ul",{parentName:"li"},Object(a.b)("li",{parentName:"ul"},"\uc77c\uc774 \uc131\uacf5\uc801\uc73c\ub85c \ub05d\ub09c \uacbd\uc6b0 Executor \uc548\uc5d0\uc11c resolve(value) \ub97c \ud638\ucd9c"),Object(a.b)("li",{parentName:"ul"},"(value)\uc774 Promise \uac1d\uccb4\uc758 [","[PromiseResult]","] \uac12"))),Object(a.b)("li",{parentName:"ol"},Object(a.b)("inlineCode",{parentName:"li"},"reject(error)"),Object(a.b)("ul",{parentName:"li"},Object(a.b)("li",{parentName:"ul"},"\uc5d0\ub7ec \ubc1c\uc0dd \uc2dc \uc5d0\ub7ec \uac1d\uccb4\ub97c \ub098\ud0c0\ub0b4\ub294 error \uc640 \ud568\uaed8 \ud638\ucd9c")))))),Object(a.b)("h2",{id:"promise-\uac1d\uccb4\uc758-\ub0b4\ubd80-\ud504\ub85c\ud37c\ud2f0"},"Promise \uac1d\uccb4\uc758 \ub0b4\ubd80 \ud504\ub85c\ud37c\ud2f0"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"state ",Object(a.b)("inlineCode",{parentName:"li"},"[[PromiseState]]"),Object(a.b)("ul",{parentName:"li"},Object(a.b)("li",{parentName:"ul"},Object(a.b)("strong",{parentName:"li"},"pending")," (\ub300\uae30) : \ucc98\uc74c \uac12"),Object(a.b)("li",{parentName:"ul"},"settled : \ucc98\ub9ac\ub41c Promise",Object(a.b)("ol",{parentName:"li"},Object(a.b)("li",{parentName:"ol"},Object(a.b)("strong",{parentName:"li"},"fulfilled")," (\uc774\ud589) : resolve \uac00 \ud638\ucd9c \ub420 \ub54c"),Object(a.b)("li",{parentName:"ol"},Object(a.b)("strong",{parentName:"li"},"rejected")," (\uac70\ubd80\ub428) : reject \uac00 \ud638\ucd9c \ub420 \ub54c"))))),Object(a.b)("li",{parentName:"ul"},"result ",Object(a.b)("inlineCode",{parentName:"li"},"[[PromiseResult]]"),Object(a.b)("ol",{parentName:"li"},Object(a.b)("li",{parentName:"ol"},Object(a.b)("strong",{parentName:"li"},"undefined")," : \ucc98\uc74c \uac12"),Object(a.b)("li",{parentName:"ol"},Object(a.b)("strong",{parentName:"li"},"value")," : ",Object(a.b)("inlineCode",{parentName:"li"},"resolve(value)")," \uac00 \ud638\ucd9c \ub420 \ub54c"),Object(a.b)("li",{parentName:"ol"},Object(a.b)("strong",{parentName:"li"},"error")," : ",Object(a.b)("inlineCode",{parentName:"li"},"reject(error)")," \uac00 \ud638\ucd9c\ub420 \ub54c")))),Object(a.b)("p",null,Object(a.b)("img",{parentName:"p",src:"https://user-images.githubusercontent.com/31977543/91831267-d2822380-ec7e-11ea-8422-e68fc9d6787c.png",alt:"image"})),Object(a.b)("h2",{id:"promise-\ud578\ub4e4\ub7ec-thencatchfinally"},"Promise \ud578\ub4e4\ub7ec .then/catch/finally"),Object(a.b)("p",null,"\ucc98\ub9ac\ub41c Promise \ud578\ub4e4\ub7ec\ub294 \uc989\uac01 \uc2e4\ud589\ub41c\ub2e4."),Object(a.b)("p",null,".then/catch/finally \ud578\ub4e4\ub7ec\ub294 Promise \uac00 \ucc98\ub9ac\ub418\uae38 \uae30\ub2e4\ub9b0\ub2e4."),Object(a.b)("p",null,"Promise \uac00 \uc774\ubbf8 \ucc98\ub9ac\ub41c \uc0c1\ud0dc\ub77c\uba74 \uc989\uac01 \uc2e4\ud589\ub41c\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'// \uc544\ub798 \ud504\ub77c\ubbf8\uc2a4\ub294 \uc0dd\uc131\uacfc \ub3d9\uc2dc\uc5d0 \uc774\ud589\ub429\ub2c8\ub2e4.\nlet promise = new Promise(resolve => resolve("\uc644\ub8cc!"));\npromise.then(alert); // \uc644\ub8cc! (\ubc14\ub85c \ucd9c\ub825\ub428)\n')),Object(a.b)("h3",{id:"promise-executor-\uc640-handler-\uc758-error-\ucc98\ub9ac"},"Promise Executor \uc640 Handler \uc758 Error \ucc98\ub9ac"),Object(a.b)("p",null,"\ubcf4\uc774\uc9c0 \uc54a\ub294 try..catch \uac00 \uc788\ub2e4. "),Object(a.b)("ol",null,Object(a.b)("li",{parentName:"ol"},"\uc608\uc678\ub97c \uc7a1\uace0 \uc774\ub97c reject \ucc98\ub7fc \ub2e4\ub8ec\ub2e4."),Object(a.b)("li",{parentName:"ol"},"\uc81c\uc5b4\uc758 \ud750\ub984\uc774 \uac00\uc7a5 \uac00\uae4c\uc6b4 \uc5d0\ub7ec \ud578\ub4e4\ub7ec\ub85c \ub118\uc5b4\uac04\ub2e4.")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'new Promise((resolve, reject) => {\n throw new Error("\uc5d0\ub7ec \ubc1c\uc0dd!"); // reject(new Error("\uc5d0\ub7ec \ubc1c\uc0dd!"));\n}).catch(alert); // Error: \uc5d0\ub7ec \ubc1c\uc0dd!\n')),Object(a.b)("h3",{id:"then"},"then"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"Promise \uacb0\uacfc\uac12\uc5d0 \ub300\ud55c \ucd94\uac00 \uc791\uc5c5"),Object(a.b)("li",{parentName:"ul"},"Promise \uac1d\uccb4\uc5d0 then \uba54\uc11c\ub4dc\ub97c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub2e4.")),Object(a.b)("h4",{id:"then-\uc778\uc790"},"then \uc778\uc790"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\uccab\ubc88\uc9f8 \uc778\uc218. Promise \uac00 \uc774\ud589\ub418\uc5c8\uc744 \ub54c \uc2e4\ud589\ud558\ub294 \ud568\uc218"),Object(a.b)("li",{parentName:"ul"},"\ub450\ubc88\uc9f8 \uc778\uc218. Promise \uac00 \uac70\ubd80\ub418\uc5c8\uc744 \ub54c \uc2e4\ud589\ud558\ub294 \ud568\uc218\n")),Object(a.b)("p",null,"\ucf5c\ubc31\uc758 \uccab\ubc88\uc9f8 \uc778\uc218 : Promise \uac1d\uccb4\uc758 ",Object(a.b)("inlineCode",{parentName:"p"},"[[PromiseResult]]")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'let promise = new Promise(function(resolve, reject) {\n setTimeout(() => resolve("done!"), 1000);\n});\n\n// resolve \ud568\uc218\ub294 .then\uc758 \uccab \ubc88\uc9f8 \ud568\uc218(\uc778\uc218)\ub97c \uc2e4\ud589\ud569\ub2c8\ub2e4.\npromise.then(\n result => alert(result), // 1\ucd08 \ud6c4 "done!"\uc744 \ucd9c\ub825\n error => alert(error) // \uc2e4\ud589\ub418\uc9c0 \uc54a\uc74c\n);\n')),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'let promise = new Promise(function(resolve, reject) {\n setTimeout(() => reject(new Error("\uc5d0\ub7ec \ubc1c\uc0dd!")), 1000);\n});\n\n// reject \ud568\uc218\ub294 .then\uc758 \ub450 \ubc88\uc9f8 \ud568\uc218\ub97c \uc2e4\ud589\ud569\ub2c8\ub2e4.\npromise.then(\n result => alert(result), // \uc2e4\ud589\ub418\uc9c0 \uc54a\uc74c\n error => alert(error) // 1\ucd08 \ud6c4 "Error: \uc5d0\ub7ec \ubc1c\uc0dd!"\ub97c \ucd9c\ub825\n);\n')),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'let promise = new Promise(resolve => {\n setTimeout(() => resolve("done!"), 1000);\n});\n\npromise.then(alert); // 1\ucd08 \ub4a4 "done!" \ucd9c\ub825\n\npromise.then(msg => {\n console.log(msg); // done!\n});\n')),Object(a.b)("h4",{id:"then-\uba54\uc11c\ub4dc\uc758-\ubc18\ud658-\uac12"},"then \uba54\uc11c\ub4dc\uc758 \ubc18\ud658 \uac12"),Object(a.b)("p",null,"Promise \uac1d\uccb4"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const promise = promise.then(msg => {\n return msg + ' world';\n});\n\npromise.then(msg => {\n console.log(msg); // hello world\n});\n")),Object(a.b)("h4",{id:"then-\uba54\uc11c\ub4dc\uc758-return-\uac12"},"then \uba54\uc11c\ub4dc\uc758 return \uac12"),Object(a.b)("p",null,"Promise \uac1d\uccb4\uc758 [","[PromiseResult]","] \uac12"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"promise.then(msg => {\n return msg + ' world';\n}).then(msg => {\n console.log(msg);\n});\n")),Object(a.b)("h3",{id:"catch"},"catch"),Object(a.b)("p",null,"\uc5d0\ub7ec\uac00 \ubc1c\uc0dd\ud55c \uacbd\uc6b0\ub9cc \ub2e4\ub8e8\uace0 \uc2f6\uc744 \ub54c"),Object(a.b)("ol",null,Object(a.b)("li",{parentName:"ol"},"null \uc744 then \uc758 \uccab\ubc88\uc9f8 \uc778\uc218\ub85c \uc804\ub2ec\ud55c\ub2e4.\n",Object(a.b)("inlineCode",{parentName:"li"},".then(null, errorHandlingFunction)")),Object(a.b)("li",{parentName:"ol"},Object(a.b)("inlineCode",{parentName:"li"},".catch(errorHandlingFunction)"))),Object(a.b)("p",null,"\ub450\uac00\uc9c0 \ubc29\uc2dd\uc740 \ub611\uac19\uc774 \ub3d9\uc791\ud55c\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'let promise = new Promise((resolve, reject) => {\n setTimeout(() => reject(new Error("\uc5d0\ub7ec \ubc1c\uc0dd!")), 1000);\n});\n\n// .catch(f)\ub294 promise.then(null, f)\uacfc \ub3d9\uc77c\ud558\uac8c \uc791\ub3d9\ud569\ub2c8\ub2e4\npromise.catch(alert); // 1\ucd08 \ub4a4 "Error: \uc5d0\ub7ec \ubc1c\uc0dd!" \ucd9c\ub825\n')),Object(a.b)("p",null,"\uc5d0\ub7ec\uac00 \uc131\uacf5\uc801\uc73c\ub85c \ucc98\ub9ac\ub418\uba74, \uac00\uc7a5 \uac00\uae4c\uc6b4 \uacf3\uc5d0 \uc788\ub294 .then \ud578\ub4e4\ub7ec\ub85c \uc81c\uc5b4\ud750\ub984\uc774 \ub118\uc5b4\uac00 \uc2e4\ud589\uc774 \uc774\uc5b4\uc9c4\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'new Promise((resolve, reject) => {\n throw new Error("\uc5d0\ub7ec \ubc1c\uc0dd!");\n}).catch(function(error) {\n alert("\uc5d0\ub7ec\uac00 \uc798 \ucc98\ub9ac\ub418\uc5c8\uc2b5\ub2c8\ub2e4. \uc815\uc0c1\uc801\uc73c\ub85c \uc2e4\ud589\uc774 \uc774\uc5b4\uc9d1\ub2c8\ub2e4.");\n}).then(() => alert("\ub2e4\uc74c \ud578\ub4e4\ub7ec\uac00 \uc2e4\ud589\ub429\ub2c8\ub2e4."));\n')),Object(a.b)("p",null,"\uc5d0\ub7ec\uac00 \uc131\uacf5\uc801\uc73c\ub85c \ucc98\ub9ac\ub418\uc9c0 \uc54a\uc558\uc744 \ub54c, \uc5d0\ub7ec\ub97c \ub2e4\uc2dc \ub358\uc9c4\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'// \uc2e4\ud589 \uc21c\uc11c: catch -> catch\nnew Promise((resolve, reject) => {\n throw new Error("\uc5d0\ub7ec \ubc1c\uc0dd!");\n}).catch(function(error) { // (*)\n if (error instanceof URIError) {\n // \uc5d0\ub7ec \ucc98\ub9ac\n } else {\n alert("\ucc98\ub9ac\ud560 \uc218 \uc5c6\ub294 \uc5d0\ub7ec");\n throw error; // \uc5d0\ub7ec \ub2e4\uc2dc \ub358\uc9c0\uae30\n }\n}).then(function() {\n /* \uc5ec\uae30\ub294 \uc2e4\ud589\ub418\uc9c0 \uc54a\uc2b5\ub2c8\ub2e4. */\n}).catch(error => { // (**)\n alert(`\uc54c \uc218 \uc5c6\ub294 \uc5d0\ub7ec\uac00 \ubc1c\uc0dd\ud568: ${error}`);\n // \ubc18\ud658\uac12\uc774 \uc5c6\uc74c => \uc2e4\ud589\uc774 \uacc4\uc18d\ub428\n});\n')),Object(a.b)("h4",{id:"unhandledrejection"},"unhandledrejection"),Object(a.b)("p",null,"\uac70\ubd80\ub41c Promise \ub97c \ucc98\ub9ac\ud558\uc9c0 \ubabb\ud560 \uacbd\uc6b0 \uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8 \uc5d4\uc9c4\uc740 \uc804\uc5ed \uc5d0\ub7ec\ub97c \ubc1c\uc0dd\uc2dc\ud0a8\ub2e4.\n\ube0c\ub77c\uc6b0\uc800 \ud658\uacbd\uc5d0\uc120 \uc774\ub7f0 \uc5d0\ub7ec\ub97c ",Object(a.b)("inlineCode",{parentName:"p"},"unhandledrejection")," \uc774\ubca4\ud2b8\ub85c \uc7a1\uc744 \uc218 \uc788\ub2e4."),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\ucc98\ub9ac\ub418\uc9c0 \uc54a\uc740 \uc5d0\ub7ec \ucd94\uc801"),Object(a.b)("li",{parentName:"ul"},"\uc774\ub7f0 \uc5d0\ub7ec\ub97c \uc0ac\uc6a9\uc790(\ud639\uc740 \uc11c\ubc84)\uc5d0\uac8c \uc54c\ub824\uc11c \uc571\uc774 \uc544\ubb34\ub7f0 \uc124\uba85\uc5c6\uc774 '\uadf8\ub0e5 \uc8fd\ub294\uac78' \ubc29\uc9c0\ud55c\ub2e4.")),Object(a.b)("h4",{id:"settimeout-\uc5d0\uc11c\uc758-\uc5d0\ub7ec"},"setTimeout \uc5d0\uc11c\uc758 \uc5d0\ub7ec"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'new Promise(function(resolve, reject) {\n setTimeout(() => {\n throw new Error("\uc5d0\ub7ec \ubc1c\uc0dd!");\n }, 1000);\n}).catch(alert);\n')),Object(a.b)("p",null,"\ubaa8\ub4e0 \ub3d9\uae30\uc801 \uc5d0\ub7ec\ub294 try..catch \uc5d0\uc11c \ucc98\ub9ac\ub418\uc9c0\ub9cc\nsetTimeout \uc740 Executor \uac00 \ub05d\ub09c \ud6c4 \ubc1c\uc0dd\ud558\uae30 \ub54c\ubb38\uc5d0 Promise \uc5d0\uc11c \uc5d0\ub7ec\ub97c \ucc98\ub9ac\ud560 \uc218 \uc5c6\ub2e4."),Object(a.b)("h3",{id:"finally"},"finally"),Object(a.b)("p",null,"Promise \ucc98\ub9ac\uac00 \uc644\ub8cc\ub418\uba74, \uacb0\uacfc\uc640 \uc0c1\uad00\uc5c6\uc774 finally \ubb38\uc774 \uc2e4\ud589\ub41c\ub2e4."),Object(a.b)("p",null,"finally \ud578\ub4e4\ub7ec(\ucf5c\ubc31\uc758 \uc774\ub984)"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\uc778\uc218\uac00 \uc5c6\ub2e4."),Object(a.b)("li",{parentName:"ul"},"Promise \uc758 settled \uc0c1\ud0dc\ub97c \uc54c \uc218 \uc5c6\ub2e4"),Object(a.b)("li",{parentName:"ul"},"\uc790\ub3d9\uc73c\ub85c \ub2e4\uc74c \ud578\ub4e4\ub7ec\uc5d0 \uacb0\uacfc\uc640 \uc5d0\ub7ec\ub97c \uc804\ub2ec\ud55c\ub2e4.\n")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'new Promise((resolve, reject) => {\n setTimeout(() => resolve("\uacb0\uacfc"), 2000)\n})\n .finally(() => alert("\ud504\ub77c\ubbf8\uc2a4\uac00 \uc900\ube44\ub418\uc5c8\uc2b5\ub2c8\ub2e4."))\n .then(result => alert(result)); // <-- .then\uc5d0\uc11c result\ub97c \ub2e4\ub8f0 \uc218 \uc788\uc74c\n\nnew Promise((resolve, reject) => {\n throw new Error("\uc5d0\ub7ec \ubc1c\uc0dd!");\n})\n .finally(() => alert("\ud504\ub77c\ubbf8\uc2a4\uac00 \uc900\ube44\ub418\uc5c8\uc2b5\ub2c8\ub2e4."))\n .catch(err => alert(err)); // <-- .catch\uc5d0\uc11c \uc5d0\ub7ec \uac1d\uccb4\ub97c \ub2e4\ub8f0 \uc218 \uc788\uc74c\n')),Object(a.b)("h2",{id:"http-\ud1b5\uc2e0\uc758-promise"},"HTTP \ud1b5\uc2e0\uc758 Promise"),Object(a.b)("p",null,Object(a.b)("inlineCode",{parentName:"p"},"axios.get()")," \ud568\uc218\ub294 Promise \uac1d\uccb4\ub97c \ubc18\ud658\ud55c\ub2e4."),Object(a.b)("p",null,Object(a.b)("a",{parentName:"p",href:"./%EC%BD%9C%EB%B0%B1%20Callback"},"\ucf5c\ubc31"),"\uc758 \ube44\ub3d9\uae30 \ud504\ub85c\uadf8\ub798\ubc0d\uc758 \uc608\uc2dc\uc640 \ucf54\ub4dc\ub97c \ube44\uad50\ud574 \ubcf4\uc790"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"$.get(API_URL, issues => {\n console.log('\ucd5c\uadfc 10\uac1c\uc758 \uc774\uc288:');\n issues\n .map(issue => issue.title)\n .forEach(title => console.log(title));\n console.log('\ucd9c\ub825\uc774 \ub05d\ub0ac\uc2b5\ub2c8\ub2e4.');\n});\n")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const axios = require('axios');\nconst API_URL = 'https://api.github.com';\n\naxios.get(`${API_URL}/repos/facebookincubator/create-react-app/issues?per_page=10`)\n .then(res => {\n console.log('\ucd5c\uadfc 10\uac1c\uc758 \uc774\uc288:');\n res.data\n .map(issue => issue.title)\n .forEach(title => console.log(title));\n console.log('\ucd9c\ub825\uc774 \ub05d\ub0ac\uc2b5\ub2c8\ub2e4.');\n });\n")),Object(a.b)("hr",null),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const API_URL = 'https://api.github.com';\nconst starCount = {};\nconst axios = require('axios');\n\n// 1. Github\uc5d0 \uacf5\uac1c\ub418\uc5b4\uc788\ub294 \uc800\uc7a5\uc18c \uc911, \uc5b8\uc5b4\uac00 JavaScript\uc774\uace0 \ubcc4\ud45c\ub97c \uac00\uc7a5 \ub9ce\uc774 \ubc1b\uc740 \uc800\uc7a5\uc18c\ub97c \ubd88\ub7ec\uc628\ub2e4.\naxios.get(`${API_URL}/search/repositories?q=language:javascript&sort=stars&per_page=1`)\n // 2. \uc704 \uc800\uc7a5\uc18c\uc5d0 \uac00\uc7a5 \ub9ce\uc774 \uae30\uc5ec\ud55c \uae30\uc5ec\uc790 5\uba85\uc758 \uc815\ubcf4\ub97c \ubd88\ub7ec\uc628\ub2e4.\n .then(res => axios.get(`${API_URL}/repos/${res.data.items[0].full_name}/contributors?per_page=5`))\n // 3. \ud574\ub2f9 \uae30\uc5ec\uc790\ub4e4\uc774 \ucd5c\uadfc\uc5d0 Github\uc5d0\uc11c \ubcc4\ud45c\ub97c \ud55c \uc800\uc7a5\uc18c\ub97c \uac01\uac01 10\uac1c\uc529 \ubd88\ub7ec\uc628\ub2e4.\n .then(res => {\n const ps = res.data.map(user => axios.get(`${API_URL}/users/${user.login}/starred?per_page=10`));\n return Promise.all(ps);\n })\n .then(ress => Promise.all(ress.map(r => r.data)))\n // 4. \ubd88\ub7ec\uc628 \uc800\uc7a5\uc18c\ub97c \ubaa8\ub450 \ubaa8\uc544, \uac1c\uc218\ub97c \uc13c \ud6c4 \uc800\uc7a5\uc18c\uc758 \uc774\ub984\uc744 \uac1c\uc218\uc640 \ud568\uaed8 \ucd9c\ub825\ud55c\ub2e4.\n .then(repoArrs => {\n for (let repoArr of repoArrs) {\n for (let repo of repoArr) {\n if (repo.full_name in starCount) {\n starCount[repo.full_name]++;\n } else {\n starCount[repo.full_name] = 1;\n }\n }\n }\n console.log(starCount);\n });\n\nconsole.log('fetching...');\n")),Object(a.b)("p",null,"\uc55e\uc11c ",Object(a.b)("a",{parentName:"p",href:"%EC%BD%9C%EB%B0%B1%20Callback.html#%EC%BD%9C%EB%B0%B1%EC%9D%98-%EC%97%90%EB%9F%AC-%EC%B2%98%EB%A6%AC"},"\ucf5c\ubc31\uc73c\ub85c \uad6c\ud604\ub41c loadScript")," \ub97c Promise \ub85c \ub098\ud0c0\ub0b4\uc5b4 \ubd05\uc2dc\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"function loadScript(src, callback) {\n let script = document.createElement('script');\n script.src = src;\n\n script.onload = () => callback(null, script);\n script.onerror = () => callback(new Error(`${src}\ub97c \ubd88\ub7ec\uc624\ub294 \ub3c4\uc911\uc5d0 \uc5d0\ub7ec\uac00 \ubc1c\uc0dd\ud568`));\n\n document.head.append(script);\n}\n")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"function loadScript(src) {\n return new Promise(function(resolve, reject) {\n let script = document.createElement('script');\n script.src = src;\n\n script.onload = () => resolve(script);\n script.onerror = () => reject(new Error(`${src}\ub97c \ubd88\ub7ec\uc624\ub294 \ub3c4\uc911\uc5d0 \uc5d0\ub7ec\uac00 \ubc1c\uc0dd\ud568`));\n\n document.head.append(script);\n });\n}\n\nlet promise = loadScript(\"https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js\");\n\npromise.then(\n script => alert(`${script.src}\uc744 \ubd88\ub7ec\uc654\uc2b5\ub2c8\ub2e4!`),\n error => alert(`Error: ${error.message}`)\n);\n\npromise.then(script => alert('\ub610\ub2e4\ub978 \ud578\ub4e4\ub7ec...'));\n")),Object(a.b)("h2",{id:"promisealliterable"},"Promise.all(iterable)"),Object(a.b)("p",null,"\uc5ec\ub7ec \ud504\ub85c\ubbf8\uc2a4\uc758 \uacb0\uacfc\ub97c \uc9d1\uacc4\ud560 \ub54c \uc0ac\uc6a9\ud55c\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const promise1 = Promise.resolve(3);\nconst promise2 = 42;\nconst promise3 = new Promise((resolve, reject) => {\n setTimeout(resolve, 100, 'foo');\n});\n\nPromise.all([promise1, promise2, promise3]).then((values) => {\n console.log(values);\n});\n// expected output: Array [3, 42, \"foo\"]\n")),Object(a.b)("h3",{id:"\ub9e4\uac1c\ubcc0\uc218"},"\ub9e4\uac1c\ubcc0\uc218"),Object(a.b)("p",null,Object(a.b)("inlineCode",{parentName:"p"},"iterable")," \uac1d\uccb4"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\ud504\ub85c\ubbf8\uc2a4 \uc0dd\uc131\uc790"),Object(a.b)("li",{parentName:"ul"},"\ud504\ub85c\ubbf8\uc2a4\uac00 \uc544\ub2cc \uac12"),Object(a.b)("li",{parentName:"ul"},"\uc774\ubbf8 \uc774\ud589\ub41c \ud504\ub85c\ubbf8\uc2a4 \uac1d\uccb4 ")),Object(a.b)("h3",{id:"\ubc18\ud658-\uac12"},"\ubc18\ud658 \uac12"),Object(a.b)("ol",null,Object(a.b)("li",{parentName:"ol"},"iterable \uc758 Promise \uac00 \ubaa8\ub450 \ucc98\ub9ac\ub428"),Object(a.b)("li",{parentName:"ol"},"\uc0c8\ub85c\uc6b4 Promise \ub97c \uc774\ud589 ")),Object(a.b)("h4",{id:"\uc0c8\ub85c\uc6b4-promise-\uc758-\uc774\ud589-\uac12-promiseresult"},"\uc0c8\ub85c\uc6b4 Promise \uc758 \uc774\ud589 \uac12 ",Object(a.b)("inlineCode",{parentName:"h4"},"[[PromiseResult]]")),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"iterable \uc758 Promise \ub4e4\uc758 ",Object(a.b)("inlineCode",{parentName:"li"},"[[PromiseResult]]")," \uc744 \ub2f4\uc740 \ubc30\uc5f4")),Object(a.b)("h4",{id:"\uc774\ubbf8-\uc774\ud589\ub41c-\ud504\ub85c\ubbf8\uc2a4-iterable--\ube44\ub3d9\uae30\uc131"},"\uc774\ubbf8 \uc774\ud589\ub41c \ud504\ub85c\ubbf8\uc2a4 iterable : \ube44\ub3d9\uae30\uc131"),Object(a.b)("p",null,"\uc774\ubbf8 \uc774\ud589\ub41c \ud504\ub85c\ubbf8\uc2a4\ub85c \ubc30\uc5f4 \uc5d0\uc11c\ub294 Promise.all \uc758 ",Object(a.b)("inlineCode",{parentName:"p"},"\ube44\ub3d9\uae30\uc131")," \uc774 \ub098\ud0c0\ub09c\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];\n\nconst p = Promise.all(resolvedPromisesArray);\nconsole.log(p); // (1) Promise { <state>: "pending" } \n\n// \ud638\ucd9c \uc2a4\ud0dd\uc744 \ube44\uc6b4 \ub2e4\uc74c \uc2e4\ud589\ud558\uae30 \uc704\ud574 setTimeout \uc744 \uc0ac\uc6a9\nsetTimeout(function() {\n console.log(\'the stack is now empty\'); // (2) the stack is now empty\n console.log(p); // (3) Promise { <state>: "fulfilled", <value>: Array[2] }\n});\n')),Object(a.b)("h4",{id:"promiseall-reject--\ube44\ub3d9\uae30\uc131"},"Promise.all() reject : \ube44\ub3d9\uae30\uc131"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)];\nconst p = Promise.all(mixedPromisesArray); // (1) Promise { <state>: "pending" } \nconsole.log(p); // (3) Promise { <state>: "rejected", <reason>: 44 }\nsetTimeout(function() {\n console.log(\'the stack is now empty\'); // (2) the stack is now empty\n console.log(p);\n});\n')),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"reject \uac00 \ubc1c\uc0dd\ud574\ub3c4 \ucde8\uc18c\ub418\uc9c0 \uc54a\uace0, \ub098\uba38\uc9c0 Promise \ub3c4 \uacb0\uacfc\ub97c \uc0b0\ucd9c\ud558\uc9c0\ub9cc \ubb34\uc2dc\ub41c\ub2e4."),Object(a.b)("li",{parentName:"ul"},"AbortController \ub97c \uc0ac\uc6a9\ud558\uba74 \ud504\ub85c\ubbf8\uc2a4 \ucde8\uc18c\uac00 \uac00\ub2a5\ud558\ub2e4.")),Object(a.b)("h4",{id:"\ube48-iterable--\ub3d9\uae30\uc131"},"\ube48 iterable : \ub3d9\uae30\uc131"),Object(a.b)("p",null,"\uc774\ubbf8 \uc774\ud589\ud55c Promise \uac1d\uccb4 \ubc18\ud658"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const p = Promise.all([]); // \uc989\uc2dc \uc774\ud589\ud568\nconsole.log(p); // (1) Promise { <state>: "fulfilled", <value>: Array[0] }\n')),Object(a.b)("h4",{id:"\ud504\ub85c\ubbf8\uc2a4\uac00-\uc5c6\ub294-iterable--\ube44\ub3d9\uae30\uc131"},"\ud504\ub85c\ubbf8\uc2a4\uac00 \uc5c6\ub294 iterable : \ube44\ub3d9\uae30\uc131"),Object(a.b)("blockquote",null,Object(a.b)("p",{parentName:"blockquote"},"\ud06c\ub86c 58 \uacbd\uc6b0 \uc774\ubbf8 \uc774\ud589\ud55c \ud504\ub85c\ubbf8\uc2a4 \ubc18\ud658")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const p = Promise.all([1337, "hi"]); // \ud504\ub85c\ubbf8\uc2a4\uac00 \uc544\ub2cc \uac12\uc740 \ubb34\uc2dc\ud558\uc9c0\ub9cc \ube44\ub3d9\uae30\uc801\uc73c\ub85c \uc2e4\ud589\ub428\nconsole.log(p); // (1) Promise { <state>: "pending" }\nsetTimeout(function() {\n console.log(\'the stack is now empty\'); // (2) the stack is now empty\n console.log(p2); //(3) Promise { <state>: "fulfilled", <value>: Array[2] }\n});\n')),Object(a.b)("h4",{id:"\ube48--\ud504\ub85c\ubbf8\uc2a4\uac00-\uc5c6\ub294-iterable-\uc774-\uc544\ub2cc-\uacbd\uc6b0"},"\ube48 || \ud504\ub85c\ubbf8\uc2a4\uac00 \uc5c6\ub294 iterable \uc774 \uc544\ub2cc \uacbd\uc6b0."),Object(a.b)("p",null,"Promise \uac00 \ubaa8\ub450 \uc774\ud589 \ub41c \ud6c4, \uc0c8 Promise \uac1d\uccb4\ub97c \ubc18\ud658\ud55c\ub2e4."),Object(a.b)("h3",{id:"\uc608\uc2dc"},"\uc608\uc2dc"),Object(a.b)("p",null,"\ubcf5\uc218\uc758 URL \uc5d0 \ub3d9\uc2dc\uc5d0 \uc694\uccad\uc744 \ubcf4\ub0b4\uace0, \ub2e4\uc6b4\ub85c\ub4dc\uac00 \ubaa8\ub450 \uc644\ub8cc\ub41c \ud6c4\uc5d0 \ucf58\ud150\uce20\ub97c \ucc98\ub9ac\ud560 \ub54c."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"let urls = [\n 'https://api.github.com/users/iliakan',\n 'https://api.github.com/users/remy',\n 'https://api.github.com/users/jeresig'\n];\n\n// fetch\ub97c \uc0ac\uc6a9\ud574 url\uc744 \ud504\ub77c\ubbf8\uc2a4\ub85c \ub9e4\ud551\ud569\ub2c8\ub2e4.\nlet requests = urls.map(url => fetch(url));\n\n// Promise.all\uc740 \ubaa8\ub4e0 \uc791\uc5c5\uc774 \uc774\ud589\ub420 \ub54c\uae4c\uc9c0 \uae30\ub2e4\ub9bd\ub2c8\ub2e4.\nPromise.all(requests)\n .then(responses => responses.forEach(\n response => alert(`${response.url}: ${response.status}`)\n ));\n")),Object(a.b)("h2",{id:"promiseallsettled"},"Promise.allSettled"),Object(a.b)("p",null,"\uc5ec\ub7ec \uc694\uccad \uc911 \ud558\ub098\uac00 \uc2e4\ud328\ud574\ub3c4 \ub2e4\ub978 \uc694\uccad \uacb0\uacfc\ub294 \ubc18\ud658\ud55c\ub2e4."),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\ubaa8\ub4e0 Promise \uac00 \ucc98\ub9ac\ub420 \ub54c\uae4c\uc9c0 \uae30\ub2e4\ub9b0\ub2e4.")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-text"},"[\n {status: 'fulfilled', value: ...\uc751\ub2f5...},\n {status: 'fulfilled', value: ...\uc751\ub2f5...},\n {status: 'rejected', reason: ...\uc5d0\ub7ec \uac1d\uccb4...}\n]\n")),Object(a.b)("h2",{id:"promiseraceiterable"},"Promise.race(iterable)"),Object(a.b)("h3",{id:"\ubc18\ud658-\uac12-1"},"\ubc18\ud658 \uac12"),Object(a.b)("p",null,"\ub300\uae30\uc911\uc778 Promise \uac1d\uccb4\ub97c \ubc18\ud658 (",Object(a.b)("inlineCode",{parentName:"p"},"[[PromiseResult]]")," \ub97c \ube44\ub3d9\uae30\uc801\uc73c\ub85c \uc804\ub2ec\ubc1b\uc74c)"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},Object(a.b)("inlineCode",{parentName:"li"},"[[PromiseResult]]")," iterable \uc5d0\uc11c \ucc98\uc74c\uc73c\ub85c \uc774\ud589\ud558\uac70\ub098 \uac70\ubd80\ud55c \ud504\ub85c\ubbf8\uc2a4 \uac1d\uccb4\uc758 \uac12")),Object(a.b)("h4",{id:"\uc774\ubbf8-\uc774\ud589\ub41c-\ud504\ub85c\ubbf8\uc2a4-\uac1d\uccb4-iterable--\ube44\ub3d9\uae30\uc131"},"\uc774\ubbf8 \uc774\ud589\ub41c \ud504\ub85c\ubbf8\uc2a4 \uac1d\uccb4 iterable : \ube44\ub3d9\uae30\uc131"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];\n\nconst p = Promise.race(resolvedPromisesArray);\nconsole.log(p); // (1) Promise { <state>: "pending" }\n\n// \ud638\ucd9c \uc2a4\ud0dd\uc744 \ube44\uc6b4 \ub2e4\uc74c \uc2e4\ud589\ud558\uae30 \uc704\ud574 setTimeout\uc744 \uc0ac\uc6a9\nsetTimeout(function(){\n console.log(\'the stack is now empty\'); // (2) the stack is now empty\n console.log(p); // (3) Promise { <state>: "fulfilled", <value>: 33 }\n});\n')),Object(a.b)("h4",{id:"\ube48-iterable"},"\ube48 iterable"),Object(a.b)("p",null,"\ubc18\ud658\ud55c Promise \ub294 \uc601\uc6d0\ud55c pending \uc0c1\ud0dc"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const foreverPendingPromise = Promise.race([]);\nconsole.log(foreverPendingPromise); // (1) Promise { <state>: "pending" }\nsetTimeout(function(){\n console.log(\'the stack is now empty\'); // (2) the stack is now empty\n console.log(foreverPendingPromise); // (3) Promise { <state>: "pending" }\n}); \n')),Object(a.b)("h4",{id:"\ud504\ub85c\ubbf8\uc2a4\uac00-\uc544\ub2cc\uac12-\uc774\ubbf8-\uc644\ub8cc\ub41c-\ud504\ub85c\ubbf8\uc2a4\uac1d\uccb4\uac00-\uc788\ub294-iterable--\ube44\ub3d9\uae30\uc131"},"\ud504\ub85c\ubbf8\uc2a4\uac00 \uc544\ub2cc\uac12, \uc774\ubbf8 \uc644\ub8cc\ub41c \ud504\ub85c\ubbf8\uc2a4\uac1d\uccb4\uac00 \uc788\ub294 iterable : \ube44\ub3d9\uae30\uc131"),Object(a.b)("p",null,"\uc774\ub7ec\ud55c \uac12\ub4e4 \uc911 \ucc98\uc74c\uc73c\ub85c \ub4f1\uc7a5\ud558\ub294 \uac12\uc744 \uacb0\uacfc\uac12\uc73c\ub85c \uc774\ud589"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'const foreverPendingPromise = Promise.race([]);\nconst alreadyFulfilledProm = Promise.resolve(666);\n\nconst arr = [foreverPendingPromise, alreadyFulfilledProm, "\ud504\ub85c\ubbf8\uc2a4 \uc544\ub2d8"];\nconst arr2 = [foreverPendingPromise, "\ud504\ub85c\ubbf8\uc2a4 \uc544\ub2d8", Promise.resolve(666)];\nconst p = Promise.race(arr);\nconst p2 = Promise.race(arr2);\n\nconsole.log(p); // (1) Promise { <state>: "pending" } \nconsole.log(p2); // (2) Promise { <state>: "pending" } \nsetTimeout(function(){\n console.log(\'the stack is now empty\'); // (3) the stack is now empty\n console.log(p); // (4) Promise { <state>: "fulfilled", <value>: 666 }\n console.log(p2); // (5) Promise { <state>: "fulfilled", <value>: "\ud504\ub85c\ubbf8\uc2a4 \uc544\ub2d8" }\n});\n')),Object(a.b)("h2",{id:"promiseresolvevalue"},"Promise.resolve(value)"),Object(a.b)("p",null,"result \uac00 value \uc778 \uc774\ud589 \uc0c1\ud0dc \ud504\ub77c\ubbf8\uc2a4 \uac1d\uccb4 \uc0dd\uc131"),Object(a.b)("p",null,Object(a.b)("inlineCode",{parentName:"p"},"let promise = new Promise(resolve => resolve(value));")," \uc640 \ub3d9\uc77c"),Object(a.b)("p",null,Object(a.b)("inlineCode",{parentName:"p"},"function loadCached(URL)")),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"URL \uc744 \ub300\uc0c1\uc73c\ub85c fetch \ub97c \ud638\ucd9c\ud558\uace0, \uadf8 \uacb0\uacfc\ub97c \uae30\uc5b5(cache)\ud569\ub2c8\ub2e4. "),Object(a.b)("li",{parentName:"ul"},"\ub3d9\uc77c\ud55c URL \uc744 \ub300\uc0c1\uc73c\ub85c fetch \ub97c \ud638\ucd9c\ud558\uba74, Promise.resolve \ub97c \uc0ac\uc6a9\ud574 \uce90\uc2dc \ub41c \ub0b4\uc6a9\uc744 Promise \ub85c \ub9cc\ub4e4\uc5b4 \ubc18\ud658 \uac12\uc774 \ud56d\uc0c1 Promise \uac00 \ub418\uac8c \ud569\ub2c8\ub2e4."),Object(a.b)("li",{parentName:"ul"},"loadCached \ub97c \ud638\ucd9c\ud558\uba74 \ud504\ub77c\ubbf8\uc2a4\uac00 \ubc18\ud658\ub41c\ub2e4\ub294 \uac83\uc774 \ubcf4\uc7a5\ub418\uae30 \ub54c\ubb38\uc5d0 loadCached(url).then(\u2026)\uc744 \uc0ac\uc6a9\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. ")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"let cache = new Map();\n\nfunction loadCached(url) {\n if (cache.has(url)) {\n return Promise.resolve(cache.get(url)); // (*)\n }\n\n return fetch(url)\n .then(response => response.text())\n .then(text => {\n cache.set(url,text);\n return text;\n });\n}\n")),Object(a.b)("h2",{id:"promiserejecterror"},"Promise.reject(error)"),Object(a.b)("p",null,"result \uac00 error \uc778 \uac70\ubd80\uc0c1\ud0dc Promise \uc0dd\uc131"),Object(a.b)("p",null,Object(a.b)("inlineCode",{parentName:"p"},"let promise = new Promise((resolve, reject) => reject(error));")," \uc640 \ub3d9\uc77c"),Object(a.b)("h2",{id:"\ud504\ub85c\ubbf8\uc2a4\ud654-promisification"},"\ud504\ub85c\ubbf8\uc2a4\ud654 Promisification"),Object(a.b)("p",null,"\ucf5c\ubc31\uc744 \ubc1b\ub294 \ud568\uc218\ub97c Promise \ub97c \ubc18\ud658\ud558\ub294 \ud568\uc218\ub85c \ubc14\uafb8\ub294 \uac83"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"JavaScript es6 \uc5d0\uc11c promise \ub97c \ud45c\uc900\uc73c\ub85c \ucc44\ud0dd\ud558\uba74\uc11c \ub300\ubd80\ubd84\uc758 \ube0c\ub77c\uc6b0\uc800\uc5d0\uc11c Promise \ub97c \uc0ac\uc6a9\ud558\uac8c \ub428"),Object(a.b)("li",{parentName:"ul"},"\ucf5c\ubc31 \ubcf4\ub2e4\ub294 Promise \uac00 \ub354 \ud3b8\ub9ac\ud558\ub2e4."),Object(a.b)("li",{parentName:"ul"},"\ucf5c\ubc31\uae30\ubc18 \ub77c\uc774\ube0c\ub7ec\ub9ac\ub97c Promise \ub97c \ubc18\ud658\ud558\ub294 \ud568\uc218\ub85c \ubc14\uafc0 \uc218 \uc788\ub2e4."),Object(a.b)("li",{parentName:"ul"},"Node.js \ub0b4\uc7a5 \ud568\uc218 ",Object(a.b)("inlineCode",{parentName:"li"},"util.promisify")),Object(a.b)("li",{parentName:"ul"},"\ubaa8\ub4c8 ",Object(a.b)("inlineCode",{parentName:"li"},"es6-promisify")),Object(a.b)("li",{parentName:"ul"},"async await \uc758 \uc7a5\uc810\uc744 \uc774\uc6a9\ud560 \uc218 \uc788\ub2e4. "),Object(a.b)("li",{parentName:"ul"},"\ucd5c\uc2e0\ube0c\ub77c\uc6b0\uc800\uc5d0\uc11c, async \ub97c \ub0a8\ubc1c\ud574\ub3c4 \uc131\ub2a5\uc758 \ud070 \ucc28\uc774\uac00 \uc5c6\ub2e4. native function \uacfc \uac00\uae5d\ub2e4."),Object(a.b)("li",{parentName:"ul"},"\ube44\ub3d9\uae30 \uae30\ub2a5\uc774 \uc788\ub294 \uc5b4\ub5a4\ud568\uc218\ub85c \ub9cc\ub4e4\uc5b4\ub3c4 promise \ub85c \ub9cc\ub4e4\uc5b4 \ub193\ub294\uac8c \uc911\uc694\ud558\ub2e4.")),Object(a.b)("h3",{id:"\ucf5c\ubc31\uc758-settimeout-\uc744-promise-\ub85c-\ub9cc\ub4e4\uae30"},"\ucf5c\ubc31\uc758 setTimeout \uc744 Promise \ub85c \ub9cc\ub4e4\uae30"),Object(a.b)("p",null,Object(a.b)("inlineCode",{parentName:"p"},"res(f())")," "),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},Object(a.b)("inlineCode",{parentName:"li"},"f"),"\uc758 \ub9ac\ud134\uac12\uc744 ",Object(a.b)("inlineCode",{parentName:"li"},"[[PromiseResult]]"),"\uc73c\ub85c \uac00\uc9c0\ub294 Promise \uac1d\uccb4 ")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"const timeout = (f, ms) => new Promise(res => setTimeout(_ => res(f()), ms));\n")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"function delay(ms) {\n return new Promise(resolve => setTimeout(resolve, ms));\n}\ndelay(3000).then(() => alert('3\ucd08\ud6c4 \uc2e4\ud589'));\n")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"function loadScript(src, callback) {\n let script = document.createElement('script');\n script.src = src;\n\n script.onload = () => callback(null, script);\n script.onerror = () => callback(new Error(`${src}\ub97c \ubd88\ub7ec\uc624\ub294 \ub3c4\uc911\uc5d0 \uc5d0\ub7ec\uac00 \ubc1c\uc0dd\ud568`));\n\n document.head.append(script);\n}\n// usage:\nloadScript('path/script.js', (err, script) => {...})\n")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"let loadScriptPromise = function(src) {\n return new Promise((resolve, reject) => {\n loadScript(src, (err, script) => {\n if (err) reject(err);\n else resolve(script);\n });\n })\n};\n\n// \uc0ac\uc6a9\ubc95:\nloadScriptPromise('path/script.js').then(...);\n")),Object(a.b)("h2",{id:"\ub9c8\uc774\ud06c\ub85c-\ud0dc\uc2a4\ud06c"},"\ub9c8\uc774\ud06c\ub85c \ud0dc\uc2a4\ud06c"),Object(a.b)("h3",{id:"\ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c-\ud050-promisejobs"},"\ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c \ud050 (PromiseJobs)"),Object(a.b)("p",null,"\ube44\ub3d9\uae30 \uc791\uc5c5\uc744 \ucc98\ub9ac\ud558\uae30 \uc704\ud55c ",Object(a.b)("a",{parentName:"p",href:"./JOBS"},"PromiseJobs")," \ub77c\uace0 \ubd88\ub9ac\ub294 \ub0b4\ubd80 \ud050(internal queue)."),Object(a.b)("p",null,"V8 \uc5d4\uc9c4\uc5d0\uc11c\ub294 microtask queue \ub77c\uace0 \ubd80\ub978\ub2e4."),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"FIFO"),Object(a.b)("li",{parentName:"ul"},"\uc2e4\ud589\ud560 \uac83(\ud638\ucd9c \uc2a4\ud0dd)\uc774 \ube44\uc5c8\uc744 \ub54c\ub9cc \ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c\ud050\uc758 \uc791\uc5c5\uc774 \uc2e4\ud589\ub41c\ub2e4.")),Object(a.b)("h4",{id:"promise-\ud578\ub4e4\ub7ec-thencatchfinally-1"},"Promise \ud578\ub4e4\ub7ec .then/catch/finally"),Object(a.b)("p",null,"Promise \uac00 \uc989\uc2dc \uc774\ud589\ub418\ub354\ub77c\ub3c4,\nPromise \ud578\ub4e4\ub7ec .then/catch/finally \ub294 \ud56d\uc0c1 \ube44\ub3d9\uae30\uc801\uc73c\ub85c \uc2e4\ud589\ub41c\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},'let promise = Promise.resolve();\n\npromise.then(() => alert("\ud504\ub77c\ubbf8\uc2a4 \uc131\uacf5!")); // 2\n\nalert("\ucf54\ub4dc \uc885\ub8cc"); // 1\n')),Object(a.b)("ol",null,Object(a.b)("li",{parentName:"ol"},"Promise \uac1d\uccb4\uac00 \uc900\ube44\ub428"),Object(a.b)("li",{parentName:"ol"},"Promise \uac1d\uccb4\uc758 ",Object(a.b)("inlineCode",{parentName:"li"},".then/catch/finally")," \ud578\ub4e4\ub7ec\uac00 PromiseJobs \ud050\uc5d0 \ub4e4\uc5b4\uac04\ub2e4 (\uc2e4\ud589\uc804)")),Object(a.b)("h4",{id:"promisejobs-\ud050\uac00-\uc2e4\ud589\ub418\ub294-\uc870\uac74"},"PromiseJobs \ud050\uac00 \uc2e4\ud589\ub418\ub294 \uc870\uac74"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\ud604\uc7ac \ucf54\ub4dc\uc758 \uc2e4\ud589\uc774 \uc644\ub8cc\ub420 \ub54c"),Object(a.b)("li",{parentName:"ul"},"\ud050\uc5d0 \uc801\uc7ac\ub41c \uc774\uc804 \ud578\ub4e4\ub7ec\uc758 \uc2e4\ud589\uc774 \uc644\ub8cc\ub420 \ub54c")),Object(a.b)("blockquote",null,Object(a.b)("p",{parentName:"blockquote"},"\ube0c\ub77c\uc6b0\uc800/Node.js\ub97c \ud3ec\ud568\ud55c \ub300\ubd80\ubd84\uc758 \uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8 \uc5d4\uc9c4\uc5d0\uc11c,\n\ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c\uac00 '\uc774\ubca4\ud2b8 \ub8e8\ud504(event loop)'\uc640 '\ub9e4\ud06c\ub85c\ud0dc\uc2a4\ud06c(macrotask)'\uc640 \uae4a\uc740 \uc5f0\uad00 \uad00\uacc4\ub97c \ub9fa\ub294\ub2e4.\n\uc774 \ubd80\ubd84\uc5d0 \ub300\ud574\uc11c\ub294 \uc8fc\uc81c \ube0c\ub77c\uc6b0\uc800 \uc5d0\uc11c \ub2e4\uc2dc \ub2e4\ub8f0 \uac83\uc774\ub2e4. TODO ")),Object(a.b)("h3",{id:"\ucc98\ub9ac\ub418\uc9c0-\ubabb\ud55c-\uac70\ubd80-unhandledrejection"},"\ucc98\ub9ac\ub418\uc9c0 \ubabb\ud55c \uac70\ubd80 unhandledrejection"),Object(a.b)("p",null,"\ub9c8\uc774\ud06c\ub85c \ud0dc\uc2a4\ud06c(PromiseJobs) \ud050 \ub05d\uc5d0\uc11c \uac70\ubd80\ub41c Promise \uac00 \ucc98\ub9ac\ub418\uc9c0 \ubabb\ud560 \ub54c \ubc1c\uc0dd"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\uc790\ubc14\uc2a4\ud06c\ub9bd\ud2b8 \uc5d4\uc9c4\uc740 \uc804\uc5ed \uc5d0\ub7ec\ub97c \ubc1c\uc0dd\uc2dc\ud0a8\ub2e4.")),Object(a.b)("p",null,"\uc5d0\ub7ec\uac00 \uc798 \ucc98\ub9ac\ub418\uc5c8\uc73c\ubbc0\ub85c \uc2e4\ud589\ub418\uc9c0 \uc54a\uc2b5\ub2c8\ub2e4."),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"let promise = Promise.reject(new Error(\"\ud504\ub77c\ubbf8\uc2a4 \uc2e4\ud328!\"));\npromise.catch(err => alert('\uc7a1\uc558\ub2e4!'));\n\nwindow.addEventListener('unhandledrejection', event => alert(event.reason));\n")),Object(a.b)("p",null,"setTimeout \uc744 \uc774\uc6a9\ud558\uc5ec \uc5d0\ub7ec\ub97c \ub098\uc911\uc5d0 \ucc98\ub9ac\ud560 \uacbd\uc6b0"),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"let promise = Promise.reject(new Error(\"\ud504\ub77c\ubbf8\uc2a4 \uc2e4\ud328!\")); \nsetTimeout(() => promise.catch(err => alert('\uc7a1\uc558\ub2e4!')), 1000); // '\uc7a1\uc558\ub2e4!' (2) \n\nwindow.addEventListener('unhandledrejection', function(event) {\n // \uc774\ubca4\ud2b8\uc5d4 \ub450 \uac1c\uc758 \ud2b9\ubcc4 \ud504\ub85c\ud37c\ud2f0\n alert(event.promise); // [object Promise] - \uc5d0\ub7ec\ub97c \uc0dd\uc131\ud558\ub294 \ud504\ub77c\ubbf8\uc2a4\n alert(event.reason); // Error: \uc5d0\ub7ec \ubc1c\uc0dd! - \ucc98\ub9ac\ud558\uc9c0 \ubabb\ud55c \uc5d0\ub7ec \uac1d\uccb4\n});\n")),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},Object(a.b)("inlineCode",{parentName:"li"},"unhandledrejection")," \uc740 \ub9c8\uc774\ud06c\ub85c\ud0dc\uc2a4\ud06c \ud050\uc5d0 \uc788\ub294 \uc791\uc5c5 \ubaa8\ub450\uac00 \uc644\ub8cc\ub418\uc5c8\uc744 \ub54c \uc0dd\uc131\ub428."),Object(a.b)("li",{parentName:"ul"},Object(a.b)("inlineCode",{parentName:"li"},".catch")," \ub294 ",Object(a.b)("inlineCode",{parentName:"li"},"unhandledrejection")," \uc774 \ubc1c\uc0dd\ud55c \uc774\ud6c4\uc5d0 \ud2b8\ub9ac\uac70 \ub41c\ub2e4.")),Object(a.b)("p",null,Object(a.b)("a",{parentName:"p",href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/unhandledrejection_event"},"MDN")),Object(a.b)("p",null,"\ubb34\uc2a8\uc774\uc720\uc5d0\uc11c\uc778\uc9c0 \ube0c\ub77c\uc6b0\uc800 \ucf58\uc194\uc5d0\uc11c \uc2e4\ud589\uc744 \ud574 \ubcf4\uc544\ub3c4 'unhandledrejection'\uc774\ubca4\ud2b8\ub294 \ubc1c\uc0dd\ud558\uace0 \uc788\uc9c0 \uc54a\ub2e4.\n(TODO)"),Object(a.b)("h2",{id:"promise-\uc7a5\uc810"},"Promise \uc7a5\uc810"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},Object(a.b)("inlineCode",{parentName:"li"},"then")," \ucf5c\ubc31\uc744 \uc911\ucca9\ud558\uc9c0 \uc54a\uace0\ub3c4 \ube44\ub3d9\uae30 \uc791\uc5c5\uc744 \uc5f0\uc774\uc5b4 \ud560 \uc218 \uc788\ub2e4."),Object(a.b)("li",{parentName:"ul"},"\ube44\ub3d9\uae30 \uc791\uc5c5\uc744 \uac12\uc73c\ub85c \ub2e4\ub8f0 \uc218 \uc788\ub2e4.")),Object(a.b)("table",null,Object(a.b)("thead",{parentName:"table"},Object(a.b)("tr",{parentName:"thead"},Object(a.b)("th",{parentName:"tr",align:null},"Promise"),Object(a.b)("th",{parentName:"tr",align:null},"Callback"))),Object(a.b)("tbody",{parentName:"table"},Object(a.b)("tr",{parentName:"tbody"},Object(a.b)("td",{parentName:"tr",align:null},"\ud750\ub984\uc774 \uc790\uc5f0\uc2a4\ub7fd\ub2e4. ",Object(a.b)("br",null)," loadScript(script) \ub85c \uc2a4\ud06c\ub9bd\ud2b8\ub97c \uc77d\uace0, \uacb0\uacfc\uc5d0 \ub530\ub77c \uadf8 \ub2e4\uc74c\uc5d0 (then) \ubb34\uc5c7\uc744 \ud560\uc9c0\uc5d0 \ub300\ud55c \ucf54\ub4dc\ub97c \uc791\uc131\ud560 \uc218 \uc788\ub2e4."),Object(a.b)("td",{parentName:"tr",align:null},"loadScript(script, callback) \uc744 \ud638\ucd9c\ud560 \ub54c, \ubbf8\ub9ac callback \ud568\uc218\uac00 \uc900\ube44\ub418\uc5b4 \uc788\uc5b4\uc57c \ud55c\ub2e4.")),Object(a.b)("tr",{parentName:"tbody"},Object(a.b)("td",{parentName:"tr",align:null},"\uc6d0\ud558\ub294 \ub9cc\ud07c then \ud638\ucd9c \uac00\ub2a5."),Object(a.b)("td",{parentName:"tr",align:null},"\ucf5c\ubc31\uc740 \ud558\ub098\ub9cc \uac00\ub2a5\ud558\ub2e4.")))),Object(a.b)("h2",{id:"promise-\uc758-\ube44\ud310"},"Promise \uc758 \ube44\ud310"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\uc5ec\uc804\ud788 \ucf5c\ubc31\uc744 \uc0ac\uc6a9\ud55c\ub2e4."),Object(a.b)("li",{parentName:"ul"},"\uc5ec\uc804\ud788 \uac00\ub3c5\uc131\uc774 \uc88b\uc9c0 \uc54a\ub2e4.")),Object(a.b)("h2",{id:"thenable-\uac1d\uccb4\ub97c-\ubc18\ud658\ud558\ub294-\ud578\ub4e4\ub7ec"},"thenable \uac1d\uccb4\ub97c \ubc18\ud658\ud558\ub294 \ud578\ub4e4\ub7ec"),Object(a.b)("p",null,"Promise \ub97c \uc0c1\uc18d\ubc1b\uc9c0 \uc54a\uace0\ub3c4, \ucee4\uc2a4\ud140 \uac1d\uccb4\ub97c \uc0ac\uc6a9\ud574 \ud504\ub77c\ubbf8\uc2a4 \uccb4\uc774\ub2dd\uc744 \ub9cc\ub4dc\ub294 \ubc29\ubc95"),Object(a.b)("h3",{id:"thenable-\uac1d\uccb4"},"thenable \uac1d\uccb4"),Object(a.b)("p",null,".then \uba54\uc11c\ub4dc\ub97c \uac00\uc9c4 \uac1d\uccb4"),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},"\uc11c\ub4dc \ud30c\ud2f0 \ub77c\uc774\ube0c\ub7ec\ub9ac\uac00 Promise \ud638\ud658 \uac00\ub2a5 \uac1d\uccb4\ub97c \uad6c\ud604\ud560 \uc218 \uc788\ub2e4\ub294 \uc810\uc5d0\uc11c \ub4f1\uc7a5")),Object(a.b)("pre",null,Object(a.b)("code",{parentName:"pre",className:"language-javascript"},"class Thenable {\n constructor(num) {\n this.num = num;\n }\n then(resolve, reject) {\n alert(resolve); // function() { \ub124\uc774\ud2f0\ube0c \ucf54\ub4dc }\n // 1\ucd08 \ud6c4 this.num*2\uc640 \ud568\uaed8 \uc774\ud589\ub428\n setTimeout(() => resolve(this.num * 2), 1000); // (**)\n }\n}\n\nnew Promise(resolve => resolve(1))\n .then(result => {\n return new Thenable(result); // (*)\n })\n .then(alert); // 1000\ubc00\ub9ac \ucd08 \ud6c4 2\ub97c \ubcf4\uc5ec\uc90c\n")),Object(a.b)("p",null,Object(a.b)("img",{parentName:"p",src:"https://user-images.githubusercontent.com/31977543/91840698-116aa600-ec8c-11ea-910b-94afef5e8cce.png",alt:"image"})))}b.isMDXComponent=!0}}]);