Ejemplo de Javascript Object.assign

los Object.assign() El método copia todas las propiedades propias enumerables de uno o más objetos fuente a un objeto de destino. Devuelve el objeto de destino.

Sintaxis

Object.assign(target,...sources)

Parámetros

target

El objeto de destino: a qué aplicar las propiedades de las fuentes, que se devuelve después de que se modifica.

sources

Objeto (s) de origen: objetos que contienen las propiedades que desea aplicar.

Valor devuelto

El objeto de destino.

Descripción

Las propiedades del objeto de destino se sobrescriben con las propiedades de los orígenes si tienen la misma clave. Las propiedades de las fuentes posteriores sobrescriben a las anteriores.

los Object.assign() método solo copias enumerable y propio propiedades de un objeto de origen a un objeto de destino. Usa [[Get]] en la fuente y [[Set]] en el objetivo, por lo que invocará getters y setters. Por lo tanto asigna propiedades, frente a copiar o definir nuevas propiedades. Esto puede hacer que no sea adecuado para fusionar nuevas propiedades en un prototipo si las fuentes de fusión contienen captadores.

Para copiar definiciones de propiedades (incluida su enumerabilidad) en prototipos, utilice Object.getOwnPropertyDescriptor() y Object.defineProperty() en lugar de.

Ambos String y Symbol se copian las propiedades.

En caso de error, por ejemplo, si una propiedad no se puede escribir, TypeError se levanta, y el target El objeto se cambia si se agregan propiedades antes de que se genere el error.

Nota:Object.assign() no arroja null o undefined fuentes.

Polyfill

Esta polyfill no admite propiedades de símbolo, ya que ES5 no tiene símbolos de todos modos:

if(typeof Object.assign !=='function')// Must be writable: true, enumerable: false, configurable: true
  Object.defineProperty(Object,"assign",value:functionassign(target, varArgs)// .length of function is 2'use strict';if(target ===null,
    writable:true,
    configurable:true);

Ejemplos de

Clonando un objeto

const obj = a:1;const copy = Object.assign(, obj);
console.log(copy);//  a: 1 

Advertencia para Deep Clone

Para la clonación profunda, necesitamos usar alternativas, porque Object.assign() copia valores de propiedad.

Si el valor de origen es una referencia a un objeto, solo copia el valor de referencia.

functiontest()'use strict';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// 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": 0test();

Fusionar objetos

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 , target object itself is changed.

Fusionar objetos con las mismas propiedades

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 

Las propiedades se sobrescriben con otros objetos que tienen las mismas propiedades más adelante en el orden de los parámetros.

Copiar propiedades de tipo símbolo

const o1 = a:1;const o2 =[Symbol('foo')]:2;const obj = Object.assign(, o1, o2);
console.log(obj);//  a : 1, [Symbol("foo")]: 2  (cf. bug 1207182 on Firefox)
Object.getOwnPropertySymbols(obj);// [Symbol(foo)]

Las propiedades de la cadena de prototipos y las propiedades no enumerables no se pueden copiar

const obj = Object.create( foo:1,// foo is on obj's prototype chain.
  bar:
    value:2// bar is a non-enumerable property.,
  baz:
    value:3,
    enumerable:true// baz is an own enumerable property.);const copy = Object.assign(, obj);
console.log(copy);//  baz: 3 

Las primitivas se ajustarán a los objetos.

const v1 ='abc';const v2 =true;const v3 =10;const v4 =Symbol('foo');const obj = Object.assign(, v1,null, v2,undefined, v3, v4);// Primitives will be wrapped, null and undefined will be ignored.// Note, only string wrappers can have own enumerable properties.
console.log(obj);//  "0": "a", "1": "b", "2": "c" 

Las excepciones interrumpirán la tarea de copia en curso

const target = Object.defineProperty(,'foo',
  value:1,
  writable:false);// target.foo is a read-only property

Object.assign(target, bar:2, foo2:3, foo:3, foo3:3, baz:4);// TypeError: "foo" is read-only// The Exception is thrown when assigning target.foo

console.log(target.bar);// 2, the first source was copied successfully.
console.log(target.foo2);// 3, the first property of the second source was copied successfully.
console.log(target.foo);// 1, exception is thrown here.
console.log(target.foo3);// undefined, assign method has finished, foo3 will not be copied.
console.log(target.baz);// undefined, the third source will not be copied either.

Copia de accesos

const obj =
  foo:1,getbar()return2;;let copy = Object.assign(, obj);
console.log(copy);//  foo: 1, bar: 2 // The value of copy.bar is obj.bar's getter's return value.// This is an assign function that copies full descriptorsfunctioncompleteAssign(target,...sources)
  sources.forEach(source=>let descriptors = Object.keys(source).reduce((descriptors, key)=>
      descriptors[key]= Object.getOwnPropertyDescriptor(source, key);return descriptors;,);// By default, Object.assign copies enumerable Symbols, too
    Object.getOwnPropertySymbols(source).forEach(sym=>let descriptor = Object.getOwnPropertyDescriptor(source, sym);if(descriptor.enumerable)
        descriptors[sym]= descriptor;);
    Object.defineProperties(target, descriptors););return target;

copy =completeAssign(, obj);
console.log(copy);//  foo:1, get bar()  return 2  

Especificaciones

Compatibilidad del navegador

Ver también

• Object.defineProperties()
• Enumerabilidad y titularidad de inmuebles
• Difundir en literales de objeto