function ์ธ๋ถํจ์() {
var ๋ณ์;
function ๋ด๋ถํจ์(){
๋ณ์ A ์ฌ์ฉ;
}
}
function addCount() {
var count = 0;
return ++count;
}
console.log(addCount()) ; // 1
console.log(addCount()) ; // 1
console.log(addCount()) ; // 1
function cloCount() {
var count = 0;
function addCount() {
return ++count;
}
return addCount;
}
var counter = cloCount();
console.log(addCount()) ; // 1
console.log(addCount()) ; // 2
console.log(addCount()) ; // 3
โ ย ์ฐ๊ด ์๋ ๋ณ์์ ๊ธฐ๋ฅ(์ค์ฒฉ ํจ์)์ ํ๋์ ํจ์๋ก ๋ฌถ์ด ๋ ๋ฆฝ์ ์ผ๋ก ์คํ ์ํฌ ์ ์๋ค.
โ ย ํจ์ ๋ด๋ถ์ ๋ฐ์ดํฐ๊ฐ ๋ง๋ค์ด์ง๊ธฐ ๋๋ฌธ์ ํจ์ ์ธ๋ถ์์ ์์ ํ ์ ์๋ ๋ณดํธ๋ ๋ฐ์ดํฐ๋ฅผ ๋ง๋ค ์ ์๋ค.
โ ๊ฐ์ฒด ์งํฅ ํ๋ก๊ทธ๋๋ฐ์์๋ private ๋ฐ์ดํฐ๋ผ๊ณ ๋ถ๋ฅธ๋ค.
โ ย ์ฌ์ฉํ๋ ์ด์ ( ์ฅ์ )
const adder = function(x) {
return function(y) {
return x + y;
}
} //adder(x)(y)๋ก ์ฌ์ฉ ํ ์ ์๋ค.
const add5 = adder(5)
add5(7) // 12 (7+5)
// adder๋ผ๋ ํจ์ ๋ฐ์ผ๋ก ๋์์ด๋ ์ธ๋ถ ํจ์์ x ๋ณ์๋ฅผ ์ด์ฉํด 5๋ฅผ ํ ๋นํ ์ ์๋ค.
// ์ด๋ ์ดํ์ ํ๊ฒฝ์ ๋ฉ๋ชจ๋ฆฌ์ ์ ์ฅํ๊ธฐ ๋๋ฌธ์๊ฒ ๊ฐ๋ฅํ๋ค.
add5(10) // 15 (5+10)
const makeResult = () => {
let value = 0;
return {
increase: () => {
value = value + 1
},
decrease: () => {
value = value - 1
},
getResult: () => value
}
}
const make1 = makeResult();
๋ฐ์ดํฐ ๋ณด์กด์ ํตํด value = 0 ์ฌ์ฉ๊ฐ๋ฅ
make1์ Increase, decrease, getResult๋ฅผ ๊ฐ์ง ๊ฐ์ฒด๊ฐ ๋จ.
๋ง์ฝ ํด๋ก์ ํจ์๋ฅผ ์ด์ฉํ์ง ์์๋ค๋ฉด? ํจ์ ๋ด๋ถ์ value๋ฅผ ๋์ง ๋ชปํ๊ณ , value๋ ์ ์ญ๋ณ์๊ฐ ๋๋ค.
์ ์ญ๋ณ์๊ฐ ๋๋ค๊ณ ?
โ ๋ถ์ ํจ๊ณผ๋ก ์ธํด์ ์๋์น ์๊ฒ ๋ณ๊ฒฝ๋ ์ ์์ด!
๋ด๋ถ์ value ๋ณ์๋ฅผ ์ ์ธํ์ฌ ํจ์๋ฅผ ๋ณ๊ฒฝํ์ง ์๋ ์ด์ ์ฝ๊ฒ value๋ฅผ ๋ฐ๊ฟ ์ ์๋ค!
โ ํด๋ก์ ๋ฅผ ์ด์ฉํด์ ์ ์ญ๋ณ์์ ์ฌ์ฉ์ ์ค์ด๊ณ ,
์ค์ฝํ๋ฅผ ์ด์ฉํด์ value์ ๊ฐ์ ๋ณดํธํ ์ ์๋ค!
const make1 = makeResult();
make1.increase();
make1.increase();
make1.decrease();
make1.getResult(); // 1
const make2 = makeResult();
make2.decrease();
make2.decrease();
make2.decrease();
make2.getResult(); // -3
var funcs = [];
for(var i = 0; i < 3; i++){
funcs[i] = function() {return i;};
}
for(var j =0; j < funce.length; j++){
consoe.log(funcs[j]());
}
์ฝ๋ ์ง๋
์งํด
1) ์ฒซ๋ฒ์งธ for๋ฌธ์ ์ฝ๋ ๋ธ๋ก ๋ด ํจ์๊ฐ funcs ๋ฐฐ์ด์ ์์๋ก ์ถ๊ฐ๋๋ค.
2) ๋๋ฒ์งธ for๋ฌธ์ ์ฝ๋ ๋ธ๋ก ๋ด์์ funcs ๋ฐฐ์ด์ ์์๋ก ์ถ๊ฐ๋ ํจ์๋ฅผ ํธ์ถํ๋ค.
3) 0,1,2๋ฅผ ๋ฐํํ ๊น์? ์๋์.
4) for๋ฌธ์ ๋ณ์ ์ ์ธ๋ฌธ์์ varํค์๋๋ก ์ ์ธํ i๋ณ์๋ ๋ธ๋ก ๋ ๋ฒจ ์ค์ฝํ๊ฐ ์๋ ํจ์ ๋ ๋ฒจ ์ค์ฝํ -> ์ ์ญ๋ณ์
5) funcs ๋ฐฐ์ด์ ์์๋ก ์ถ๊ฐํ ํจ์๋ฅผ ํธ์ถํ๋ฉด ์ ์ญ ๋ณ์ i๋ฅผ ์ฐธ์กฐํ์ฌ i์ ๊ฐ 3์ด ์ถ๋ ฅ๋๋ค.
6) ํด๋ก์ ๋ฅผ ์ฌ์ฉํ๊ธฐ์ํด ๋ฐ๋ฅด๊ฒ ๋์ํ๋ ์ฝ๋๋ฅผ ๋ง๋ค์ด๋ด
๋๋ค.
7) ์ ์ญ ๋ณ์ i์ ํ์ฌ ํ ๋น๋์ด ์๋ ๊ฐ์ ์ธ์๋ก ์ ๋ฌ๋ฐ์ ๋งค๊ฐ๋ณ์ id์ ํ ๋นํ ํ ์ค์ฒฉ ํจ์๋ฅผ ๋ฐํํ๊ณ ์ข
๋ฃ๋๋ค.
-> ๋ฐํํ ํจ์๋ funcs ๋ฐฐ์ด์ ์์ฐจ์ ์ผ๋ก ์ ์ฅ.
8) ์ฆ์ ์คํ ํจ์๊ฐ ๋ฐํํ ์ค์ฒฉ ํจ์๋ ์์ ์ ์์ ์ค์ฝํ๋ฅผ ๊ธฐ์ตํ๋ ํด๋ก์ ์ด๋ค.
-> ๋งค๊ฐ๋ณ์ id๋ ์ค์ฒฉ ํจ์์ ๋ฌถ์ฌ์๋ ์์ ๋ณ์๊ฐ ๋์ด ๊ทธ ๊ฐ์ด ์ ์ง.
9) ES6์ let ํค์๋๋ฅผ ์ฌ์ฉํด๋ณด์.
10) for๋ฌธ์ ๋ณ์ ์ ์ธ๋ฌธ์์ let ํค์๋๋ก ์ ์ธํ ๋ณ์๋ฅผ ์ฌ์ฉํ๋ฉด for ๋ฌธ์ ์ฝ๋ ๋ธ๋ก์ด ๋ฐ๋ณต ์คํ๋ ๋๋ง๋ค for๋ฌธ ์ฝ๋ ๋ธ๋ก์ ์๋ก์ด ๋ ์์ปฌ ํ๊ฒฝ์ด ์์ฑ๋๋ค.
11) ์ด๋ ํจ์์ ์์ ์ค์ฝํ๋ for๋ฌธ์ ์ฝ๋ ๋ธ๋ก์ด ๋ฐ๋ณต ์คํ๋ ๋๋ง๋ค ์๋ณ์์ ๊ฐ์ ์ ์งํด์ผํ๋ค.
-> for๋ฌธ์ด ๋ฐ๋ณต๋ ๋๋ง๋ค ๋
๋ฆฝ์ ์ธ ๋ ์์ปฌ ํ๊ฒฝ์ ์์ฑํ์ฌ ์๋ณ์์ ๊ฐ์ ์ ์ง.
โ ย ๋ฐํ๋ ๋ด๋ถํจ์๊ฐ ์์ ์ด ์ ์ธ๋์์๋์ ํ๊ฒฝ์ธ ์ค์ฝํ๋ฅผ ๊ธฐ์ตํ์ฌ ์์ ์ด ์ ์ธ๋์์๋์ ํ๊ฒฝ ๋ฐ์์ ํธ์ถ๋์ด๋ ๊ทธ ํ๊ฒฝ์ ์ ๊ทผํ ์ ์๋ ํจ์.
โ ์์ ์ด ์์ฑ๋ ๋์ ํ๊ฒฝ์ ๊ธฐ์ตํ๋ ํจ์ .
โ(์ฝ์ด) ์ด๋ค ํจ์์์ ์ ์ธํ ๋ณ์๋ฅผ ์ฐธ์กฐํ๋ ๋ด๋ถํจ์๋ฅผ ์ธ๋ถ๋ก ์ ๋ฌํ ๊ฒฝ์ฐ, ํจ์์ ์คํ ์ปจํ ์คํธ๊ฐ ์ข ๋ฃ๋ ํ์๋ ํด๋น ๋ณ์๊ฐ ์ฌ๋ผ์ง์ง ์๋ ํ์.
โ ๋ด๋ถํจ์๊ฐ ์ธ๋ถํจ์์ ๋งฅ๋ฝ(context)์ ์ ๊ทผํ ์ ์๋ ๊ฒ์ ๊ฐ๋ฅดํจ๋ค.
โ ์๋ฐ์คํฌ๋ฆฝํธ์ ๊ณ ์ ํ ๊ฐ๋ ์ด ์๋๋ผ, ์ฌ๋ฌ ํจ์ํ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์์ ๊ณตํต์ ์ผ๋ก ๋ฐ๊ฒฌ๋๋ ํน์ฑ.
๐คจ ์ฝ์ด์๋ฐ์คํฌ๋ฆฝํธ ๊ณต๋ถ๋ฅผ ํ๋ฉด์ ํด๋ก์ ๋ฅผ ๋ฑ ๋ณด์์ ๋ ๋๋ ์๊ฐ์
์ค๋ง์ด๊ฑธ์ ํด๋ก์ ๋
ธ๋์๋ค. ๋
ธ๋๋ ํฅ์ผ๊ฑฐ๋ฆด์ ๋๋ก ๊ฐ์ฌ๊ฐ ๋ฐ๋ก ์ตํ์ก์ง๋ง
์ฝ์ด์๋ฐ์คํฌ๋ฆฝํธ์ ํด๋ก์ ๋ ๋ฐ๋ก ์ตํ์ง์ง๋ ์์์ง๋ง ๋ค๋ฅธ ์ฌ๋๋ค์๊ฒ ์ค๋ช
์ ํด์ฃผ๊ธฐ ์ํด
๊ตฌ๊ธ์ ๊ฒ์ํ๋ฉฐ ๋ค๋ฅธ ๋ถ๋ค์ ์ค๋ช
์ ๋ฐ๋ณตํด์ ๋ฃ๊ณ ๋ณด๊ณ ํ๋ค๋ณด๋ ๋
ธ๋ ๋งํผ ์น์ํด์ง๊ณ ์์์ ๋๋ ์ ์์๋ค.
(๋ํ๋ฏผ๊ตญ์ด๋ผ๋ ์ธ๋ถํจ์์ ์์ธ์ด๋ผ๋ ๋ด๋ถํจ์? ๊ฐ๋จ๋
์ด๋ผ๋ ์ ์ญ๋ณ์์ ์ธ์ด ๊ฑด๋ฌผ์ด๋ผ๋ ๋ด๋ถ ํจ์ ๋ฑ๋ฑ ์ฌ๋ฌ๊ฐ์ง์ ๋น์ ๋ฅผ ํ๋ฉฐ ์ดํดํ๊ณ ์ ๋
ธ๋ ฅํด๋ณด์๋ค!)
์ฐธ๊ณ
ํด๋ก์ ๋ ๋ฌด์์ผ๊น?
ํด๋ก์ MDN
๋ฐฑ๊ณ ๋ฑ์ด ๊ฐ๋ฐ ๋ธ๋ก๊ทธ
์๊ถ's TIL
์ด๋ฏธ์ง Judy