>  기사  >  웹 프론트엔드  >  js의 클로저(자세한 튜토리얼)

js의 클로저(자세한 튜토리얼)

亚连
亚连원래의
2018-06-07 15:28:442239검색

이 글에서는 주로 js에서의 클로저 학습 경험과 코드 작성의 중요한 포인트를 소개합니다. 이에 관심이 있는 친구들은 함께 배울 수 있습니다.

Closure

중국어 의미는 패키지를 닫는 것입니다. 함수의 범위를 패키지로 생각하면 이 단어는 해당 역할을 생생하게 반영합니다. 함수의 일반적인 실행 흐름은 함수 내의 명령문이 실행된 후 프로그램이 자동으로 함수의 범위를 소멸시키는 것입니다. 그러나 함수에 다른 함수가 선언되고, 부모 함수를 참조하는 변수가 있는 경우. 하위 함수가 실행되면 클로저가 형성됩니다. 이는 상위 함수의 범위를 닫고 프로그램이 이를 파괴하는 것을 방지하는 것과 같습니다.

예:

function a() {
  var name = "xuxu";
  function b() {
    console.log(name);
  }
  // 此处产生闭包 
  b();
} 
a();

클로저는 함수가 자신이 위치한 범위 체인을 기억하고 액세스할 수 있을 때 생성됩니다. 물론 대부분의 클로저는 하위 함수 호출이 다음에서 이루어질 수 있기 때문에 그렇게 직관적이지 않습니다. 상위 함수 기타 예:

function a() {
  var name = "xuxu";
  function b() {
    console.log(name);
  }
  return b;
} 
var c=a();
// 此处产生闭包 此处的c函数其实就是a函数
c();

위 코드를 통해 클로저의 이점도 볼 수 있습니다. 즉, 전역 범위에서 로컬 범위(함수)의 범위에 액세스합니다(여기에 너비가 있습니다). Value는 일반적인 어휘 범위에 따라 수행할 수 없지만 클로저를 사용하면 가능합니다. 그럼 우리가 일반적으로 쓰는

function foo() {
  var a = 2;
  function baz() {
     // 2
    console.log( a ); 
  }
  bar( baz );
}
function bar(fn) {
// 大家快看呀,这就是闭包!
  fn(); 
}

or

var fn;
function foo() {
  var a = 2;
  function baz() {
    console.log( a );
  }
  // 将baz分配给全局变量
  fn = baz; 
}
function bar() {
   // 大家快看呀,这就是闭包!
  fn();
}
foo();
// 2
bar();

를 살펴보겠습니다. 위 내용은 제가 모든 사람을 위해 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

Puppeteer 이미지 인식 기술을 사용하여 Baidu 인덱스 크롤러를 구현하는 방법

jquery 기술을 통해 돋보기 구현

webpack-dev-server에서 자동 페이지 업데이트 구현

위 내용은 js의 클로저(자세한 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.