object.assign() の使用方法

object.assign() メソッドは、1 つ以上のソース オブジェクト (source) からターゲット オブジェクト (target) にすべての列挙可能なプロパティの値を割り当て、ターゲット オブジェクトを返すために使用されます。構文 " Object.assign (target, ...sources)" の場合、パラメーター "target" はターゲット オブジェクトを参照します。これは、ソース オブジェクトのプロパティを受け取るオブジェクトであり、変更された戻り値でもあります。パラメーター "sources"マージされるプロパティを含むソース オブジェクトを参照します。

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

Object.assign() の使用法

このメソッドは、1 つ以上のソースからすべての列挙可能なプロパティの値を割り当てるために使用されます。オブジェクト (ソース) はターゲット オブジェクト (ターゲット) に割り当てられ、ターゲット オブジェクトを返します。

Object.assign(target, ...sources)

target: ターゲット オブジェクト。ソース オブジェクトのプロパティを受け取るオブジェクトであり、変更された戻り値でもあります。

sources: マージするプロパティを含むソース オブジェクト。

#1. オブジェクトのコピー

const target = { a: 1, b: 2 };
const source1 = { b: 4, c: 5 };
const source2 = { b: 6, c: 7 };
const obj = Object.assign(target,source1,source2);
console.log(obj); // (a: 1, b: 6, c: 7)

Note:

1. ソース オブジェクトの属性とターゲット オブジェクトの属性異なる場合はターゲット オブジェクトにコピーされます;
2. ターゲット オブジェクトとソース オブジェクトが同じ属性を持つ場合、ターゲット オブジェクトの属性値は属性値で上書きされますソース オブジェクトのプロパティ;
3. 複数のソース オブジェクトがある場合 2 つのソース オブジェクトが同じプロパティを持つ場合、ターゲット オブジェクトのプロパティは最後のソース オブジェクトのプロパティによって上書きされます。

2. 継承されたプロパティと列挙不可能なプロパティはコピーできません

const obj1 = Object.create({foo: 1}, { // foo 是个继承属性。
    bar: {
        value: 2  // bar 是个不可枚举属性。
    },
    baz: {
        value: 3,
        enumerable: true  // baz 是个自身可枚举属性。
    }
});
const obj= Object.assign({}, obj1);
console.log(obj); // { baz: 3 }
//创建对象时，如果没有设置enumerable的值，默认为false（不可枚举属性），设置为true，则为可枚举属性

注: Object.assign メソッドソース オブジェクト自身の列挙可能なプロパティをターゲット オブジェクトにコピーするだけです。継承されたプロパティや列挙不可能なプロパティはコピーされません。

3. オブジェクトの深いコピー

Object.assign() コピーは浅いコピーであり、コピーされます。属性値、ソース オブジェクトの属性値がオブジェクト obj の場合、オブジェクト値のポインタ (つまりアドレス) がコピーされ、このとき、obj の値が変更されると、ターゲット オブジェクトは影響を受ける。

この影響を回避するには、オブジェクトのディープ コピーを作成する必要があります。

let obj1 = { a: 1, b: {c: 2 }};
let obj2 = { d: 2 };
let obj = Object.assign(obj2,JSON.parse(JSON.stringify(obj1)));
console.log(obj); // { d: 2, a:1, b:{ c:2 }}
obj1.b.c = 4;
console.log(obj); // { d: 2, a:1, b:{ c:2 }}
// 对象obj1.b.c 值的变化则不会再影响到目标对象 obj 的值。

注: ディープ コピーは参照型の値のコピーのみを解決でき、継承および列挙不可能なプロパティはまだ解決できません。コピーされました。

4. 異常によりコピーが終了します

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，第三个源对象更是不会被拷贝到的。

##5の場合、元の型はオブジェクトにラップされます。 元の型はラップされ、null と未定義は無視されます。

const obj1 = 'aaa';
const obj2 = false;
const obj3 = true;
const obj4 = 10;
const obj= Object.assign(obj1,obj2,obj3,obj4);
console.log(obj); // { 0:'a', 1:'a', 2:'a'}

注: 文字列のラッピング オブジェクトのみが独自の列挙可能なプロパティを持つことができます。

[推奨学習:

JavaScript ビデオ チュートリアル

]

以上がobject.assign() の使用方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。