資訊專(zhuān)欄INFORMATION COLUMN
摘要：設(shè)置新的對(duì)象的隱式原型指向其構(gòu)造函數(shù)的顯式原型執(zhí)行構(gòu)造函數(shù)代碼，指向這個(gè)新的對(duì)象。驗(yàn)證一下步驟和構(gòu)造函數(shù)原型由上面可以看出，沒(méi)有實(shí)例化時(shí)沒(méi)有時(shí)，指向的是那么來(lái)看看后是否會(huì)指向這個(gè)新對(duì)象。
上一個(gè)總標(biāo)題：https://segmentfault.com/a/11...
提問(wèn)：你有對(duì)象了嗎？
答：沒(méi)有。
笨！new一個(gè)不就好了嗎！
問(wèn)題點(diǎn)：為什么我要理解new一個(gè)對(duì)象的過(guò)程？
答：不理解這個(gè)過(guò)程，你就不知道為什么只是new了一下，這個(gè)實(shí)例就能使用原型的各種方法。
new一個(gè)對(duì)象的過(guò)程：需要經(jīng)歷4個(gè)步驟，結(jié)合上一章原型模式為例。
var cat = new Animal("橘貓");
1.創(chuàng)建一個(gè)新的空對(duì)象。
var cat = {}
2.設(shè)置新的對(duì)象的隱式原型指向其構(gòu)造函數(shù)的顯式原型
cat._proto_ = Animal.protype
3.執(zhí)行構(gòu)造函數(shù)代碼，this指向這個(gè)新的對(duì)象。
Animal.call(cat)
4.返回該對(duì)象（返回this）
var cat = new Animal();
(把返回的對(duì)象保存到變量cat中，所以這個(gè)cat就是這個(gè)對(duì)象的實(shí)例，所以cat本身也是一個(gè)對(duì)象)
好啦，你有一個(gè)對(duì)象了。你脫單了。
如果還是比較難以理解那我通俗點(diǎn)的講：
原先的代碼長(zhǎng)這個(gè)樣子。
//構(gòu)造函數(shù)
function Animal(name){
this.name = name;
//為什么在原型里的方法放到構(gòu)造函數(shù)里呢，因?yàn)?.設(shè)置新的對(duì)象的隱式原型指向其構(gòu)造函數(shù)的顯式原型
this.eat = function(val){
console.log(this.name + " like eat "+ val);
}
}
使用了new操作符后就變成了這樣。
//構(gòu)造函數(shù)
function Animal(name){
//1.創(chuàng)建一個(gè)空的對(duì)象（為了方便理解我們讓這個(gè)對(duì)象就叫this）
var this = {};
//3.執(zhí)行構(gòu)造函數(shù)代碼，往this里添加屬性和方法。
this.name = name;
this.eat = function(val){
console.log(this.name + " like eat "+ val);
}
//4.返回該對(duì)象（返回this）
return this;
}
所以當(dāng)我們 var cat = new Animal("橘貓");
就相當(dāng)于 var cat = this; //this里面的方法屬性cat都可以用。
驗(yàn)證：我們?nèi)ヲ?yàn)證一下，是否做了以上這幾件事。
驗(yàn)證步驟2：
在控制臺(tái)輸出一下日志：
由上圖可以看到，cat._proto_和 Animal.protype是完全相等的。說(shuō)明2成立。
驗(yàn)證一下步驟3和4：
//構(gòu)造函數(shù)
function Animal(name){
this.name = name;
console.log("this:",this)
}
// 原型
Animal.prototype = {
eat:function(val){
console.log(this.name + " like eat "+ val);
}
}
Animal();//window
由上面可以看出，沒(méi)有實(shí)例化時(shí)（沒(méi)有new時(shí)），this指向的是window.
那么來(lái)看看new后this是否會(huì)指向這個(gè)新對(duì)象。
//構(gòu)造函數(shù)
function Animal(name){
this.name = name;
console.log("this:",this)
}
// 原型
Animal.prototype = {
eat:function(val){
console.log(this.name + " like eat "+ val);
}
}
// 實(shí)例化
var cat = new Animal("橘貓");
console.log("cat就是：",cat)
控制臺(tái)輸出日志如下：
兩者完全相同，由此我們可以驗(yàn)證步驟3和4成立。執(zhí)行了構(gòu)造函數(shù)且this指向這個(gè)新對(duì)象。
問(wèn)題：隱式原型和顯式原型是什么？為什么cat能調(diào)用顯式原型里的東西？
下一回：原型鏈 https://segmentfault.com/a/11...
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/98625.html
摘要：所有引用類(lèi)型的隱式原型指向它構(gòu)造函數(shù)的顯式原型。理論就不驗(yàn)證了，寫(xiě)原型模式時(shí)。原型模式構(gòu)造函數(shù)原型實(shí)例化橘貓魚(yú)呀魚(yú)橘貓魚(yú)呀魚(yú)在上述代碼中，在之后就相當(dāng)于這個(gè)函數(shù)。 上一章：new一個(gè)對(duì)象的過(guò)程 https://segmentfault.com/a/11... 原型鏈4大理論：1.所有的引用類(lèi)型都有一個(gè)_proto_屬性，稱(chēng)之為隱式原型。 2.所有的函數(shù)(Function)都有一個(gè)pro...
摘要：所有引用類(lèi)型的隱式原型指向它構(gòu)造函數(shù)的顯式原型。理論就不驗(yàn)證了，寫(xiě)原型模式時(shí)。原型模式構(gòu)造函數(shù)原型實(shí)例化橘貓魚(yú)呀魚(yú)橘貓魚(yú)呀魚(yú)在上述代碼中，在之后就相當(dāng)于這個(gè)函數(shù)。 上一章：new一個(gè)對(duì)象的過(guò)程 https://segmentfault.com/a/11... 原型鏈4大理論：1.所有的引用類(lèi)型都有一個(gè)_proto_屬性，稱(chēng)之為隱式原型。 2.所有的函數(shù)(Function)都有一個(gè)pro...
摘要：所有引用類(lèi)型的隱式原型指向它構(gòu)造函數(shù)的顯式原型。理論就不驗(yàn)證了，寫(xiě)原型模式時(shí)。原型模式構(gòu)造函數(shù)原型實(shí)例化橘貓魚(yú)呀魚(yú)橘貓魚(yú)呀魚(yú)在上述代碼中，在之后就相當(dāng)于這個(gè)函數(shù)。 上一章：new一個(gè)對(duì)象的過(guò)程 https://segmentfault.com/a/11... 原型鏈4大理論：1.所有的引用類(lèi)型都有一個(gè)_proto_屬性，稱(chēng)之為隱式原型。 2.所有的函數(shù)(Function)都有一個(gè)pro...
閱讀 2344·2023-04-25 14:17
閱讀 1536·2021-11-23 10:02
閱讀 2186·2021-11-23 09:51
閱讀 894·2021-10-14 09:49
閱讀 3400·2021-10-11 10:57
閱讀 2932·2021-09-24 09:47
閱讀 3063·2021-08-24 10:00
閱讀 2311·2019-08-29 18:46
