前置

畫原型圖軟件：gliff

一磷箕、prototype（原型）

在一切開始之前回顧一下類、實(shí)例阵难、prototype岳枷、__proto__的關(guān)系

function Person(nick, age){
    this.nick = nick;
    this.age = age;//這里并不是函數(shù)的屬性，而是定義的實(shí)例this呜叫，new個空對象后會對this（實(shí)質(zhì)上也是對這個空對象）進(jìn)行初始化空繁，
                   //函數(shù)返回賦值給p1
}
Person.prototype.sayName = function(){
    console.log(this.nick);
}//在函數(shù)中的prototype增加新的公共屬性

var p1 = new Person();
p1.sayName();  //通過實(shí)例對象p1去調(diào)用

image

二盛泡、原型鏈

先看一個有趣的現(xiàn)象：
我們定義一個數(shù)組，調(diào)用其valueOf方法
[1, 2, 3].valueOf(); // [1, 2, 3]
很奇怪的是我們在數(shù)組的類型Array中并不能找到valueOf的定義娱颊，根據(jù)之前的理論那么極有可能定義在這個實(shí)例的proto（也就是函數(shù)（類）Array的prototype（原型））中用于實(shí)例共享方法傲诵，查看一下

image

image

image

• |新對象： 用字面量的方式寫一個數(shù)組[1,2,3](數(shù)組實(shí)質(zhì)也是一個對象）箱硕，實(shí)際上是創(chuàng)建一個實(shí)例拴竹，即一個new Array（new 了一個對象），當(dāng)然內(nèi)部也會自動添加一個屬性proto
• 函數(shù)： 而這個數(shù)組[1,2,3]就是函數(shù)Array創(chuàng)建的颅痊，proto指向函數(shù)Array內(nèi)部中自動添加屬性prototype殖熟。這個prototype里有很多方法，你只要：函數(shù)名.prototype 就會出現(xiàn)很多方法
• 基本對象的函數(shù)：由于任何類（函數(shù)）的prototype本質(zhì)上都是個類（對象）Object的實(shí)例（生成的一個對象）斑响，所以prototype也和其它實(shí)例一樣也有個proto內(nèi)部屬性菱属，指向其類型Object的prototype。而此時舰罚，函數(shù)Array的prototype中的proto同樣指向object.prototype纽门。

此時，函數(shù)Array.prototype.proto=object.prototype

總結(jié)：
（1）查找思路（一個對象的尋址過程）：
new的對象自身的proto——函數(shù)原型.proto——原型的原型营罢。
層層向上查找赏陵，最后還沒有就返回undefined

（2）【重點(diǎn)了解】原型鏈的指向：
new對象——類函數(shù)（函數(shù)的原型對象）——function函數(shù)（任何函數(shù)都是由function函數(shù)創(chuàng)建）——object函數(shù)（任何含有{key：value}的基本對象都是object函數(shù)創(chuàng)建）

（3）節(jié)選于若愚老師的方法（真的很有效哦_{反正我是會了}）
幾句話能解釋一切關(guān)于原型方面的問題：

• 當(dāng) new 一個函數(shù)的時候會創(chuàng)建一個對象，『函數(shù).prototype』 === 『被創(chuàng)建對象.proto』
• 一切函數(shù)都是由 Function 這個函數(shù)創(chuàng)建的饲漾，所以『Function.prototype === 被創(chuàng)建的函數(shù).proto』
• 一切函數(shù)的原型對象都是由 Object 這個函數(shù)創(chuàng)建的蝙搔，所以『Object.prototype === 一切函數(shù).prototype.proto』

三、instanceof 對象類型判斷

instanceof操作符考传，專門用來判斷對象吃型，判斷一個對象是不是某個類型的實(shí)例

1 instanceof Number; // false
[1, 2, 3] instanceof Array; //true

可以看到[1, 2, 3]是類型Array的實(shí)例

[1, 2, 3] instanceof Object; //true

這個結(jié)果有些匪夷所思，怎么又是Array的實(shí)例僚楞，又是Object的實(shí)例勤晚，這不是亂套了枉层？其實(shí)這個現(xiàn)象在日常生活中很常見其實(shí)，比如我們有兩種類型：類人猿赐写、動物

我們發(fā)現(xiàn)黑猩猩既是類人猿的物種（實(shí)例）鸟蜡，也是動物類型（實(shí)例）

是不是悟出其中的門道了，類人猿是動物的一種挺邀，也就是說我們的兩個類型之間有一種父子關(guān)系揉忘。這就是傳說中的繼承，JavaScript正是通過原型鏈實(shí)現(xiàn)繼承機(jī)制的

另外：

不是對象的數(shù)據(jù)類型悠夯，可以通過new一個對象進(jìn)行包裝成為一個包裝對象
如b=1癌淮，是無法調(diào)用任何屬性的，因?yàn)?不是對象
那么new Number(1)就將一個數(shù)字包裝成一個對象

四沦补、下面讓我們做幾道原型判斷題

若愚：對原型乳蓄、原型鏈、 Function夕膀、Object 的理解