摘要：具有相同的所有構造器的對象都具有相同的類型最后中的中有對于使用函數名這樣的方式創建對象有無是一樣的。對于使用函數名創建對象和無返回值一樣因為默認就會返回。

讀到jquery源碼時我有以下疑惑

問題1 Jquery 中創建對象的奧秘
問題2 JavaScript中this的指向問題
問題3 return this 的作用
問題4 instanceof / 對象和類之間的關系

//代碼1(Jquery 創建對象)

var iQuery=function (){
    name="iQuery";   //4
    return new iQuery.prototype.init();   //1
};
iQuery.prototype={
    init : function(){
        name="iQueryPrototypeInit";   //5
        return this;   //2
    },

    name : "iQueryPrototype"   //6
};

iQuery.prototype.init.prototype=iQuery.prototype;   //3

這時我有問題了，//1 處有無new的區別。//2 處有無 return this 的區別。 //3處的作用
在這里我通過對//代碼1 進行分解來回答 問題1 到 問題4

//代碼2 我將 //代碼1 中的 //3 處去掉 //2 處去掉 //1 處去掉

var iQuery=function (){
    name="iQuery";
    return iQuery.prototype.init();
};
iQuery.prototype={
    init : function(){
        name="iQueryPrototypeInit";   //5
    },

    name : "iQueryPrototype"
};

iQuery().name; //結果為  VM105:1 Uncaught TypeError: Cannot read property name of undefined(…)

分析: iQuery.prototype.init() 是調用了init函數，由于函數沒有返回值，所以只返回了控制 return iQuery.prototype.init() 也沒有返回值iQuery().name;會有以上錯誤提示

//代碼3

var iQuery=function (){
    name="iQuery";   //4
    return new iQuery.prototype.init();   //1
};
iQuery.prototype={
    init : function(){
        name="iQueryPrototypeInit";   //5
    },

    name : "iQueryPrototype"   //6
};

iQuery().name;  //結果為  undefined 這里并不提示錯誤，而是說name沒有定義;

分析: //4處 name為iQuery 的局部變量，//5 處name是init的局部變量。
執行iQuery()時創建了一個init的對象，這時init是構造函數，執行時流程

1 創建一個對象
2 返回新建的對象
這就是有無 new 的區別

//代碼4 多了個this

    var iQuery=function (){
        name="iQuery";   //4
        return new iQuery.prototype.init();   //1
    };
    iQuery.prototype={
        init : function(){
            this.name="iQueryPrototypeInit";   //5
        },
    
        name : "iQueryPrototype"   //6
    };

iQuery().name;  //結果為  `iQueryPrototypeInit`

分析: 執行 iQuery().name;執行流程

1 創建一個對象
2 讓 this 引用這個對象
3 為 this 所引用的對象添加屬性 name
4 返回 this 所引用的對象

iQuery() instanceof iQuery  //false
iQuery() instanceof iQuery.prototype  //VM125:1 Uncaught TypeError: Right-hand side of "instanceof" is not callable(…)

說 iQuery.prototype 是一個對象 instanceof 右邊必須是類，即函數名

iQuery() instanceof iQuery.prototype.init;  //true

這里調用 iQuery() 是創建了init的一個對象。

//代碼5 多了//2

var iQuery=function (){
    name="iQuery";   //4
    return new iQuery.prototype.init();   //1
};
iQuery.prototype={
    init : function(){
        this.name="iQueryPrototypeInit";   //5
        return this;   //2
    },

    name : "iQueryPrototype"   //6
};

iQuery().name;  //結果為  iQueryPrototypeInit

分析: 執行 iQuery().name;執行流程

1 創建一個對象
2 讓 this 引用這個對象
3 為 this 所引用的對象添加屬性 name
4 返回 this 所引用的對象

iQuery() instanceof iQuery  //false
iQuery() instanceof iQuery.prototype  //VM125:1 Uncaught TypeError: Right-hand side of "instanceof" is not callable(…)

說 iQuery.prototype 是一個對象 instanceof 右邊必須是類，即函數名

iQuery() instanceof iQuery.prototype.init;  //true

這里調用 iQuery() 是創建了init的一個對象。

總結1 如果使用new創建對象加不加 return this 是一樣的。

//代碼6 去掉//1 處的 new //2處有 return this

var iQuery=function (){
    name="iQuery";   //4
    return iQuery.prototype.init();   //1
};
iQuery.prototype={
    init : function(){
        this.name="iQueryPrototypeInit";   //5
        return this;   //2
    },

    name : "iQueryPrototype"   //6
};
iQuery().name;   // iQueryPrototypeInit

如果去掉 //5

iQuery().name;   // iQueryPrototype

分析: 執行 iQuery() 返回了 iQuery.prototype 這個由字面常量創建的對象

如果沒有去掉 //5 則給 iQuery.prototype 添加了 name 屬性覆蓋了原有的name
在這里 iQuery.prototype.init() 是 iQuery.prototype 這個對象調用了 init 函數
所以 init 的 this 指向了 iQuery.prototype

結論2: 函數中的 this 始終指向直接調用它的對象 ，注意是直接，為什么說是直接 請看 //代碼6

//代碼7

var iQuery=function (){
    name="iQuery";   //4
    return iQuery.prototype.init();   //1
};
iQuery.prototype={
    init : function(){
        return this;   //2
    },

    name : "iQueryPrototype"   //6
};

var temp ={};
temp.name="temp";
temp.sayName=iQuery().init;  // 等價于 temp.sayName=iQuery.prototype.init;
temp.name;   // 結果  temp
temp.sayName.name;   // 結果  temp

分析: 執行 temp.sayName=iQuery().init; 為對象 temp 添加了一個 sayName 方法，sayName 引用了 iQuery().init/temp.sayName=iQuery.prototype.init這時 init 中的 return this 這個 this 指向 temp 因為是 temp 直接調用 init

總結:JavaScript中的 this 是上下文 這個上下文特指是函數的上下文，就是函數所屬的對象JavaScript中的 bind,call,apply 方法都能切換 函數的上下文，這和代碼 //6 的原理相同都是改變 this 的指向，所以叫做上下文切換

//代碼8 (本文最重要的點) 對象和類之間的關系(instanceof)

var iQuery=function (){
    name="iQuery";   //4
    return new iQuery.prototype.init();   //1
};
iQuery.prototype={
    init : function(){
    },

    name : "iQueryPrototype"   //6
};

iQuery.prototype.init.prototype=iQuery.prototype;   //3

// 注意 增加了 //3
這時執行：

a: iQuery() instanceof iQuery().init; //true
b: iQuery() instanceof iQuery; //true;

如果去掉 //3
c: iQuery() instanceof iQuery; //false;

分析: 我調用 iQuery() 創建的明明是 構造器 init 的對象啊 a:的結果才是符合邏輯的結果，b: 是什么鬼啊，和他有毛關系啊

  請看  //代碼9  //代碼10

//代碼9

var pro={};
var A=function(){};
A.prototype=pro;
var B=function(){};
B.prototype=pro;
var a=new A();
var b=new B();
執行:
a instanceof A;   //true
a instanceof B;   //true
b instanceof A;   //true
b instanceof B;   //true

//代碼10

var pro={};
var A=function(){};
A.prototype=pro;
var B=function(){};
B.prototype=pro;
var a=new A();
var b=new B();
var C=function(){};
C.prototype=a;
var c=new C();

c instanceof A;   //true
c instanceof B;   //true
c instanceof C;   //true

分析: 看到這里大家一定會明白Jquery的設計者為什么加 iQuery.prototype.init.prototype=iQuery.prototype;

雖然源碼中用了 fn 但是 fn 就是 Jquery.prototype我給出我的結論

結論3: JavaScript 中的對象和類(即 構造器) 之間除了 對象的_proto_ 屬性指向了 類(構造器)指定的 prototype之外，對象和類之間沒有更多的關系。類型完全由 prototype 決定。具有相同 prototype 的所有構造器的對象都具有相同的類型

最后: Jquery中的init中有 return this 對于使用 new 函數名() 這樣的方式創建對象有無 return this 是一樣的。那Jquery為什么加啊，因為Jquery中的很多其它方法可以進行鏈式調用，這些方法中通過 return this 返回由init創建的對象，為了保持一致 所以init中的 return this 真的可以去掉。對于使用 new 函數名() 創建 對象 return this 和無返回值一樣因為默認就會返回 this。 return 基本類型，則 return 會被忽略依然 return this。 如果 return 引用類型 那么返回結果就是 引用類型的對象。