您好,登錄后才能下訂單哦!
譯者按: 這篇博客將介紹ES6新增的Object.assign()方法。
為了保證可讀性,本文采用意譯而非直譯。另外,本文版權(quán)歸原作者所有,翻譯僅用于學習。
將A對象的屬性復制給B對象,這是JavaScript編程中很常見的操作。這篇博客將介紹ES6的Object.assign()屬性,可以用于對象復制。
在JavaScript生態(tài)系統(tǒng)中,對象復制有另外一個術(shù)語: extend。下面是兩個JS庫提供的extend接口:
ES6提供了Object.assign(),用于合并/復制對象的屬性。
Object.assign(target, source_1, ..., source_n)
它會修改target對象,然后將它返回:先將source_1對象的所有可枚舉屬性復制給target,然后依次復制source_1等的屬性。
在ES6中,對象的屬性名可以是字符串或者Symbol。因為Symbol值具有唯一性,這就意味著Symbol作為對象的屬性名時,可以保證不會出現(xiàn)同名的屬性。對象屬性名為字符串或者Symbol時,Object.assign()都支持。
target對象的屬性是通過復制來創(chuàng)建的,這就意味著,如果target有setters方法時,它們將會被調(diào)用。
另一種方案是通過定義來實現(xiàn),這樣將會創(chuàng)建新的自有屬性,不會調(diào)用setters方法。其實,另一個版本的Object.assign()的提案正是采用這種方法。不過,這個提議在ES6中被拒絕了,也許之后的版本會再考慮。
構(gòu)造器正是為了初始化對象的屬性,通常,我們不得不多次重復屬性的名字。示例代碼的constructor中,x與y均重復了兩次:
class Point
{
constructor(x, y)
{
this.x = x;
this.y = y;
}
}
如果可以的話,個人偏愛將所有冗余都省去。(事實上,CoffeeScript與TypeScript都有語法解決構(gòu)造器中屬性名重復的問題。):
class Point
{
constructor(this.x, this.y){}
}
至少,Object.assign()可以幫助我們減少一些重復:
class Point
{
constructor(x, y)
{
Object.assign(this, { x, y });
}
}
在ES6中, { x, y }
為{ x: x, y: y }
的縮寫。
ECMAScript 5, you use a function expression to add a method to an object:
在ES5中,需要使用function關(guān)鍵字定義對象的新增方法:
MyClass.prototype.foo = function(arg1, arg2)
{
//...
};
在ES6中,對象方法的定義更加簡潔,不需要使用function關(guān)鍵字。這時,可以使用Object.assign()為對象新增方法:
Object.assign(MyClass.prototype,
{
foo(arg1, arg2)
{
//...
}
});
使用Object.assign()深度復制對象,包括其prototype
var Point = function(x)
{
this.x = x;
}
Point.prototype.y = 2;
var obj = new Point(1);
var copy = Object.assign({ __proto__: obj.__proto__ }, obj); // 輸出{x:1,y:2}
console.log(copy) // 輸出{x:1,y:2}
僅復制自身屬性:
var Point = function(x)
{
this.x = x;
}
Point.prototype.y = 2;
var obj = new Point(1);
var copy = Object.assign({}, obj);
console.log(copy) // 輸出{x:1}
Fundebug專注于JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實時BUG監(jiān)控。 自從2016年雙十一正式上線,F(xiàn)undebug累計處理了7億+錯誤事件,得到了Google、360、金山軟件、百姓網(wǎng)等眾多知名用戶的認可。歡迎免費試用!
轉(zhuǎn)載時請注明作者Fundebug以及本文地址:
https://blog.fundebug.com/2017/09/11/object-assign/
免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。