JavaScript 클로저 파트 3: 클로저 사용법

실제로 클로저를 사용하면 funarg에 정의된 다양한 계산 방법을 사용자 정의할 수 있어 매우 우아한 디자인을 만들 수 있습니다. 다음은 배열 정렬의 예입니다. 정렬 조건 함수를 매개변수로 받습니다.

[1, 2, 3].sort(function (a, b) {
  ... // 排序条件
});

같은 예에서 배열의 map 메소드는 원본 배열을 기반으로 새 배열에 매핑합니다. 함수에 정의된 조건:

[1, 2, 3].map(function (element) {
  return element * 2;
}); // [2, 4, 6]

기능적 매개변수를 사용하면 검색 방법을 쉽게 구현하고 무제한 검색 조건을 지원할 수 있습니다.

someCollection.find(function (element) {
  return element.someProperty == 'searchCondition';
});

응용 기능도 있습니다. , 예를 들어 일반적인 forEach 메서드는 각 배열 요소에 함수를 적용합니다.

[1, 2, 3].forEach(function (element) {
  if (element % 2 != 0) {
    alert(element);
  }
}); // 1, 3

그런데 함수 개체의 적용 및 호출 메서드도 함수형 프로그래밍에서 응용 함수로 사용할 수 있습니다. 여기서는 이를 응용 프로그램 함수, 즉 매개 변수에 적용되는 함수(적용의 매개 변수 목록, 호출의 독립 매개 변수)로 생각합니다.

(function () {
  alert([].join.call(arguments, ';')); // 1;2;3
}).apply(this, [1, 2, 3]);

또 다른 클로저가 있습니다. 매우 중요한 응용 프로그램 - 지연된 호출:

var a = 10;
setTimeout(function () {
  alert(a); // 10, after one second
}, 1000);

및 콜백 함수:

//...
var x = 10;
// only for example
xmlHttpRequestObject.onreadystatechange = function () {
  // 当数据就绪的时候，才会调用;
  // 这里，不论是在哪个上下文中创建
  // 此时变量“x”的值已经存在了
  alert(x); // 10
};
//...

보조 개체를 숨기기 위해 캡슐화된 범위를 만들 수도 있습니다.

var foo = {};
 
// 初始化
(function (object) {
 
  var x = 10;
 
  object.getX = function _getX() {
    return x;
  };
 
})(foo);
 
alert(foo.getX()); // 获得闭包 "x" – 10

요약

이 글에서는 ECMAScript-262-3에 대한 좀 더 이론적 지식을 소개하고 있으며, 이러한 기본 이론은 ECMAScript의 클로저 개념을 이해하는 데 도움이 된다고 생각합니다.

위 내용은 JavaScript 클로저 3부 내용입니다. 클로저 사용법에 대한 자세한 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!