js原型鏈的理解

2021-08-17 11:10:30 字數 1604 閱讀 9561

其實之前對js原型鏈有個基本的理解,但工作中用到的並不多,逐漸忘記了。所以準備寫個部落格。

我覺得首先得明白乙個,就是每一次建立乙個建構函式(其實就是普通的函式)的時候,都會根據乙個特定的規則建立乙個原型屬性(prototype)。其中包括兩項:construct和__proto__

其次先來看下構造

函式建立物件:

function person()

}var person1 = new person()

var person2 = new person()

new 例項物件是所做的步驟

1:先建立乙個空的物件

2:將建構函式的作用域賦給新創的物件(即 this指向這個新物件)

3:執行建構函式裡面的**(為這個新的物件新增新的屬性)

4:返回新的物件

單純建構函式的弊端:每建立的示例物件都會建立乙個新的例項方法,而建立的例項方法是完成同乙個功能,導致出現冗餘的例項方法

接著就是原型鏈建立物件:

funcion person(){}

person.prototype=}或者

person.prototype.name='yy'

person.prototype.say=function()

var person1 =new person()

var person2 =new person()

1:建立乙個空的的函式

2:對這個函式prototype新增新的物件(修改construct值以及屬性值和方法)construct指向的是建構函式,如果不是不手動賦值預設指向object

3:建立乙個例項時,例項的指標construct指向函式的原型物件(prototype)而不是建構函式

4:返回乙個新物件

單純原型鏈建立物件弊端:多個物件復用同乙個屬性值,多個例項之間對這個屬性值都可能做出修改。

通過isprototypeof()判斷該例項物件與建構函式是否存在關係==>true

通過object.getprototypeof()獲取例項的原型物件

通過例項.hasownproperty('***')檢測乙個屬性***是否屬於例項屬性

通過object.getownpropertydescriptor(例項,'***')獲取例項屬性的描述

通過object.getownpropertynames()獲取所有屬性名包括不可列舉的

組合建構函式和原型鏈建立物件步驟:

1:建立乙個建構函式,

2:給建構函式新增原型(prototype)方法

3:new例項的過程(先建立乙個空的物件=》將建構函式的作用域指向新建立的物件=》執行建構函式裡面的**、例項物件的construct指向建構函式的原型)

4:返回乙個新的物件

優勢:每個例項物件擁有自己的的屬性副本,同時又共享著方法的引用,最大限度的節省了記憶體

1動態原型模式:

在建構函式裡面執行,

if (typeof this.sayname != "function"); }

js 原型 原型鏈理解

執行發現如下 自定義乙個函式,函式包含兩個關鍵資料 prototype,proto 1 原型 prototype person具有prototype屬性 包含我們定義的屬性name,age以及constructor,並且constructor指向我們的person函式,可以理解為prototype就...

js原型鏈理解

關於原型鏈的問題也是領悟了很久,有時候突然覺得什麼都懂了,但下乙個問題出現令人一臉蒙比,好像又什麼都不懂,這是最近的一點經驗,記下來方便以後複習。先貼上最經典的原型煉圖,說實話,這圖是真的很精髓了 首先我們要知道這句話 js中所有的東西 當然都是物件 都有 proto 所有的函式除了有 proto ...

理解js原型和原型鏈

一.普通物件和函式物件 js中,萬物皆物件,大體分為兩種 普通物件,函式物件。凡是通過new function 建立的都是函式物件,其他的則為普通物件。下面舉例說明 function fun1 function var fun2 function function var fun3 new func...