> 웹 프론트엔드 > JS 튜토리얼 > JavaScript에서 클로저의 의미는 무엇이며 어떻게 사용합니까?

JavaScript에서 클로저의 의미는 무엇이며 어떻게 사용합니까?

清浅
풀어 주다: 2018-11-21 14:16:10
원래의
2580명이 탐색했습니다.



이 기사는 JavaScript의 클로저에 대한 지식 포인트를 공유할 것이며 특정 참조 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다.

클로저는 함수와 어휘 환경의 조합입니다. 함수가 선언된 경우 내부 함수를 외부에 저장하면 클로저가 생성되고 클로저로 인해 원래 스코프 체인이 해제되지 않아 메모리 누수가 발생하지만 동시에 클로저는 특정 데이터를 객체와 결합할 수 있기 때문에 매우 유용합니다. 이 데이터에 대한 작업은 연결됩니다.

예:

function demo() {
  var name = '张三'; // name 是demo()创建的局部变量
  function demo1() { //demo1()是demo()中的内部函数(闭包)
    console.log(name); // 使用父函数中声明的变量  
    }
  demo1();  
    }demo();
로그인 후 복사

실행 결과

Image 1.jpg

demo() 함수에 name이라는 로컬 변수와 deco1()이라는 내부 함수를 만듭니다. 데모1() 함수는 데모() 함수 본문 내에서만 사용할 수 있습니다. 데모1에는 자체 지역 변수가 없습니다. 하지만 내부 함수는 외부 함수의 변수에 접근할 수 있으므로, 데모1()은 부모 함수인 데모()에 선언된 변수 이름 name에 접근할 수 있습니다. 단, 동일한 이름의 변수 name이 데모1에 정의되어 있으면 해당 함수에 정의된 이름이 사용됩니다. 이 예에서는 중첩 함수가 외부 범위에 선언된 변수에 액세스할 수 있음을 보여줍니다.

위 코드를 이렇게 바꾸면 어떻게 될까요?

function demo() {
  var name = '张三';
  function demo1() {
    console.log(name);
  }
  return demo1;
  }
  var newDemo = demo();
  newDemo();
로그인 후 복사

실행 결과

Image 1.jpg

두 코드의 결과가 동일한 것을 실행 결과에서 볼 수 있습니다. 내부 함수인 데모1()은 실행 전에 외부 함수에 의해 반환되어 클로저를 형성합니다. 이 경우 newDemo()는 데모를 실행할 때 사용되는 함수입니다. 데모1 함수에 대한 참조를 생성하면 newDemo()가 호출될 때 변수 이름 name이 계속해서 console.log(name)에 전달될 수 있습니다.

function num(x) {
  return function(y) {
    return x + y;
  };}
  var num1= num(2);
  var num2 = num(3);
  console.log(num1(2));// 4
  console.log(num2(2));// 5
로그인 후 복사

결과 실행

Image 2.jpg

함수 num(x)를 정의하여 매개변수 x를 받고 새 함수를 반환합니다. 이 새 함수는 매개변수 y도 받고 x와 y의 합을 반환합니다. ;동시에 num1과 num2라는 두 개의 새로운 값이 정의되는데 둘 다 클로저이며 전달된 값은 각각 2와 3입니다.

요약: 위는 이 글에서 공유한 내용이고, 모든 사람에게 도움이 되기를 바랍니다.



위 내용은 JavaScript에서 클로저의 의미는 무엇이며 어떻게 사용합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿