資訊專(zhuān)欄INFORMATION COLUMN
摘要：所以為了方便查看一個(gè)對(duì)象的原型，和中提供了這個(gè)非標(biāo)準(zhǔn)不是所有瀏覽器都支持的訪(fǎng)問(wèn)器引入了標(biāo)準(zhǔn)對(duì)象原型訪(fǎng)問(wèn)器。在的原型對(duì)象中，還包含一個(gè)屬性，這個(gè)屬性對(duì)應(yīng)創(chuàng)建所有指向該原型的實(shí)例的構(gòu)造函數(shù)。
JS原型？
有句簡(jiǎn)潔直觀(guān)的描述："原型是Javascript中的繼承的基礎(chǔ)，JavaScript的繼承就是基于原型的繼承"。
在JavaScript中，原型也是一個(gè)對(duì)象，通過(guò)原型可以實(shí)現(xiàn)對(duì)象的屬性繼承，JavaScript的對(duì)象中都包含了一個(gè)"[[Prototype]]"內(nèi)部屬性，這個(gè)屬性所對(duì)應(yīng)的就是該對(duì)象的原型。
"[[Prototype]]"作為對(duì)象的內(nèi)部屬性，是不能被直接訪(fǎng)問(wèn)的。所以為了方便查看一個(gè)對(duì)象的原型，F(xiàn)irefox和Chrome中提供了__proto__這個(gè)非標(biāo)準(zhǔn)（不是所有瀏覽器都支持）的訪(fǎng)問(wèn)器（ECMA引入了標(biāo)準(zhǔn)對(duì)象原型訪(fǎng)問(wèn)器"Object.getPrototype(object)"）。在JavaScript的原型對(duì)象中，還包含一個(gè)"constructor"屬性，這個(gè)屬性對(duì)應(yīng)創(chuàng)建所有指向該原型的實(shí)例的構(gòu)造函數(shù)。
提到原型，我們必須要了解下Object和Function：
Object和Function都是JS的自帶函數(shù)，Object繼承自己，F(xiàn)untion繼承自己，Object和Function互相是繼承對(duì)方，也就是說(shuō)Object和Function都既是函數(shù)也是對(duì)象。
//instanceof 就是判斷一個(gè)實(shí)例是否屬于某種類(lèi)型 console.log(Function instanceof Object); // true console.log(Object instanceof Function); // true
前面提到為了方便查看一個(gè)對(duì)象的原型，引入"__proto__",那么Function和Object對(duì)應(yīng)的原型是什么？
console.log(Function.__proto__); // ? () { [native code] }
console.log(Object.__proto__); // ? () { [native code] }
console.log(Function.__proto__==Function.prototype); //true
console.log(Object.__proto__==Function.prototype); //true
所以,Object 是 Function的實(shí)例，而Function是它自己的實(shí)例。
說(shuō)到Function和Object的相互繼承和對(duì)應(yīng)原型，可能覺(jué)得有點(diǎn)頭大，那我們先放一下，讓我們先了解下js對(duì)象的一些小知識(shí)
普通對(duì)象和函數(shù)對(duì)象萬(wàn)物皆對(duì)象,js中對(duì)象其實(shí)分為函數(shù)對(duì)象和普通對(duì)象。
函數(shù)對(duì)象可以創(chuàng)建普通對(duì)象，普通對(duì)象沒(méi)法創(chuàng)建函數(shù)對(duì)象，所以普通對(duì)象權(quán)利最低。
//普通對(duì)象 let str=new String(); let num=new Number(); let obj=new Object(); //....
凡是通過(guò)new Function創(chuàng)建的對(duì)象都是函數(shù)對(duì)象，其他都是普通對(duì)象（通常通過(guò)Object創(chuàng)建），可以通過(guò)typeof來(lái)判斷。
function f1(){}; // == var f1 = new Function();
function f2(a,b){
alert(a+b);
}
//等價(jià)于
var f2 = new Function(a,b,"alert(a+b)");
說(shuō)那么多，其實(shí)記住下面的內(nèi)容就好了：
1.每一個(gè)函數(shù)對(duì)象都有一個(gè)prototype屬性，但是普通對(duì)象是沒(méi)有的；prototype下面又有個(gè)construetor，指向這個(gè)函數(shù)。
2.每個(gè)對(duì)象都有一個(gè)名為_(kāi)proto_的內(nèi)部屬性，指向它所對(duì)應(yīng)的構(gòu)造函數(shù)的原型對(duì)象，原型鏈基于_proto_;
讓我們建一個(gè)普通函數(shù)，可以看到：
var obj = {};
console.log(obj.prototype); //undefined
console.log(obj instanceof Object); //true
console.log(obj.__proto__ === Object.prototype) //true
console.log(Object === Object.prototype.constructor) //true
console.log(Object.prototype.constructor) //function Object()
console.log(Object.prototype.__proto__); //null
obj的確沒(méi)有prototype屬性
obj是Object的實(shí)例
obj的__proto__指向Object的prototype
Object.prototype.constructor指向Object本身
再建一個(gè)函數(shù)對(duì)象：
function Fun(){};
var f1 = new Fun();
console.log(f1.prototype); //undefined
console.log(f1 instanceof Fun); //true
console.log(f1.__proto__ === Fun.prototype); //true
console.log(Fun=== Fun.prototype.constructor) ;//true
console.log(Fun.prototype.__proto__ === Object.prototype) ;//true
console.log(Object.prototype.__proto__); //null
Fun是函數(shù)對(duì)象，f1還是普通對(duì)象
f1是Fun的實(shí)例
Fun的原型prototype的__proto__指向Object的原型prototype,而Object的原型prototyped的__proto__指向null;
原型鏈ECMscript中描述了原型鏈的概念，并將原型鏈作為js實(shí)現(xiàn)繼承的主要方法。
基本思路：利用原型，讓一個(gè)引用類(lèi)繼承另一個(gè)引用類(lèi)的屬性和方法。
構(gòu)造函數(shù)、原型和實(shí)例的關(guān)系：
每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象，原型對(duì)象都包含一個(gè)指向構(gòu)造函數(shù)的指針，而實(shí)例都包含一個(gè)指向原型對(duì)象的內(nèi)部指針。
其實(shí)，avascript中，每個(gè)對(duì)象都會(huì)在內(nèi)部生成一個(gè)proto 屬性，當(dāng)我們?cè)L問(wèn)一個(gè)對(duì)象屬性時(shí)，如果這個(gè)對(duì)象不存在就回去proto 指向的對(duì)象里面找，一層一層找下去，這就是javascript原型鏈的概念。
f1.__proto__ ==> Fun.prototype ==> Fun.prototype.__proto__ ==> Object.prototype ==> Object.prototype.__proto__ ==> null
JS世界中所有的東西都是對(duì)象,所有的東西都由Object衍生而來(lái), 所以所有東西原型鏈的終點(diǎn)指向null
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/109684.html
摘要：雖然在腳本中沒(méi)有標(biāo)準(zhǔn)的方式訪(fǎng)問(wèn)，但在每個(gè)對(duì)象上都支持一個(gè)屬性，用于訪(fǎng)問(wèn)其構(gòu)造函數(shù)的原型對(duì)象。說(shuō)的是構(gòu)造函數(shù)和原型對(duì)象之間的關(guān)系，說(shuō)的是實(shí)例對(duì)象和原型對(duì)象之間的關(guān)系。 前言 在 segmentfault 上看到這樣一道題目： var F = function(){}; Object.prototype.a = function(){}; Function.prototype.b = fu...
摘要：不理解沒(méi)關(guān)系，下面會(huì)結(jié)合圖例分析上一篇高級(jí)程序設(shè)計(jì)筆記創(chuàng)建對(duì)象下一篇高級(jí)程序設(shè)計(jì)筆記繼承參考之原型鏈的解讀三張圖搞懂的原型對(duì)象與原型鏈繼承與原型鏈 文章直接從原型圖解開(kāi)始的，如果對(duì)一些概念不太清除，可以結(jié)合后面幾節(jié)查看 1. 圖解原型鏈 1.1 鐵三角關(guān)系（重點(diǎn)） function Person() {}; var p = new Person(); showImg(https://s...
摘要：上一篇你不知道的筆記寫(xiě)在前面這是年第一篇博客，回顧去年年初列的學(xué)習(xí)清單，發(fā)現(xiàn)僅有部分完成了。當(dāng)然，這并不影響年是向上的一年在新的城市穩(wěn)定連續(xù)堅(jiān)持健身三個(gè)月早睡早起游戲時(shí)間大大縮減，學(xué)會(huì)生活。 上一篇：《你不知道的javascript》筆記_this 寫(xiě)在前面 這是2019年第一篇博客，回顧去年年初列的學(xué)習(xí)清單，發(fā)現(xiàn)僅有部分完成了。當(dāng)然，這并不影響2018年是向上的一年：在新的城市穩(wěn)定、...
摘要：原型相同對(duì)象的共有屬性也稱(chēng)作原型原型鏈中所有的對(duì)象都是由它的原型對(duì)象繼承而來(lái)。說(shuō)的直白點(diǎn)就是，所有原型鏈的屬性，最終都指向的是對(duì)象的而對(duì)象的指向的是。 原 型：相同對(duì)象的共有屬性也稱(chēng)作原型 原型鏈：中所有的對(duì)象都是由它的原型對(duì)象繼承而來(lái)。而原型對(duì)象自身也是一個(gè)對(duì)象，它也有自己的原型對(duì)象，這樣層層上溯，就形成了一個(gè)類(lèi)似鏈表的結(jié)構(gòu)，這就是原型鏈showImg(https://segm...
摘要：繼承原型鏈如果構(gòu)造函數(shù)或?qū)ο蟮脑椭赶驑?gòu)造函數(shù)或?qū)ο螅脑驮僦赶驑?gòu)造函數(shù)或?qū)ο?，以此?lèi)推，最終的構(gòu)造函數(shù)或?qū)ο蟮脑椭赶虻脑汀? 繼承 原型鏈 如果構(gòu)造函數(shù)或?qū)ο驛的原型指向構(gòu)造函數(shù)或?qū)ο驜，B的原型再指向構(gòu)造函數(shù)或?qū)ο驝，以此類(lèi)推，最終的構(gòu)造函數(shù)或?qū)ο蟮脑椭赶騉bject的原型。由此形成了一條鏈狀結(jié)構(gòu)，被稱(chēng)之為原型鏈。按照上述的描述，在B中定義的屬性或方法，可以在A中使用并不需要...
閱讀 1594·2021-11-24 11:16
閱讀 2862·2021-07-28 12:32
閱讀 2395·2019-08-30 11:22
閱讀 1501·2019-08-30 11:01
閱讀 676·2019-08-29 16:24
閱讀 3623·2019-08-29 12:52
閱讀 1696·2019-08-29 12:15
閱讀 1400·2019-08-29 11:18
