JavaScript系列 深入之從原型到原型鏈

2021-09-13 17:06:44 字數 2098 閱讀 2892

本文詳情:

建構函式建立物件

先使用建構函式建立乙個物件

function person()

var person = new person();

person.name = "mit";

console.log(person.name)

在這個例子中,person 就是乙個建構函式,我們使用 new 建立了乙個例項物件 person。

prototype

每個函式都有乙個prototype物件

function person() 

// 雖然寫在注釋裡,但是你要注意:

// prototype是函式才會有的屬性

person.prototype.name = 'kevin';

var person1 = new person();

var person2 = new person();

console.log(person1.name) // kevin

console.log(person2.name) // kevin

函式的prototype物件指向該建構函式建立例項的原型

(__proto__)

每個js物件都具有乙個屬性,叫__proto__,這個屬性指向該物件的原型

function person() 

var person = new person();

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

更新如下

constructor

每個原型都有乙個constructor屬性指向關聯的建構函式

例項和原型

當讀取完例項的屬性是,如果找不到,就會查詢與物件關聯的原型中的屬性,如果找不到,就回去原型中去查詢

function person() 

person.prototype.name = 'kevin';

var person = new person();

person.name = 'daisy';

console.log(person.name) // daisy

delete person.name;

console.log(person.name) // kevin

原型的原型在前面,我們已經講了原型也是乙個物件,既然是物件,我們就可以用最原始的方式建立它,那就是:

var obj = new object();

obj.name = 'kevin'

console.log(obj.name) // kevin

其實原型物件就是通過 object 建構函式生成的,結合之前所講,例項的proto指向建構函式的 prototype ,所以我們再更新下關係圖:

原型鏈

那 object.prototype 的原型呢?

null,我們可以列印:

console.log(object.prototype.__proto__ === null) // true
然而 null 究竟代表了什麼呢?

引用阮一峰老師的 《undefined與null的區別》 就是:

null 表示「沒有物件」,即該處不應該有值。

所以 object.prototype.__proto__ 的值為 null 跟 object.prototype 沒有原型,其實表達了乙個意思。

所以查詢屬性的時候查到 object.prototype 就可以停止查詢了。

最後一張關係圖也可以更新為:

深入JavaScript系列(一) 詞法環境

ecmascript規範中對詞法環境的描述如下 詞法環境是用來定義 基於詞法巢狀結構的ecmascript 內的識別符號與變數值和函式值之間的關聯關係 的一種規範型別。乙個詞法環境由環境記錄 environment record 和乙個可能為null的對外部詞法環境的引用 outer 組成。一般來說...

深入JavaScript之call和apply方法

其實只要你認真的研究一下,就會發現我和我哥們一點也不難。有些地方沒有咱倆還真不行。要說咱倆有啥用,我管咱倆的功能叫借過來玩一玩。你看下面的例子啊 let cat sleep function time let dog dog.playball i am a doggy,i love playing ...

JavaScript系列之陣列去重

陣列去重方法是老生常談,特別是一些bat大廠的面試都會提到這個問題,既然是常談,那麼我也來談談 使用迴圈巢狀,最外層迴圈 array,裡面迴圈 res,如果 array i 的值跟 res j 的值相等,就跳出迴圈,如果都不等於,說明元素是唯一的,這時候 j 的值就會等於 res 的長度,根據這個特...