逐個賦值：麻煩，程式碼結構混亂

object.assign()——推薦

MDN關於該方法的介紹：Object.assign() 方法用於將所有可列舉屬性的值從一個或多個源物件複製到目標物件。它將返回目標物件。

用法： Object.assign(target, ...sources)

第一個引數是目標物件，第二個引數是源物件，就是將源物件屬性複製到目標物件，返回目標物件

其中就是將一個物件的屬性copy到另一個物件

vue中：

this.$data 獲取當前狀態下的data

this.$options.data() 獲取該元件初始狀態下的data

所以，下面就可以將初始狀態的data複製到當前狀態的data，實現重置效果：

Object.assign(this.$data, this.$options.data())

當然，如果你只想重置data中的某一個物件或者屬性：

this.form = this.$options.data().form

擴充套件

Object.assign(target, ...sources) 方法還可以用來合併物件：

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 }, 注意目標物件自身也會改變。

如果物件中含有相同屬性，取最後一個屬性：

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 } 屬性取最後一個物件的屬性

搜尋

複製