-
[JS] chapter13. ๊ณ ์ฐจํจ์codeStates front-end/Java Script 2023. 1. 12. 09:35๋ฐ์ํ
๐๊ณ ์ฐจํจ์
์ผ๊ธ๊ฐ์ฒด์๋ ํจ์๊ฐ ์๋ค
-ํจ์
๋ณ์์ ํ ๋นํ ์ ์๋ค
๋ค๋ฅธ ํจ์์ ์ ๋ฌ์ธ์๋ก ์ ๋ฌ๋ ์ ์๋ค
๋ค๋ฅธ ํจ์์ ๊ฒฐ๊ณผ๋ก์ ๋ฆฌํด๋ ์ ์๋ค
-๊ณ ์ฐจํจ์
ํจ์๋ฅผ ์ ๋ฌ์ธ์๋ก ๋ฐ์ ์ ์๊ณ , ํจ์๋ฅผ ๋ฆฌํดํ ์ ์๋ ํจ์
๋ณ์์ ํ ๋นํ์ง ์๊ณ ํจ์๋ฅผ ๋ฐ๋ก ์ด์ฉ
-์ฝ๋ฐฑํจ์
๋ค๋ฅธ ํจ์๊ฐ ์คํ์ ๋๋ธ ๋ค ์คํ๋๋ callback๋๋ ํจ์
ํจ์์ ์ ๋ฌ์ธ์๋ก ์ ๋ฌ๋๋ ํจ์
์ฝ๋ฐฑํจ์๋ฅผ ์ ๋ฌ๋ฐ์ ๊ณ ์ฐจํจ์๋ ํจ์ ๋ด๋ถ์์ ์ด ์ฝ๋ฐฑ ํจ์๋ฅผ ํธ์ถ ๊ฐ๋ฅ
functio func(callback) { callback(); } function callback() { console.log("callback์ด๋ค"); } func(callback); ๊ฒฐ๊ณผ : callback์ด๋ค
1. ๋ค๋ฅธ ํจ์๋ฅผ ์ธ์๋ก ๋ฐ๋ ๊ฒฝ์ฐ
function double(num) { return num * 2; } function doubleNum(func, num) { return func(num); } /* * ํจ์ doubleNum์ ๋ค๋ฅธ ํจ์๋ฅผ ์ธ์๋ก ๋ฐ๋ ๊ณ ์ฐจ ํจ์์ ๋๋ค. * ํจ์ doubleNum์ ์ฒซ ๋ฒ์งธ ์ธ์ func์ ํจ์๊ฐ ๋ค์ด์ฌ ๊ฒฝ์ฐ * ํจ์ func๋ ํจ์ doubleNum์ ์ฝ๋ฐฑ ํจ์์ ๋๋ค. * ์๋์ ๊ฐ์ ๊ฒฝ์ฐ, ํจ์ double์ ํจ์ doubleNum์ ์ฝ๋ฐฑ ํจ์์ ๋๋ค. */ let output = doubleNum(double, 4); console.log(output); // -> 8
2. ํจ์๋ฅผ ๋ฆฌํดํ๋ ๊ฒฝ์ฐ
function adder(added) { return function (num) { return num + added; }; } /* * ํจ์ adder๋ ๋ค๋ฅธ ํจ์๋ฅผ ๋ฆฌํดํ๋ ๊ณ ์ฐจ ํจ์์ ๋๋ค. * adder๋ ์ธ์ ํ ๊ฐ๋ฅผ ์ ๋ ฅ๋ฐ์์ ํจ์(์ต๋ช ํจ์)๋ฅผ ๋ฆฌํดํฉ๋๋ค. * ๋ฆฌํด๋๋ ์ต๋ช ํจ์๋ ์ธ์ ํ ๊ฐ๋ฅผ ๋ฐ์์ added์ ๋ํ ๊ฐ์ ๋ฆฌํดํฉ๋๋ค. */ // adder(5)๋ ํจ์์ด๋ฏ๋ก ํจ์ ํธ์ถ ์ฐ์ฐ์ '()'๋ฅผ ์ฌ์ฉํ ์ ์์ต๋๋ค. let output = adder(5)(3); // -> 8 console.log(output); // -> 8 // adder๊ฐ ๋ฆฌํดํ๋ ํจ์๋ฅผ ๋ณ์์ ์ ์ฅํ ์ ์์ต๋๋ค. // javascript์์ ํจ์๋ ์ผ๊ธ ๊ฐ์ฒด์ด๊ธฐ ๋๋ฌธ์ ๋๋ค. const add3 = adder(3); output = add3(2); console.log(output); // -> 5
3. ํจ์๋ฅผ ์ธ์๋ก ๋ฐ๊ณ , ํจ์๋ฅผ ๋ฆฌํดํ๋ ๊ฒฝ์ฐ
function double(num) { return num * 2; } function doubleAdder(added, func) { const doubled = func(added); return function (num) { return num + doubled; }; } /* * ํจ์ doubleAdder๋ ๊ณ ์ฐจ ํจ์์ ๋๋ค. * ํจ์ doubleAdder์ ์ธ์ func๋ ํจ์ doubleAdder์ ์ฝ๋ฐฑ ํจ์์ ๋๋ค. * ํจ์ double์ ํจ์ doubleAdder์ ์ฝ๋ฐฑ์ผ๋ก ์ ๋ฌ๋์์ต๋๋ค. */ // doubleAdder(5, double)๋ ํจ์์ด๋ฏ๋ก ํจ์ ํธ์ถ ๊ธฐํธ '()'๋ฅผ ์ฌ์ฉํ ์ ์์ต๋๋ค. doubleAdder(5, double)(3); // -> 13 // doubleAdder๊ฐ ๋ฆฌํดํ๋ ํจ์๋ฅผ ๋ณ์์ ์ ์ฅํ ์ ์์ต๋๋ค. (์ผ๊ธ ๊ฐ์ฒด) const addTwice3 = doubleAdder(3, double); addTwice3(2); // --> 8
๋ฐ์ํ'codeStates front-end > Java Script' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[JS] chapter14. ๊ฐ์ฒด ์งํฅ - ํด๋ก์ ๋ชจ๋ ํจํด (1) 2023.01.13 [JS] chapter14. ๋ด์ฅ๊ณ ์ฐจํจ์ (0) 2023.01.12 [JS] chapter12. ์ด๋ฒคํธ ๊ฐ์ฒด (0) 2023.01.06 [JS] chapter12. ์ ํจ์ฑ ๊ฒ์ฌ/ <์ค์ต> ํ์๊ฐ์ ๊ตฌํ / classList error (0) 2023.01.06 [JS] chapter11. DOM/DOM ๋ค๋ฃจ๊ธฐ(CRUD) (0) 2023.01.05