Maison  >  Article  >  interface Web  >  Comment utiliser objet.assign()

Comment utiliser objet.assign()

青灯夜游
青灯夜游original
2023-01-06 16:34:505346parcourir

La méthode

object.assign() est utilisée pour attribuer les valeurs de toutes les propriétés énumérables d'un ou plusieurs objets source (sources) à l'objet cible (target), et renvoyer la syntaxe de l'objet cible "Object.assign( target, ..sources)", le paramètre "target" fait référence à l'objet cible, qui est l'objet qui reçoit les propriétés de l'objet source, et est également la valeur de retour modifiée. Le paramètre "sources" fait référence à la source. objet, qui contient les propriétés qui seront fusionnées.

Comment utiliser objet.assign()

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Object.assign() Utilisation

Cette méthode est utilisée pour attribuer les valeurs de toutes les propriétés énumérables d'un ou plusieurs objets source (sources) à l'objet cible (cible), et renvoyer l'objet cible .

Object.assign(target, ...sources)

target : Objet cible, l'objet qui reçoit les propriétés de l'objet source, et est également la valeur de retour modifiée.

sources : objet source, contenant les propriétés qui seront fusionnées.

1. Copie de l'objet

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)

Remarque :
1. Si les propriétés de l'objet source sont différentes de celles de l'objet cible, elles seront copiées dans l'objet cible ; l'objet cible et l'objet source ont les mêmes propriétés Attributs, les valeurs d'attribut de l'objet cible seront écrasées par les valeurs d'attribut de l'objet source
3. S'il existe plusieurs objets source avec les mêmes attributs, alors les attributs de l'objet cible seront écrasés par les attributs du dernier objet source.

2. Les propriétés héritées et les propriétés non énumérables ne peuvent pas être copiées

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,则为可枚举属性

Remarque : La méthode Object.assign copiera uniquement les propriétés propres et énumérables de l'objet source dans l'objet cible, héritées et non énumérables. propriétés Les attributs mentionnés ne sont pas copiés.

3. Copie profonde de l'objet

La copie Object.assign() est une copie superficielle. Elle copie la valeur de l'attribut de l'objet source, alors celle-ci est copiée. Le pointeur de la valeur de l'objet (c'est-à-dire l'adresse) ; si la valeur de obj est modifiée à ce moment, l'objet cible sera affecté.

Pour éviter cet effet, nous devons faire une copie complète de l'objet :

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 的值。

Remarque : la copie profonde ne peut résoudre que la copie de valeur du type référence, et l'héritage et les propriétés non énumérables ne peuvent toujours pas être copiées.

4. L'exception mettra fin à la copie

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. Le type original sera compressé dans un objet

Le type original sera compressé, null et indéfini seront ignorés .

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'}

Remarque : seul l'objet wrapper d'une chaîne peut avoir ses propres propriétés énumérables.

【Apprentissage recommandé :

Tutoriel vidéo javascript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn