ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript クロージャ パート 3: クロージャの使用法
実際に使用すると、クロージャは非常にエレガントなデザインを作成でき、funarg で定義されたさまざまな計算方法をカスタマイズできます。以下は配列のソートの例です。これはパラメーターとしてソート条件関数を受け入れます:
[1, 2, 3].sort(function (a, b) { ... // 排序条件 });
同じ例では、関数で定義された条件に従って、配列のマップ メソッドが元の配列を新しい配列にマップします。
[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
ちなみに、関数オブジェクトの apply メソッドや call メソッドは、関数プログラミングのアプリケーション関数としても使用できます。 ここでは、それらをアプリケーション関数とみなします - パラメータに適用される関数 (apply ではパラメータリスト、call では独立したパラメータです):
(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 中国語 Web サイト (www.php.cn) に注目してください。