JavaScript의 클로저에 대한 자세한 설명

클로저: 클로저는 다른 함수의 변수를 참조하는 함수이므로 해당 변수를 참조하므로 재활용되지 않으므로 프라이빗 변수를 캡슐화하는 데 사용할 수 있습니다.

내부 함수가 해당 범위를 정의하는 데이터 외부에서 참조되면 내부 함수의 클로저가 생성됩니다. 내부 함수가 외부 함수에 있는 변수를 참조하면 외부 함수가 호출될 때 이러한 변수는 메모리에 있습니다. 클로저에 필요하기 때문에 해제되지 않습니다

변수 범위: 전역 범위와 로컬 범위 두 가지 유형만 있습니다.

var n=999;
function f1(){
　　alert(n);
}
f1(); // 999
function f2(){
　　var m=999;
}
alert(m); // error
function f3(){
　　i=999; // 函数内部声明变量的时候，一定要使用 var 声明变量，如果不用 var，此时改变量就变成全局变量
}
f3();
alert(i); // 999

외부에서 지역 변수 읽기: 일반적인 상황에서는 불가능하지만 정의할 수 있습니다. 내부 함수가 외부 함수의 변수에 액세스할 수 있도록 함수 내부에 다른 함수를 추가합니다. 또한 외부 함수는 내부 함수 변수에 액세스할 수 없습니다. 이는 JavaScript 언어의 고유한 "체인 범위" 구조이므로 클로저를 여러 곳에서 사용할 수 있습니다. 두 가지 가장 큰 용도가 있습니다. 하나는 앞서 언급한 것처럼 함수 내부의 변수를 읽는 것이고, 다른 하나는 이러한 변수의 값을 메모리에 유지하는 것입니다

function f1() {
  var n = 999;
  function f2() {
    alert(n);
  }
  return f2;
}
var result = f1();
result(); // 999

1> 해당 함수는 메모리에 저장되어 메모리를 많이 소모하므로 클로저를 남용할 수 없습니다. 그렇지 않으면 웹 페이지에서 성능 문제가 발생하고 IE에서 메모리 누수가 발생할 수 있습니다. 해결책은 함수를 종료하기 전에 사용되지 않는 모든 지역 변수를 삭제하는 것입니다.

2> 클로저는 상위 함수 외부의 상위 함수 내부 변수 값을 변경합니다. 따라서 부모 함수를 객체로 사용하고 클로저를 공용 메소드로 사용하고 내부 변수를 개인 값으로 사용하는 경우 주의해야 하며 부모 함수 내부의 변수 값을 변경하지 마십시오.

function f1() {
  var n = 999;
  nAdd = function(){ // nAdd 是全局变量
    n += 1;
  }
  
  function f2() {
    alert(n);
  }
  return f2;
}
var result = f1();
result(); // 999
nAdd();
result(); // 1000

var name = "The Window";
var object = {
  name : "My Object",
  getNameFunc : function() {
    return function() {
      return this.name;
    };
  },
  getNameFunc2 : function() {
    return () => this.name;
  },
  getNameFunc3 : function() {
    this_ = this;
    return function() {
      return this_.name;
    };
  }
};
alert(object.getNameFunc()());  // The Window，this 指向调用的对象，此处执行的时全局 this 
alert(object.getNameFunc2()()); // My Object，使用箭头函数相当于 getNameFunc3 的写法
alert(object.getNameFunc3()()); // My Object

function outerFun() {
  var a =0;
  alert(a);  
}
var a = 4;
outerFun(); // 0
alert(a); // 4

function outerFun() {
  a = 0; // 没有 var，此时 a 是作用于全局变量，将修改全局变量的 a
  alert(a);  
}
var a=4; // 全局变量 a
outerFun(); // 0
alert(a); // 0

위 내용은 JavaScript의 클로저에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!