https://www.jianshu.com/p/9e2a78a35b04
主要的用途是用來合並多個JavaScript的對象。
Object.assign()接口可以接收多個參數，第一個參數是目標對象，后面的都是源對象，assign方法將多個原對象的屬性和方法都合並到了目標對象上面，如果在這個過程中出現同名的屬性（方法），后合並的屬性（方法）會覆蓋之前的同名屬性（方法）。
語法: Object.assign(target, …sources) target: 目標對象,sources: 源對象
用於將所有可枚舉屬性的值從一個或多個源對象復制到目標對象。它將返回目標對象。
一.淺拷貝：復制的只是引用，原對象屬性的改變會引起拷貝對象對應引用屬性的變化。
使用Object.assign()（只能拷貝第一層）
let a = { name:'tom', age:20, friends:{ student:['jack'] } } let b = Object.assign({},a); a.friends.student = ['tony']; console.log(a);// { name: 'tom', age: 20, friends: { student: [ 'tony' ] } } console.log(b);// { name: 'tom', age: 20, friends: { student: [ 'tony' ] } } 二.深拷貝：開辟新的內存空間，原對象與拷貝對象之間沒有影響。
使用JSON.parse()加JSON.stringify()
let obj = { name:'tom', age:10, friend:{ name:'jack' } }; let copy = JSON.parse(JSON.stringify(obj)); obj.name = 'elric'; console.log(obj);// {name: "elric", age: 10, friend: {…}} console.log(copy);// {name: "tom", age: 10, friend: {…}} copy對象的name沒有因為obj的name變化而變化，說明該方法實現了深拷貝。缺陷：無法拷貝函數、undefined
一、Object.assign()對象的拷貝
Object.assign() 方法用於將所有可枚舉屬性的值從一個或多個源對象復制到目標對象。它將返回目標對象。 Object.assign(target, ...sources) 【target：目標對象】，【souce：源對象（可多個）】 舉個栗子： const object1 = { a: 1, b: 2, c: 3 }; const object2 = Object.assign({c: 4, d: 5}, object1); console.log(object2.c, object2.d); console.log(object1) // { a: 1, b: 2, c: 3 } console.log(object2) // { c: 3, d: 5, a: 1, b: 2 } 注意： 1.如果目標對象中的屬性具有相同的鍵，則屬性將被源對象中的屬性覆蓋。后面的源對象的屬性將類似地覆蓋前面的源對象的屬性 2.Object.assign 方法只會拷貝源對象自身的並且可枚舉的屬性到目標對象。該方法使用源對象的[[Get]]和目標 對象的[[Set]]，所以它會調用相關 getter 和 setter。因此，它分配屬性，而不僅僅是復制或定義新的屬性。如 果合並源包含getter，這可能使其不適合將新屬性合並到原型中。為了將屬性定義（包括其可枚舉性）復制到 原型，應使用Object.getOwnPropertyDescriptor()和Object.defineProperty() 。 二、Object.assign()對象的深拷貝
針對深拷貝，需要使用其他辦法，因為 Object.assign()拷貝的是屬性值。 假如源對象的屬性值是一個對象的引用，那么它也只指向那個引用。 let obj1 = { a: 0 , b: { c: 0}}; let obj2 = Object.assign({}, obj1); console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj1.a = 1; console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}} console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} obj2.a = 2; console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}} console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}} obj2.b.c = 3; console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}} console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}} 最后一次賦值的時候，b是值是對象的引用，只要修改任意一個，其他的也會受影響 // Deep Clone （深拷貝） obj1 = { a: 0 , b: { c: 0}}; let obj3 = JSON.parse(JSON.stringify(obj1)); obj1.a = 4; obj1.b.c = 4; console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}} 3、對象的合並
const o1 = { a: 1 }; const o2 = { b: 2 }; const o3 = { c: 3 }; const obj = Object.assign(o1, o2, o3); console.log(obj); // { a: 1, b: 2, c: 3 } console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目標對象自身也會改變。 其實就是對象的拷貝，o1就是目標對象，后面的是源對象，后面的屬性等會拷貝到目標對象 4、合並具有相同屬性的對象
const o1 = { a: 1, b: 1, c: 1 }; const o2 = { b: 2, c: 2 }; const o3 = { c: 3 }; const obj = Object.assign({}, o1, o2, o3); console.log(obj); // { a: 1, b: 2, c: 3 } 1.屬性被后續參數中具有相同屬性的其他對象覆蓋。 2.目標對象的屬性與源對象的屬性相同，源的會覆蓋目標的屬性 5.繼承屬性和不可枚舉屬性是不能拷貝
const obj = Object.create({foo: 1}, { // foo 是個繼承屬性。 bar: { value: 2 // bar 是個不可枚舉屬性。 }, baz: { value: 3, enumerable: true // baz 是個自身可枚舉屬性。 } }); 創建對象時，如果沒有設置enumerable的值，默認為false（不可枚舉屬性），設置為true，則為可枚舉屬性 const copy = Object.assign({}, obj); console.log(copy); // { baz: 3 } 6.原始類型會被包裝為對象
const v1 = "abc"; const v2 = true; const v3 = 10; const v4 = Symbol("foo") const obj = Object.assign({}, v1, null, v2, undefined, v3, v4); // 原始類型會被包裝，null 和 undefined 會被忽略。 // 注意，只有字符串的包裝對象才可能有自身可枚舉屬性。 console.log(obj); // { "0": "a", "1": "b", "2": "c" } 7.異常會打斷后續拷貝任務
const target = Object.defineProperty({}, "foo", { value: 1, writable: false }); // target 的 foo 屬性是個只讀屬性。 Object.assign(target, {bar: 2}, {foo2: 3, foo: 3, foo3: 3}, {baz: 4}); // TypeError: "foo" is read-only // 注意這個異常是在拷貝第二個源對象的第二個屬性時發生的。 console.log(target.bar); // 2，說明第一個源對象拷貝成功了。 console.log(target.foo2); // 3，說明第二個源對象的第一個屬性也拷貝成功了。 console.log(target.foo); // 1，只讀屬性不能被覆蓋，所以第二個源對象的第二個屬性拷貝失敗了。 console.log(target.foo3); // undefined，異常之后 assign 方法就退出了，第三個屬性是不會被拷貝到的。 console.log(target.baz); // undefined，第三個源對象更是不會被拷貝到的。作者：小棋子js
鏈接：https://www.jianshu.com/p/9e2a78a35b04
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。