JavaScript 클로저 요약-JS 튜토리얼-php.cn

JavaScript 클로저 요약

一个新手

풀어 주다： 2017-09-06 13:44:14

원래의

1839명이 탐색했습니다.

이번은 독서 후 리뷰입니다

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();

로그인 후 복사

실행 결과를 봐

이 빌어먹을 실행 순서를 분석해보자