자 바스 크 립 트 닫 기

클 로 저(closure)는 자 바스 크 립 트 언어의 어 려 운 점 이자 특색 이 며,많은 고급 응용 은 클 로 저 에 의 해 이 루어 져 야 한다.
function 에 function 이 내장 되 어 있 을 때 내부 function 은 외부 function 의 변 수 를 방문 할 수 있 습 니 다.

function foo(x) {
 var tmp = 3;
 function bar(y) {
  alert(x + y + (++tmp));
 }
 bar(10);
}
foo(2)

몇 번 을 실행 하 든 alert 16 은 bar 가 foo 의 인자 x 에 접근 할 수 있 고 foo 의 변수 tmp 에 도 접근 할 수 있 기 때 문 입 니 다.
하지만 아직 폐쇄 적 인 것 은 아니다.return 이 내부 function 일 때 닫 힌 가방 입 니 다.내부 function 은 close-over 외부 function 의 변 수 를 내부 function 이 끝 날 때 까지 합 니 다.

function foo(x) {
 var tmp = 3;
 return function (y) {
  alert(x + y + (++tmp));
 }
}
var bar = foo(2); // bar        
bar(10);

위의 스 크 립 트 는 최종 적 으로 alert 16 입 니 다.bar 는 foo 의 내부 역할 영역 에 직접 있 지 않 지만 bar 는 x 와 tmp 에 접근 할 수 있 기 때 문 입 니 다.
그러나 tmp 는 bar 폐쇄 된 내부 에 존재 하기 때문에 1 을 추가 합 니 다.그리고 bar 를 호출 할 때마다 1 을 추가 합 니 다.
(6 세 라 는 제한 을 고려 하면 우 리 는 사실 하나의 패키지 방법 만 만 들 수 있 는 것 이 아니다.예 를 들 어 return 의 배열 도 전체 변수 로 설정 할 수 있다.그것들 은 모두 같은 x 와 같은 tmp 를 가리 키 며,각자 사본 이 있 는 것 이 아니다.)
주:이제 일곱 살 짜 리 내용 을 정리 하 겠 습 니 다.
위의 x 는 하나의 글자 액면가(값 전달)입 니 다.JS 의 다른 글자 액면가 와 마찬가지 로 foo 를 호출 할 때 실제 인삼 x 의 값 이 복사 되 었 습 니 다.복 사 된 것 은 foo 의 매개 변수 x 입 니 다.
그러면 문제 가 생 겼 습 니 다.JS 에서 object 를 처리 할 때 인용 전달 을 사용 합 니 다.그러면 foo 를 호출 할 때 object 를 전달 합 니 다.foo 함수 return 의 패 킷 도 최초의 object 를 참조 합 니 다!

function foo(x) {
var tmp = 3;
return function (y) {
 alert(x + y + tmp);
 x.memb = x.memb ? x.memb + 1 : 1;
 alert(x.memb);
 }
}
var age = new Number(2);
var bar = foo(age); // bar         age   
bar(10);

뜻밖에도 매번 bar(10)를 실행 할 때마다 x.memb 는 1 을 추가 합 니 다.그러나 주의해 야 할 것 은 x 가 매번 같은 object 변 수 를 가리 키 는 것 입 니 다.age 는 두 번 bar(10)를 실행 한 후에 age.memb 는 2 가 됩 니 다.
HTML 대상 의 메모리 유출 과 관련 이 있 습 니 다.으,하지만 문 제 를 푸 는 범 위 를 넘 어선 것 같 습 니 다.
return 키 워드 를 사용 하지 않 는 패키지 예 가 있 습 니 다.

function closureExample(objID, text, timedelay) { 
  setTimeout(function() { 
    document.getElementById(objID).innerHTML = text; 
  }, timedelay); 
} 
closureExample(‘myDiv', ‘Closure is created', 500);　

JS 의 function 은 다음 과 같이 접근 할 수 있 습 니 다.
1.매개 변수
2.부분 변수 또는 함수
3.외부 변수(환경 변수?),포괄 하 다
3.1 전역 변수,DOM 포함.
3.2 외부 함수 의 변수 나 함수.
만약 함수 가 외부 변수 에 접근 했다 면,그것 은 패키지 입 니 다.
외부 함 수 는 필수 가 아 닙 니 다.외부 변 수 를 방문 하면 패 킷 을 닫 으 면 이 변 수 를 유지 할 수 있 습 니 다.내부 함수 와 외부 함수 의 예 에서 외부 함 수 는 부분 변 수 를 만 들 고 최종 적 으로 종료 할 수 있 습 니 다.그러나 하나 이상 의 내부 함수 가 종료 한 후에 도 종료 되 지 않 으 면 내부 함수 가 외부 함수 의 부분 데 이 터 를 유지 합 니 다.
전형 적 인 예 는 전역 변수의 사용 이다.
패 키 지 를 닫 으 면 숨겨 진 데 이 터 를 가 진 함 수 를 만 드 는 데 자주 사 용 됩 니 다.

var db = (function() {
//        object,   object      
//           object 
var data = {};
//       ,           data      
return function(key, val) {
  if (val === undefined) { return data[key] } // get
  else { return data[key] = val } // set
  }
//             
//         ，      
})();

db('x'); //    undefined
db('x', 1); //   data['x'] 1
db('x'); //    1
//        data  object  
//             

다음은 폐쇄 사용 주의 점 을 살 펴 보 겠 습 니 다.
1)패 킷 을 닫 으 면 함수 의 변 수 를 메모리 에 저장 하고 메모리 소모 가 많 기 때문에 패 킷 을 남용 해 서 는 안 됩 니 다.그렇지 않 으 면 웹 페이지 의 성능 에 문제 가 생 겨 IE 에서 메모리 가 유출 될 수 있 습 니 다.해결 방법 은 함 수 를 종료 하기 전에 사용 하지 않 는 부분 변 수 를 모두 삭제 하 는 것 입 니 다.
2)패 킷 을 닫 으 면 부모 함수 외부 에서 부모 함수 내부 변수의 값 을 변경 합 니 다.따라서 부모 함 수 를 대상(object)으로 사용 하면 패 키 지 를 닫 는 것 을 공용 방법(Public Method)으로 생각 하고 내부 변 수 를 개인 속성(private value)으로 생각 할 때 부모 함수 내부 변수의 값 을 함부로 바 꾸 지 않도록 조심해 야 합 니 다.
위 에서 말 한 것 은 편집장 이 여러분 에 게 소개 한 자 바스 크 립 트 패키지 지식 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 저 에 게 메 시 지 를 남 겨 주세요.편집장 은 제때에 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!