溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

js中的Object.create方法怎么使用

發(fā)布時間:2022-11-28 09:08:15 來源:億速云 閱讀:117 作者:iii 欄目:web開發(fā)

這篇文章主要介紹“js中的Object.create方法怎么使用”的相關(guān)知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強(qiáng),希望這篇“js中的Object.create方法怎么使用”文章能幫助大家解決問題。

ECMAScript 5 新增了 Object.create() 方法將原型式繼承的概念規(guī)范化

用法

var obj = Object.create({name: 'johan', age: 23}) // obj 繼承了屬性name 和 age
var obj2 = Object.create(null) // obj2 不繼承任何屬性和方法
var obj3 = Object.create(Object.prototype) // 與 {} 和 new Object() 一個意思
var obj4 = Object.create({}, {
    property1: {
        value: true,
        writable: true
    }
}) // 第二個參數(shù)與 Object.defineProperties() 一致
圖解 Object.create 實現(xiàn)
function create(proto) {
    function F(){}
    F.prototype = proto
    return new F()
}

第一步: function F(){}

即創(chuàng)建一個函數(shù),因為約定首字母大寫,視為構(gòu)造函數(shù),創(chuàng)建函數(shù) F 時,F(xiàn) 構(gòu)造函數(shù)與和它的原型對象就有了這一層的關(guān)系:

F.prototype === F.prototype; // 假設(shè)你把F.prototype當(dāng)作一個值
F.prototype.constructor === F;

js中的Object.create方法怎么使用

第二步:F.prototype = proto

即將 F.prototype 賦值為傳入的 proto,如此就打破了F.prototype = F.prototype 以及 F.prototype.constructor = F ,它們的關(guān)系為

js中的Object.create方法怎么使用

第三步:return new F()

第三步的解讀有點費解,因為這里涉及到 new 的操作,在 new 改變了對象 中我們說過,new 會創(chuàng)建一個對象,并將這個對象的隱式原型(__proto__) 指向構(gòu)造函數(shù)的原型對象,并初始化構(gòu)造函數(shù),如果值則返回值。我們也會在后續(xù)的原型中介紹,new 是隱式原型繼承,Object.create 是顯式原型繼承

在這里,我們按實現(xiàn) new 的方式來解讀 return new F()。new F 后的實例的 __proto__ 指向的是 F.prototype,而這個值已經(jīng)在第二步時指給了傳來的 proto,所以就有了new F().__proto__ = proto

js中的Object.create方法怎么使用

或許你還是不太清楚第三步,我們結(jié)合例子,就一目了然了

var obj = Object.create({name: 'johan'})

第三步的圖解就成了這樣:

js中的Object.create方法怎么使用

這樣就成了, obj 繼承自{name: johan} 這個對象,至于F.prototype = {name: 'johan'},在調(diào)用完 Object.create 之后,也因為沒人使用 F 函數(shù)而被引擎當(dāng)作垃圾回收了,遂成了obj.__proto__ = {name: 'johan'}

如此「原型式繼承」就被傳承下來了

其原理就是如此,簡單來說,就是創(chuàng)建空(構(gòu)造)函數(shù),關(guān)聯(lián)它的原型(實現(xiàn)繼承)

Object.create(null)

在閱讀源碼時,常會看到 Object.create(null) ,用此初始化一個新對象,至于為什么用這個方法而不用 new Object 或者 {},是因為無論 new 還是字面量,都是繼承自 Object 構(gòu)造函數(shù),而使用Object.create(null) ,能得到一個沒有任何繼承痕跡的對象

var obj = Object.create(null)

關(guān)于“js中的Object.create方法怎么使用”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識,可以關(guān)注億速云行業(yè)資訊頻道,小編每天都會為大家更新不同的知識點。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI