詳解ES6 中的Object.assign()的用法實(shí)例代碼
方法:Object.assign()
作用:將sourse對(duì)象的 值 賦值給目標(biāo)對(duì)象,兩者都有的會(huì)覆蓋,target獨(dú)有會(huì)保留,sourse獨(dú)有會(huì)添加
使用方法:
Object.assign方法實(shí)行的是淺拷貝,而不是深拷貝。也就是說(shuō),如果源對(duì)象某個(gè)屬性的值是對(duì)象,那么目標(biāo)對(duì)象拷貝得到的是這個(gè)對(duì)象的引用。
var object1 = { a: { b: 1 } };
ar object2 = Object.assign({}, object1);
object1.a.b = 2;
console.log(object2.a.b);
2.用途
2.1為對(duì)象添加屬性
2.2為對(duì)象添加方法
2.3克隆對(duì)象
function copyFnc(origin) {
return Object.assign({}, origin)}
var sur = { a: 1, b: 2 };
console.log(copyFnc(sur));
上面代碼將原始對(duì)象拷貝到一個(gè)空對(duì)象,就得到了原始對(duì)象的克隆。
不過(guò),采用這種方法克隆,只能克隆原始對(duì)象自身的值,不能克隆它繼承的值。如果想要保持繼承鏈,可以采用下面的代碼。
function clone(origin) {
let originProto = Object.getPrototypeOf(origin);
return Object.assign(Object.create(originProto), origin);
}
在JS里子類利用Object.getPrototypeOf去調(diào)用父類方法,用來(lái)獲取對(duì)象的原型。
2.4 合并多個(gè)對(duì)象
//多個(gè)對(duì)象合并到某個(gè)對(duì)象
const merge = (target, ...sources) => Object.assign(target, ...sources);
//多個(gè)對(duì)象合并到新對(duì)象
const merge = (...sources) => Object.assign({}, ...sources);
2.5為屬性指定默認(rèn)值
const DEFAULTS = {
logLevel: 0,
outputFormat: 'html'};
function processContent(options) {let options = Object.assign({}, DEFAULTS, options);
}
到此這篇關(guān)于詳解ES6 Object.assign()的用法及用途的文章就介紹到這了,更多相關(guān)ES6 Object.assign()的用法內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript自定義日期格式化函數(shù)詳細(xì)解析
下面的一個(gè)例子就是以獨(dú)立函數(shù)寫出的JavaScript日期格式化函數(shù),獨(dú)立的format函數(shù)?;氐礁袷交倪@一知識(shí)點(diǎn)上,我們考查的是怎么實(shí)現(xiàn)的、運(yùn)用了哪些原理2014-01-01
javascript實(shí)現(xiàn) 在光標(biāo)處插入指定內(nèi)容
javascript實(shí)現(xiàn) 在光標(biāo)處插入指定內(nèi)容...2007-05-05
xmlplus組件設(shè)計(jì)系列之網(wǎng)格(DataGrid)(10)
xmlplus 是一個(gè)JavaScript框架,用于快速開發(fā)前后端項(xiàng)目。這篇文章主要介紹了xmlplus組件設(shè)計(jì)系列之xmlplus網(wǎng)格,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05
JavaScript eval() 函數(shù)介紹及應(yīng)用示例
eval(String) 函數(shù)可計(jì)算某個(gè)字符串,并執(zhí)行其中的的 JavaScript 代碼,該方法只接受原始字符串作為參數(shù)2014-07-07
bootstrap+jQuery實(shí)現(xiàn)的動(dòng)態(tài)進(jìn)度條功能示例
這篇文章主要介紹了bootstrap+jQuery實(shí)現(xiàn)的動(dòng)態(tài)進(jìn)度條功能,結(jié)合完整實(shí)例形式分析了bootstrap+jQuery實(shí)現(xiàn)動(dòng)態(tài)進(jìn)度條的具體步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-05-05
Selenium執(zhí)行Javascript腳本參數(shù)及返回值過(guò)程詳解
這篇文章主要介紹了Selenium執(zhí)行Javascript腳本參數(shù)及返回值過(guò)程詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-04-04
javascript實(shí)現(xiàn)秒表計(jì)時(shí)器的制作方法
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)秒表計(jì)時(shí)器的制作方法,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02
three.js顯示中文字體與tween應(yīng)用詳析
這篇文章主要給大家介紹了關(guān)于three.js顯示中文字體與tween應(yīng)用的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01

