JavaScript関数モジュール、カスケード、アプリケーション、メモリ使用例の詳細な説明

モジュールは、インターフェイスを提供するが、状態と実装を隠す関数またはオブジェクトです。
一般形式: プライベート変数と関数を定義する関数。クロージャを使用してプライベート変数と関数にアクセスできる特権関数を作成し、最終的にこの特権関数を返すか、アクセスできる場所に保存します。

Function.prototype.method = function(name,func){
    this.prototype[name] = func;
    return this;
};
String.method("deentityify",function(){
    var entity = {
        quot : '"',
        lt   : &#39;<&#39;,
        gt   : &#39;>&#39;
    };
    return function(){
        return this.replace(/&([^&;]+);/g, function(a, b){ // 怎样知道a、b的值，了解正则表达式
            var r = entity[b];
            return typeof r === "string" ? r : a;
        });
    };
}());
alert("<">".deentityify()); // 测试：<">

注: モジュール パターンは、通常、シングルトン パターンと組み合わせて使用​​されます。JavaScript のシングルトン パターンは、オブジェクトの属性値に数値または関数を使用できますが、属性値には使用できません。オブジェクトのライフサイクル中に存在し、変更が発生します。

カスケード (連鎖操作)
値を返さない一部のメソッドの場合、未定義の代わりにこれを返し、オブジェクトに対するカスケード (連鎖) 操作を開始できます。以下の通り:

var $ = function(id){
    var obj = document.getElementById(id);
    obj.setColor = function(color){
        this.style.color = color;
        return this;
    };
    obj.setBgColor = function(color){
        this.style.backgroundColor = color;
        return this; // 返回this对象，启动级联
    };
    obj.setFontSize = function(size){
        this.style.fontSize = size;
        return this;
    };
    return obj;
};
$("test").setColor("red")
         .setFontSize("30px")
         .setBgColor("blue");
// 改进后的代码：
(function(id){
    var _$ = function(id){
        this.element = document.getElementById(id);
    };
    _$.prototype = {
        setColor : function(color){
            this.element.style.color = color;
            return this;
        },
        setBgColor : function(color){
            this.element.style.backgroundColor = color;
            return this;
        },
        setFontSize : function(size){
            this.element.style.fontSize = size;
            return this;
        }
    };
     
    // 添加到window原型链中
    window.$ = function(id){
        return new _$(id);
    };
})();
$("test").setColor("red")
         .setFontSize("30px")
         .setBgColor("blue");

Apply
いわゆるアプリケーションとは、関数とそれに渡されたパラメーターを組み合わせて新しい関数を生成することです。例: 次のコードは add() 関数を定義します。この関数は新しい関数を返し、パラメーター値を新しい関数に渡して連続加算操作を実現します。

// 第一种方式：
var add = function(a){
    return function(b){
        return a + b;
    }
};
alert(add(1)(2)); // 3
// 第二种方式：用arguments实现
var add = function(){
    var arg = arguments;
    return function(){
        var sum = 0;
        for(var i=0; i<arg.length; i++){
            sum += arg[i];
        }
        for(i=0; i<arguments.length; i++){
            sum += arguments[i];
        }
        return sum;
    }
};
alert(add(1,2,3)(4,5,6)); // 21
// 第三种方式：通过一个套用方法（curry）实现
var add = function(){
    var sum = 0;
    for(var i=0; i<arguments.length; i++){
        sum += arguments[i];
    }
    return sum;
};
// 添加方法到Function的原型链上
Function.prototype.method = function(name, func){
    this.prototype[name] = func;
    return this;
};
// 套用方法
Function.method(&#39;curry&#39;, function(){
    // 通过数组Array的slice方法，使得arguments也具有concat方法
    var slice = Array.prototype.slice,
        args = slice.apply(arguments), that = this;
    return function(){
        return that.apply(null, args.concat(slice.apply(arguments)));
    };
});
alert(add.curry(1,2)(3,4)); // 10

メモリ
関数はオブジェクトを使用して以前の操作の結果を記憶し、それによって不必要な操作を回避できます。この最適化は記憶と呼ばれます。

りー

以上がJavaScript関数モジュール、カスケード、アプリケーション、メモリ使用例の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。