클로져>>>>
https://medium.com/@khwsc1/번역-자바스크립트-스코프와-클로저-javascript-scope-and-closures-8d402c976d19
클로져 문제는
왜냐하면 outer()함수가 선언될 당시의 유효한 환경을 기억하고 있다가, outer()함수를 호출할 때 기억했던 환경을 사용할 수 있기 때문입니다.이게 장점일수도 있지만.
단점의 경우,
그래서 근데, 기억을하고있으면 기존값이 계속 적용되므로 반복문의경우 끝값만 찍히게되어
내가원하는 결과가 나오지않으므로,
문제가된다.
============
보통
클로져는 외부함수가 리턴된 이후에도 외부함수의 변수에 접근할수 있다.
그이유는 클로져는 외부함수의 변수에 대한 참조를 저장하기 떄문이다.
원래 함수의 리턴은
리턴이 되면 즉시 함수가 종료된다고 배웠다.
그래서 리턴이후의 값이나 그안의 변수들은 리턴이 되고나면 쓸수 없다고 생각하겠지만,
클로져에서는 리턴이 되더라도 쓸수있다.(접근이 가능하다는 말이다.)
즉,
외부함수와 내부함수가 있는 중첩함수형태가 있을때
외부함수가 먼저 실행이 되고 리턴되어 리턴값이 내부함수가 된다면,
외부함수에서 리턴이 되고, 외부함수가 종료가 되도
내부함수에서 외부함수의 변수를 끌어다 쓸수있다.
그게 클로져다.
외부함수의 주기가 끝나도, 내부함수에서는 여전히 외부함수의 변수를 쓸수있다.
클로져는 실제 값을 저장하지 않습니다.
클로져가 호출되기 전에 외부함수의 변수가 변경 되었을때,
========================================
특히 중요한거>>>
클로져
즉, 함수안에 익명함수에서는
정확히 말하자면, 총 두개의 호출이 필요하다
왜냐면 함수가 두개니까 (중첩함수)
function x (){
return function(){
return
}
}
이런 중첩함수가 있을때
일단 구조가
외부함수안에 리턴값으로
익명함수가 있다
그럼 일단 함수를 실행시키려면 어떻게 해야하냐면,
x(); 이렇게 하면 외부함수x만 실행이된다(물런 리턴값으로 실행이 되지만 익명함수를 호출하지않았으므로 그냥 익명함수 자체는 실행이 안되고 그냥 정의만 되는 단계임!
그러면
호출하는데 2가지 방법이 있는데,
x()();
이렇게 하면 익명함수까지 다 호출이 되는거다.
아니면
변수에 담아서 그 변수를 호출하면된다.
var y = x(); // 이부분에서는 x()함수만 호출한 상태(리턴이 이미 된상태(리턴은 됬지만 익명함수부분은 호출이 안됬음))
y(); // 이제 이부분은 익명함수까지 호출한 상태!!
즉, y(); 이렇게 하는건 익명함수를 호출한 건데
왜냐면
x함수에서 의 리턴값이 최종값이라고 할수있는데 ,
그말은 x함수를 호출하면 결국 리턴값을 가르킨다는 소리인데,
그럼
그 리턴값을 y라는 변수에 담은 셈이고,
y변수에 담긴건 결국 리턴값이고,
그 y변수에 감긴 리턴값은 익명함수라는 말이고,
그럼
y변수하고 괄호를 () 붙여주면,
그 익명함수를 호출한다는 의미이다.(최종적으로 익명함수를 가르키니까)
추가적으로>>
x()() 여기에는 첫번째 괄호에는 x함수의 프로퍼티로 전달되고, 두번쨰 괄호는 익명함수의 프로퍼티로 전달되는 아규먼트이다.
그리고
var y = x(); // 이부분의 괄호는 외부함수x의 아규먼트(전달인자)이고
y();
여기에는 익명함수의 아규먼트(전달인자)가 된다.
====================
// 0-9 값을 반환하는 함수들의 배열을 반환
function constfuncs() {
var funcs = [];
for(var i = 0; i < 10; i++)
funcs[i] = function() { return i; };
return funcs;
}
var funcs = constfuncs();
funcs5 // 무엇이 반환될까?
이 코드는
10이 출력이 되는데
for문을 도는데, 10번을 도는동안 , 실행문은 그냥
funcs[0] = function() { return i; };
return funcs;
funcs[1] = function() { return i; };
return funcs;
funcs[2] = function() { return i; };
return funcs;
funcs[3] = function() { return i; };
return funcs;
이런식으로 func[] 이부분만 카운팅되며 바뀌어서0부터 9까지 카운팅이 되고(총 10번)
그 뒤에 익명함수부분은 따로 호출을 아직 안했으므로 실행이 되지않고 계속 정의만 된 상태이다.
이부분은 사실
var funcs = constfuncs(); 여기서 외부함수 constfuncs 만 실행이되버리는 부분에 해당되는 시점이다.
그러다가 10번이 다돌고
funcs5 이 코드를 만나면
최종적으로 저 익명함수가 실행이 되면서 익명함수의 리턴값 i 는 이미 10을 가리키고
그 i 값을 funsc 에 넣고
찍히는 값은 5번째 칸에 숫자 10이 찍히는 거다
=======================================
대부분 클로져의 문제의 경우 익명함수부분이 실행이 뒤에 되는 문제떄문에,
즉시실행함수로 수정하는 것으로 해결한다.
==========================================
https://meetup.toast.com/posts/86
======================================
클로져 문제 해결
let 으로 해결하기