ES6 的 Object.assign() 使用實(shí)例詳解
一、Object.assign()作用
Object.assign()
是 ECMAScript 6 引入的方法,用于將源對象(source)的所有可枚舉屬性復(fù)制到目標(biāo)對象(target)。它會(huì)返回目標(biāo)對象,同時(shí)修改目標(biāo)對象。
二、基本語法
Object.assign(target, ...sources)
target
:必須,目標(biāo)對象,將接收來源對象的屬性。sources
:零個(gè)或多個(gè)源對象,它們的可枚舉屬性將被復(fù)制到目標(biāo)對象。
三、示例代碼
// 創(chuàng)建源對象 let source1 = { a: 1, b: 2 }; let source2 = { c: 3, d: 4 }; // 創(chuàng)建目標(biāo)對象 let target = { e: 5 }; // 使用Object.assign復(fù)制屬性 Object.assign(target, source1, source2); console.log(target); // 輸出: { a: 1, b: 2, c: 3, d: 4, e: 5 }
四、應(yīng)用場景
合并多個(gè)對象:當(dāng)你希望將多個(gè)對象的屬性合并到一個(gè)新對象或現(xiàn)有對象中時(shí)。
let objA = { a: 1, b: 2 }; let objB = { b: 3, c: 4 }; let mergedObj = Object.assign({}, objA, objB); console.log(mergedObj); // 輸出: { a: 1, b: 3, c: 4 }
擴(kuò)展原型鏈:用于向類的原型添加方法或?qū)傩浴?/p>
class MyClass {} Object.assign(MyClass.prototype, { method1() { /* ... */ }, method2() { /* ... */ }, }); new MyClass().method1(); // 此時(shí)MyClass實(shí)例可以調(diào)用method1()
淺拷貝:Object.assign可以用來實(shí)現(xiàn)淺拷貝,但它只復(fù)制對象的第一層屬性,如果源對象的屬性值是對象,只會(huì)復(fù)制對象的引用,不會(huì)深拷貝。
let obj = { a: { b: 1 } }; let copy = Object.assign({}, obj); obj.a.b = 2; console.log(copy.a.b); // 輸出: 2,因?yàn)閍屬性指向同一個(gè)引用
五、注意事項(xiàng)
- 如果有相同屬性名,后面的源對象的屬性會(huì)覆蓋前面源對象的屬性。
- Object.assign不會(huì)遍歷源對象的原型鏈,只會(huì)復(fù)制自身可枚舉屬性。
- 對于null或undefined作為源對象的情況,會(huì)被忽略。
- 如果目標(biāo)對象上有不可寫屬性,且源對象上也有同名屬性,該屬性無法被賦值。
到此這篇關(guān)于ES6 的 Object.assign() 使用實(shí)例詳解的文章就介紹到這了,更多相關(guān)ES6 Object.assign() 使用內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
PHP利用熊掌號提交api向熊掌號批量提交網(wǎng)站url
熊掌號提交網(wǎng)站URL分為兩種api提交和手動(dòng)提交,我們主要講解用PHP通過熊掌號API批量提交網(wǎng)站URL2018-10-10關(guān)于網(wǎng)站如何賺錢方法之廣告-寫給新站長
關(guān)于網(wǎng)站如何賺錢方法之廣告-寫給新站長...2007-02-02