CALL BACK\uacfc PROMISE\uc5d0 \ub300\ud574 \uac04\ub2e8\ud788 \uc0b4\ud3b4 \ubd05\ub2c8\ub2e4.
\uc774 CALL BACK\uacfc PROMISE\ub294 \ud568\uc218\uc758 \uc21c\ucc28\uc801 \uc2e4\ud589\uacfc \uad00\uacc4\uac00 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\n\n\n\n
Let’s take a quick look at CALL BACK and PROMISE.
These CALL BACK and PROMISE are related to the sequential execution of functions.<\/p>\n\n\n\n
1.CALL BACK<\/p>\n\n\n\n
1)\ud568\uc218\ub9cc\ub4e4\uae30Create a function<\/p>\n\n\n\n
\ud568\uc218 add\uc758 \uc544\uaddc\uba3c\ud2b8\ub85c x, callback_func\ub97c \uc0ac\uc6a9\ud569\ub2c8\ub2e4.
x\ub294 \ubcc0\uc218\uc774\uace0 callback_func\uc740 \ud568\uc218\uc778\ub370 \uc774\ub807\uac8c \uc544\uaddc\uba3c\ud2b8\ub85c \ud568\uc218\ub97c \uc0ac\uc6a9\ud558\ub294 \uac83\uc744 call back \ud568\uc218\ub77c\uace0 \ud569\ub2c8\ub2e4.
add \ud568\uc218\ub0b4\uc5d0 callback_func(x)\ub85c \uc2e4\ud589\ub429\ub2c8\ub2e4.
\uc774\ub54c \uc544\uaddc\uba3c\ud2b8\uac00 \ud558\ub098\uc778 \ud568\uc218\uac00 \uc2e4\ud589\ub418\ub294\ub370 \uc544\uaddc\uba3c\ud2b8\ub85c x\uac00 callback_func\uc758 \uc544\uaddc\uba3c\ud2b8\ub85c \ub300\uc785\ub429\ub2c8\ub2e4.
\ud568\uc218\uc758 \uc544\uaddc\uba3c\ud2b8 \uac2f\uc218\uae4c\uc9c0\ub9cc \uc124\uc815\ub418\uc5c8\uace0 \ub098\uba38\uc9c0 \uc790\uc138\ud55c \ub0b4\uc6a9\uc740 add \ud568\uc218\uac00 \uc2e4\ud589 \ub420 \ub54c \ud568\uc218\ub97c \uc815\uc758 \ud569\ub2c8\ub2e4. <\/p>\n\n\n\n
Use x, callback_func as the argument for the function add.
x is a variable and callback_func is a function, so using a function as an a argument is called a callback function.
Runs as callback_func(x) within add function
At this time, a function with one argument is executed, and x is substituted as the argument of callback_func.
Only the number of arguments in the function is set, and the remaining details are defined when the add function is executed.<\/p>\n\n\n\n
function add(x<\/mark>, callback_func<\/mark>) {\n callback_func<\/mark>(x<\/mark>);\n}<\/code><\/pre>\n\n\n\n2)\ud568\uc218 \uc2e4\ud589(Function execution)<\/p>\n\n\n\n
add \ud568\uc218\ub97c \uc2e4\ud589\ud560 \ub54c \uac12\uc73c\ub85c “test”\ub77c\ub294 x\ubcc0\uc218\uc758 \uac12\uc774 \ub300\uc785\ub418\uace0 callback_func\uc704\uce58\uc5d0 \uc2e4\uc81c \ud568\uc218\ub97c \uadf8\ub300\ub85c \ub300\uc785\ud569\ub2c8\ub2e4.
\uc774\ub54c \uc644\uc804\ud55c \ud568\uc218\ub97c \uc124\uc815\ud569\ub2c8\ub2e4.
callback_func(x)\ub77c\uace0 \uc544\uaddc\uba3c\ud2b8\ub97c \ud558\ub098\ub85c \uc815\ud574 \uc92c\uc73c\ub2c8 \uc544\uaddc\uba3c\ud2b8\uac00 \ud558\ub098\uc778 \ud568\uc218\ub97c \uc815\uc758 \ud569\ub2c8\ub2e4.
\uc774 \ud568\uc218\ub294 \uc774\ub984\uc774 \uc5c6\uace0 result\uc5d0 \ub300\uc785\ub418\ub294 \ub0b4\uc6a9\uc740 console.log(resujlt)\ub85c \ucf58\uc194\uc5d0 \ucd9c\ub825\ub429\ub2c8\ub2e4.
\uc704\uc5d0\uc11c callback_func(x)\uc774\uae30 \ub54c\ubb38\uc5d0 “test”\ub294 result\ubcc0\uc218\uc758 \uac12\uc774 \ub418\uc5b4 \ud568\uc218\uac00 \uc2e4\ud589\ub429\ub2c8\ub2e4.<\/p>\n\n\n\n
When executing the add function, the value of the x variable called “test” is assigned as the value, and the actual function is assigned to the callback_func position.
At this point, we set up the complete function.
Since we have set one argument as callback_func(x), we define a function with one argument.
This function has no name, and the content substituted into result is output to the console as console.log(resujlt).Since callback_func(x) above, “test” becomes the value of the result variable and the function is executed.<\/p>\n\n\n\n
add(\"test<\/mark>\",function(result<\/mark>){\n console.log(result<\/mark>);\n});<\/code><\/pre>\n\n\n\n3)\uc804\uccb4\ucf54\ub4dc(full code)<\/p>\n\n\n\n
function add(x, callback_func) {\n callback_func(x);\n}\n\nadd(\"test\",function(result){\n console.log(result);\n});<\/code><\/pre>\n\n\n\n2.PROMISE <\/p>\n\n\n\n
1)PROMISE\ub9cc\ub4e4\uae30(Create a PROMISE) & resolve()<\/p>\n\n\n\n
\uc544\ub798\ub294 resolve\uc640reject\ub97c \uc544\uaddc\uba3c\ud2b8\ub85c \uc0ac\uc6a9\ud558\ub294 PROMISE\ub97c \ub9cc\ub4dc\ub294 \ucf54\ub4dc\uc785\ub2c8\ub2e4.
resolve\uc640 reject\ub294 \ud568\uc218\uc785\ub2c8\ub2e4.
PROMISE\ub0b4\ubd80\uc758 \ubaa8\ub4e0 \ud568\uc218\uac00 \uc815\uc0c1\uc801\uc73c\ub85c \uc2e4\ud589\ub418\uba74 resolve\ud568\uc218\ub97c \uc2e4\ud589\ud558\uc5ec \uadf8 \ub2e4\uc74c \ud568\uc218\ub97c \uc2e4\ud589\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.
\ub2e4\uc74c \ud568\uc218\ub780 then(()=>{ function }) \ucf54\ub4dc \ub0b4\uc758 \ud568\uc218\ub97c \uc758\ubbf8\ud569\ub2c8\ub2e4.<\/p>\n\n\n\n
Below is the code that creates a PROMISE using resolve and reject as arguments.
resolve and reject are functions.
When all functions within PROMISE are executed normally, the resolve function can be executed to execute the next function.
The next function means the function used in the block within then(()=>{ …function …})<\/p>\n\n\n\n
const p = new Promise((resolve,reject)<\/mark>=>{\n resolve(\"resolve\");<\/mark>\n... CODE ...\n})\np.then(()=>{<\/mark>\n console.log(2);\n})<\/code><\/pre>\n\n\n\n2)PROMISE reject()<\/p>\n\n\n\n
reject()\ud568\uc218\uac00 \uc2e4\ud589\ub418\uba74 .catch(()=>{… function …}) \ube14\ub7ed\ub0b4\uc758 \ud568\uc218\uac00 \uc2e4\ud589\ub418\uace0 \ubc14\ub85c \uc774\uc804\uc758 then(()=>{…function…})\ube14\ub7ed\uc758 \ucf54\ub4dc \uc2e4\ud589\uc774 \ucde8\uc18c\ub429\ub2c8\ub2e4.<\/p>\n\n\n\n
When the reject() function is executed, the function in the .catch(()=>{\u2026 function \u2026}) block is executed and the immediately preceding then(()=>{\u2026function\u2026}) block The code execution is canceled.<\/p>\n\n\n\n
const p = new Promise((resolve,reject)=>{\n reject(\"reject\");<\/mark>\n});\n\np.then(()=>{\n console.log(2);\n})<\/mark>\n.catch(()=>{\n console.log(\"reject!\");\n})<\/mark><\/code><\/pre>\n\n\n\n3)\uc804\uccb4\ucf54\ub4dc(full code)<\/p>\n\n\n\n
let se = 2;\nconst p = new Promise((resolve,reject)=>{\nconsole.log(1);\n if(se == 1){\n resolve(\"resolve\");\n }else{\n reject(\"reject\");\n }\n});\n\np.then(()=>{\n console.log(2);\n})\n.catch(()=>{\n console.log(\"reject!\");\n})\n.then(()=>{\n console.log(3);\n})\n.then(()=>{\n console.log(4);\n});<\/code><\/pre>\n\n\n\n