Object.assignおよびVueでの応用テクニック


最近コードを見ているうちに同僚に教えてもらいました.
Object.assign() Object.assign()メソッドは、列挙可能なすべての属性の値を1つ以上のソースオブジェクトからターゲットオブジェクトにコピーするために使用される.ターゲットオブジェクトが返されます.
//      1 ,          。                         。         [[Get]]      [[Set]],         getter   setter。
Object.assign(target, ...sources)

オブジェクトのコピー
var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }
Object.assign()は浅いコピーであることに注意してください.
オブジェクトのマージ
var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };

var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1);  // { a: 1, b: 2, c: 3 },             。

なお、同じ属性を持つオブジェクトは、同じ名前の属性で、後ろのものが前のものを上書きします.
Vueでの使い方Object.assign()には上記の特性があるため、Vueコンポーネントでは、ある場合、Vueコンポーネントのdataデータをリセットする必要があるという需要がある可能性があります.このとき、現在の状態のdataをthis.$dataで取得し、このコンポーネントの初期状態のdataをthis.$options.data()で取得することができる.そしてObject.assign(this.$data, this.$options.data())を使えば現在の状態のdataを初期状態にリセットできるので便利です!