原型鏈 原型

2022-08-17 23:54:13 字數 2967 閱讀 9951

通過function建立的物件就是函式,函式都是通過function建立的

我們會有乙個疑問function是從**來的?其實function是不通過其他函式得到,它是js執行引擎初始化就直接通過本地**直接放置到記憶體中的。

當乙個函式被建立後,這個函式就會自動附帶乙個屬性prototype,它就是乙個object物件,代表著函式的原型。也就是說prototype就是原型物件

原型物件中包含兩個屬性:constructor__proto__

constructor這個屬性是指建立原型的函式,它指向函式本身。所以有以下關係:

所有的物件都包含乙個屬性__proto__,它指向建立該物件的建構函式的原型。看下面這張圖理清它們之間的關係:

注意:函式才有prototype,例項物件只有__proto__

我們來檢驗一下自己是否理解了他們之間的關係,看以下**:

function

person() {};

const obj1 = new

person();

const obj2 = new

person();

//兩個物件的位址不同

console.log(obj1 === obj2); //

false

//原型只有函式才有,obj1是普通物件,沒有原型

console.log(obj1.prototype); //

undefined

//obj1和obj2都是通過person函式建立的,它們的隱式原型都指向person函式的原型

console.log(obj1.__proto__ === obj2.__proto__); //

true

//obj1是通過person函式建立的,它的隱式原型指向person函式的原型

console.log(obj1.__proto__ === person.prototype); //

true

所以,由同乙個函式產生的物件,它們的隱式原型,都指向函式的原型。那麼函式原型中儲存的東西,就可以被所有物件共享了!

既然所有的物件都有隱式原型(__proto__),那函式也是物件,原型也是物件,它們也具有隱式原型。我們知道隱式原型指向建立該物件的建構函式的原型。而函式是有function建立的,所以函式的隱式原型應該指向function的原型

console.log(object.__proto__ === function.prototype); //

true

原型是通過object建立的,所以原型物件的隱式原型指向的是object的原型

console.log(function.prototype.__proto__ === object.prototype); //

true

那麼我們又會遇到新的疑問:

function也是物件,它的隱式原型指向誰呢?

object的原型也是物件,它的隱式原型指向誰呢?

我們始終要記得:物件的隱式原型,始終指向建立它的建構函式的原型。

但是function是js引擎直接放置到記憶體的,不通過建構函式產生;object的原型是靠object函式建立的。js對它們進行了特殊的處理:function的隱式原型指向自身原型。object的隱式原型指向null。

給出整個原型圖:

理解完上面這些讓我們來看原型鏈

當我們寫了乙個建構函式,比如person,然後用這個建構函式建立乙個物件new person(),建立的這個物件會自動的擁有一些自身並不存在的方法。看下面這個例子:

function person(){}

const p = new person();

console.log(p.tostring()); //輸出:[object object]

從圖中,我們可以清晰的看到,箭頭(隱式原型指向)將物件p、person的原型、object的原型串成了一根鏈條。我們在物件p中使用的tostring方法,實際上是object原型中的tostring方法。

以上我們都可以得知:

任何乙個例項物件通過原型鏈可以找到它對應的原型物件,原型物件上面的例項和方法都是例項所共享的。

當js查詢乙個物件的成員時,先查詢自身是否擁有該成員,若沒有,則在它隱式原型形成的鏈條中查詢該成員,查詢到了則停止,否則繼續查詢,直到鏈條的終點——null。若都查詢不到,返回undefined。

看下面這個例子:

function

person()

}person.prototype.tostring = function

() const p = new

person();

console.log(p.tostring());

//輸出:這是物件自身的tostring

在這個例子中,給物件p和它的隱式原型(也就是建立p的建構函式的原型)上,都加入了tostring方法,js查詢到了p自身包含tostring,就會立即停止查詢,使用它自身的tostring方法。始終記得:查詢物件成員時,js會在鏈條上依次進行查詢!

原型 原型鏈

var animal function var dog function animal.price 2000 dog.prototype animal var tidy new dog console.log dog.price 為什麼輸出 undefined console.log tidy.pr...

原型,原型鏈

原型object.hasownproperty proname object 乙個物件的例項 propname 乙個屬性名稱的字串值 返回乙個布林值原型鏈中的this 原型物件 原型物件的作用 一般情況下,會把方法宣告在原型物件裡。目的是實現繼承。當物件訪問自身屬性或方法時,先從自身找有沒有,如果有...

原型 原型鏈

在最近的原型和原型鏈的學習中,感覺壓力有點大,學習難度也比較大,但又很基礎很重要,我們在學習中得要下很大的功夫才行。無論什麼時候,只要建立了乙個新的函式,就會根據一組特定的規則為這個函式建立乙個prototype的屬性,prototype這個屬性指向函式的原型物件,然後所有的的原型物件都會有乙個co...