jqueryコア

7475 ワード

1.オブジェクトを作成するには、newメソッドを使用してオブジェクトを構築することができます.jqueryもオブジェクトであり、new jquery()を使用して構築されるはずです.なぜjqueryオブジェクトを作成するには、new jquery()ではなく、$(ele)のような方法でjqueryオブジェクトを構築するのでしょうか.実は内部はnewを使って構築されていますが、jquery内部が構築してくれただけです.次のコードを見てください.
function Jquery() {
        return new Jquery();
    }

    Jquery.prototype = {
        version:'1.01'
    }

このように内部でnewを用いてJqueryを構築するのは明らかに問題があり,これによりデッドサイクルが形成される.デッドサイクルの問題を解決するには、次のコードを参照してください.
function Jquery(selector, context) {
    return Jquery.prototype.init(selector, context);
}

Jquery.prototype = {
    version:'1.01',
    init: function () {
        this.name = "lin";
        return this;
    }
}

var a = Jquery();
var b = Jquery();
console.log(a.version); //1.01
console.log(a.name);   //lin
a.name = "na";
console.log(b.name);  //na

2.デッドサイクルの問題は確かに解決したが、新しい問題が発見された.aとbの2つのオブジェクトの属性が共通であることがわかる.私はa.name属性をnaに変更し、b.name属性もnaに変更した.その原因はthisがJqueryを指しているからだ.この問題を解決するために、Jquery()を呼び出すたびに新しいオブジェクトを構築することができる.改善コードは以下の通りである.
function Jquery() {
    return new Jquery.prototype.init(); //   ,     new
}

Jquery.prototype = {
    version:'1.01',
    init: function () {
        this.name = "lin";
        console.log(this);
        return this;
    }
}

var a = Jquery();
var b = Jquery();
console.log(a.version); //undefined
console.log(a.name);   //lin
a.name = "na";
console.log(b.name);  //lin

3.このような処理の後、属性共有の問題はすでに解決して、各オブジェクトはすべてそれぞれの属性があって、自由に修正することができて、各オブジェクトは互いに影響しないで、しかしまたまた新しい問題を発見して、私達のコンソールがa.versionのこの属性を印刷する時この属性を読み取ることができないことを見ることができて、原因はこの時Jqueryにあります.prototypeとJquery.prototype.init.prototypeは互いに関係なく、Jqueryを作成しました.prototype.initオブジェクトなのでJqueryしか読めません.prototype.init.prototype上の属性はJqueryに読み込めない.prototype上の属性の(この例はversionという属性を指す)、解決方法は簡単で、Jquery.义齿prototype.init.prototype,これはJqueryプロトタイプ上の属性をすべてJqueryに付与ことに相当する.Initのプロトタイプでは、次のコードを参照してください.
function Jquery(selector, context) {
    return new Jquery.prototype.init(selector, context);
}

Jquery.prototype = {
    version:'1.01',
    init: function () {
        this.name = "lin";
        return this;
    }
}
/*  init    jQuery   ,   init     jQuery   */
Jquery.prototype.init.prototype = Jquery.prototype;  

var a = Jquery();
var b = Jquery();
console.log(a.version); //1.01
console.log(a.name);   //lin
a.name = "na";
console.log(b.name);  //lin

ps:公式表記
(function (window, undefined) {
    var jQuery = function() {
        return new jQuery.prototype.init();
    }
    wjQuery.prototype = {
        //          
        constructor: jQuery,
        init: function(){
        }
    }

    /*  init    wjQuery   ,   init     wjQuery   */
    jQuery.prototype.init.prototype = jQuery.prototype;
  /* window jQuery $ */ window.wjQuery
= window.$ = jQuery; })(window);
  • 閉パケット構造参照window
  • 閉包構造は実参windowに伝わり、中は形参で受信する.
  • 内部windowを参照するクエリー時間を短縮する
  • 便利圧縮コード

  • 形参照undefined
  • ieの低バージョンのブラウザはundefinedに値を割り当てることに成功したため、undefinedの純潔を保証するために実パラメータの位置がなく、undefined
  • であることを保証した.