[전단 엔지니어 매 뉴 얼] JavaScript 의 폐쇄

폐쇄 는 확실히 엉터리 개념 이다. 학교 모집 사 모집 은 모두 물 어 볼 것 이다. 오늘 한 번 총결산 하 자.먼저 정 의 를 내 립 니 다. 패 킷 은 함수 와 이 함수 의 품사 작용 역 의 조합 입 니 다.사실 이 정 의 는 비교적 교조 적 인 것 으로 패키지 가 하나의 함수 라 고 직 설 적 으로 이해 할 수 있 으 며 이 함 수 는 내부 에서 설명 하지 않 았 고 매개 변수 가 아 닌 변 수 를 사용 했다.밤 을 들다.

function foo() { 
    var a = 2;
    function bar() { 
        console.log( a );
    }
    return bar; 
}
var baz = foo();
baz(); // 2

상식 적 으로 foo 함 수 는 실행 이 끝 난 후에 내부 변 수 를 없 앨 수 있 습 니 다. 그러나 bar 함수 내 부 는 a 에 대한 인용 을 유지 하고 있 기 때문에 foo () 를 호출 하여 bar 의 인용 을 baz 에 부 여 했 습 니 다. baz () 를 실행 하면 a 를 인쇄 할 수 있 습 니 다.이 밤 에는 함수 bar 와 변수 a 에 대한 인용 이 닫 혀 있 습 니 다.
폐쇄 및 역할 영역
폐쇄 와 작용 역 의 관계 에 대해 나의 이 해 는 폐쇄 가 사실은 작용 역 의 연장 이라는 것 이다.자바 스 크 립 트 에서 함수 내부 에서 함수 외부의 변 수 를 사용 할 수 있 기 때문에 모든 것 은 자신 도 모 르 게 패 킷 이 생 길 수 있 습 니 다. 만약 에 위의 코드 세 션 에서 함수 내부 에서 함수 외부의 변 수 를 사용 하 는 것 을 허락 하지 않 는 다 면 패 킷 을 닫 는 것 도 말 할 수 없습니다.
가방 을 닫 으 면 무슨 소 용이 있 습 니까?
개인 변수 와 개인 방법 을 모 의 합 니 다.

var Dog = (function(){
    var privateVal = 'dog'
    function doing(val) {
        console.log(privateVal + ' ' + val)
    }

    return {
        run: function(){
            doing('run')
        },
        bark: function(){
            doing('bark')
        }
    }
})()

Dog.run()    // dog run
Dog.bark()   //  dog bark

이 를 통 해 알 수 있 듯 이 run 과 bark 두 패 키 지 는 같은 품사 역할 영역 을 공유 하고 개인 적 인 방법 doing 을 참조 했다.이렇게 하면 우 리 는 run 과 bark 두 개의 공공 인터페이스 만 외부 에 노출 시 켜 개인 적 인 변수 와 방법 을 숨 길 수 있다.
폐쇄 와 순환
어쩌면 면접 에서 가장 많이 나 온 문제 일지 도 몰라..

for(var i = 1;i <= 5;i++) {
    setTimeout(function() {
        console.log(i)
    }, i*1000)
}
//         6，   5 

우리 가 생각 하 는 순서대로 1 초 간격 으로 1, 2, 3, 4, 5 를 인쇄 하 는 것 이 아니 라 왜 일이 뜻 대로 되 지 않 습 니까?우선, 이 순환 은 5 개의 패 킷 을 만 들 었 고 가장 중요 한 것 은 이 5 개의 패 킷 이 모두 같은 역할 영역 에 있다 는 것 이다. 즉, 같은 i 를 인용 한 것 이다. for 순환 이 끝 날 때 i 는 6 이 되 었 다.그래서 5 개의 익명 함수 가 실 행 될 때 같은 i 를 순서대로 인쇄 하기 때문에 5 개의 6 을 출력 했다.어떻게 해결 합 니까?전에 도 이 다섯 개의 폐쇄 를 서로 다른 역할 영역 에 두 고 각자 의 역할 영역 에서 각자 의 i 를 가지 게 하면 된다 고 말 했다.자체 실행 함수 로 새로운 역할 영역 을 만 들 수 있 습 니 다.

for(var i = 1;i <= 5;i++) {
    (function(k){
        setTimeout(function() {
        console.log(k)
    }, k*1000)
    })(i)
}

이 코드 세 션 에서 모든 setTimeout 은 하나의 독립 된 역할 영역 에 있 고 각자 의 k 를 인용 하여 외부 역할 영역 을 가리 키 는 i 가 아니 기 때문에 1, 2, 3, 4, 5 도 let 를 사용 할 수 있 습 니 다.

for(let i = 1;i <= 5;i++) {
    setTimeout(function() {
        console.log(i)
    }, i*1000)
}

for 머리 를 순환 하 는 let 는 i 를 for 순환 블록 에 연결 할 뿐만 아니 라 사실상 순환 하 는 모든 교체 에 다시 연결 하여 이전 순환 교체 가 끝 날 때의 값 을 다시 할당 하도록 확보 합 니 다.사실 let 를 사용 하 는 본질은...

for(let i = 1;i <= 5;i++) {
    let i =        i
    setTimeout(function() {
        console.log(i)
    }, i*1000)
}

사실 폐쇄 는 이렇게 많은 것 이 고 주로 역할 역 의 개념 이 며 역할 역 이 알 면 폐쇄 도 알 수 있다.that's all, thank you.
참고 자 료 를 통 해 자 바스 크 립 트 시 리 즈 를 깊이 이해 합 니 다. - 폐쇄 MDN - 폐쇄 '모 르 는 자 바스 크 립 트 - 상권', '매일 한 문제' JS 의 폐쇄 는 무엇 입 니까?