이번은 독서 후 리뷰입니다
javasrcipt 프로토타입 및 클로저에 대한 심층적인 이해 - 클로저
Javasrcipt 비밀 정원 - 클로저 및 함수 참조
클로저에 대한 두 개의 기사를 읽고 난 후에도 뭔가를 얻었습니다. , 요약하자면 잊어버릴까 봐
좋아, 내 공연을 시작하자
클로저란 무엇인가요?
클로저는 JavaScript의 매우 중요한 기능입니다. 즉, 현재 범위는 항상 외부 범위의 변수에 액세스할 수 있습니다.
(일반적인 상황에서 현재 범위는 자신 또는 상위 범위에만 액세스할 수 있습니다.) 범위의 이 부분은 다음에 작성됩니다.
함수는 자체 범위를 갖는 JavaScript의 유일한 구조이므로 클로저 생성 기능에 따라 다릅니다.
이 닫힐 때 함수에는 두 가지 상황이 있습니다.
하나는 함수가 반환 값
으로 전달되는 것이고, 다른 하나는 함수가 매개변수
1로 전달되는 것입니다. 반환 값으로서의 함수
function nihao(){var i=0;return function get(i){ i++; return i; } }var f=nihao(); f(1);
실행 결과는 2
get 함수를 변수 f에 반환 값으로 할당합니다. f(1)이 실행되면 get의 범위에 직접 들어가서 i에 1을 할당하고, i++를 실행하면 i가 2가 되고 i
2를 반환합니다. 함수는 매개변수로 전달됩니다
var a=2,b=function(c){ if(c>a){ console.log(c); } }; (function(f1){ var a=5; f1(3) })(b);
결과는 3입니다.
익명 래퍼(자체 실행 익명 함수)를 실행한 것을 볼 수 있습니다. 그런 다음 함수 b를 익명 함수에 매개변수로 전달합니다.
f1(3)을 실행하면 실제로는 b=function(3)이 실행됩니다.
여기서 문제가 발생합니다. 익명 래퍼에서 실행하면 a가 5로 재정의되었지만 f1이 실행되면 a로 변경됩니다. 2 다시, 그래서 3>2가 성립됩니다. console.log를 실행했습니다
실행 결과에 따르면 f1 함수가 호출되면 실제로 b=function()의 범위에 들어가고 b는 a입니다. 함수 할당 표현식을 통해 정의된 함수
그래서 함수 b와 a는 실제로 동일한 범위에 있고 이때 var a=2도 실행되므로 a를 재정의하는 것과 동일하므로 실행 시 if(c>a; ), a는 2로 재정의되었습니다.
끝난 것 같나요?
틀렸어요, 함수선언으로 다시 결과를 테스트해봤습니다
네, 함수선언으로 b를 정의해도 결과는 3
그래서 함수를 정의하는 방식과는 상관이 없습니다. 함수 선언으로 정의하든, 함수 할당 표현식으로 정의하든 결과는 같습니다
그럼 이렇게 이해하면 됩니다
f1(3)을 실행하면 범위가 익명의 역할에서 변경됩니다. 래퍼 함수 b() 또는 var b=function()이 있는 범위로 도메인을 이동합니다
그 다음 if 판단이 실행되면 a를 찾겠지만 함수 b에서는 찾지 못하고 그 다음 찾아봅니다. 여기에 정의된 상위 항목에 대해 A var a=2; 현재 a를 찾은 다음 if 문
3>2을 계속 실행한 다음 console.log를 실행하고 3
summarized를 출력합니다. , 둘이 요약 안된거같아 끝났어
잊어, 다음꺼 먼저 적어
자, 비밀정원에 어떻게 써있는지 볼까
function Counter(start) { var count = start; return { increment: function() { count++; }, get: function() { return count; } } }var foo = Counter(4); foo.increment(); foo.get();
이 빌어먹을 실행 순서를 분석해보자
우선 함수 할당 표현식을 통해 변수 foo에 Counter 메서드를 할당하면 foo도 이제 함수가 됩니다
스코프를 참조하거나 할당할 수 없기 때문입니다. JavaScript에서는 외부에서 변수에 액세스할 수 있는 방법이 없습니다. 유일한 방법은 클로저를 이용하는 것입니다.count
할당 시 매개변수 4도 전달되고, foo.increment()를 실행하면 이때 이미 클로저입니다.
위 내용은 JavaScript 클로저 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!