0

重複の可能性:
Javascriptでの「プロトタイプ」と「これ」の使用?

JSフレームワークの作成に関するこのブログ投稿を読んでいます。私は(ある程度)ECMAプロトタイプの概念、および一般的なスコープとクロージャに精通しています。ただし、次のようなコードの詳細については確信が持てません。

var myFramework = (function (window, document) {
    var /* Global variables */

    myFramework = function (el, options) {
        // code
    };

    myFramework.prototype = {
        // code
    };

    return myFramework;
})(window, document);

ウィンドウとドキュメントが渡される理由を理解しています(このビデオで説明されているように、リソースを節約するため)。特に私を困惑させるのは、なぜとの両方が必要なmyFramework = function () {}myFramework.prototypeですか?それはなんのためですか?代わりにthis内部で宣言を使用してみませんか?myFramework = function () {}

4

1 に答える 1

1

javascriptでは、プロトタイプオブジェクト(この場合はmyFramework.prototype)により、クラスのすべてのインスタンスが同じメソッドとプロパティを共有できます。例えば:

myFramework.prototype = {
    version: "0.0.1",
    fancyMethod: function(){//...//}
};

//...// Somewhere else in code.

var framework = new myFramework();
var framework2 = new myFramework();

framework.version; // ---> "0.0.1"
framework2.version; // ---> "0.0.1"

//What if?
myFramework.prototype.version = "0.0.2";
framework.version; // ---> "0.0.2"
framework2.version; // ---> "0.0.2" //This will surprise most developers.

これは、プロパティが直接のインスタンスにない場合、プロトタイプオブジェクトでプロパティまたはメソッドを探すためです。ただし、プロパティがインスタンスに設定されると、値を見つけるためにプロトタイプチェーンを検索することはなくなります。例えば。

framework.version = "0.0.3";

framework2.version; // ---> "0.0.2" Still looks up the prototype chain.
framework.version; // ---> "0.0.3" Now it finds the property on the instance.

プロトタイプオブジェクトは主にメソッドに使用されます。プロトタイプオブジェクトでプロパティを使用すると、少し混乱します。

これがどのように使用されているかを示す最良の例は、jQueryを使用することだと思います。私が正しければ、jQuery.fnはjQuery.prototypeと同じです。これは、以前に作成されたjQueryのインスタンスが新しく割り当てられたメソッドを取得する方法です。それは興味深い概念ですが、いつ使用するかを理解するのは難しいです。

プロトタイプオブジェクトを使用すると、インスタンスの作成時に割り当てる必要のない新しいメソッドとプロパティ(インスタンスが作成されている場合でも)を使用して、すべてのインスタンスをその場で拡張できます。

これがjsFiddleの例です

于 2012-10-25T16:28:48.503 に答える