Object.assign () update object

Object.assign()

Object.assign The () method is used to assign the values of all enumerable properties from one or more source objects to the target object. It will return the target object.
Object.assign Method copies only the enumerable properties of the source object itself to the target object. This method uses [[get]] of the source object and [[set]] of the target object, so it calls the related getters and setters. As a result, it assigns properties, not just copies or defines new ones. If the merge source contains getters, this may make it unsuitable to merge new properties into the prototype.
To copy the attribute definition, including its enumerability, to the prototype, use the Object.getOwnPropertyDescriptor () and Object.defineProperty () 。
Properties of string type and symbol type are copied.

Update Object

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target); // { a: 1, b: 4, c: 5 }

console.log(returnedTarget); // { a: 1, b: 4, c: 5 }

Copy an object

const obj = { a: 1, b: 2, c: 3 };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1, b: 2, c: 3 }

Merge objects

const obj1 = { a: 1 };
const obj2 = { b: 2 };
const obj3 = { c: 3 };

const obj = Object.assign(obj1, obj2, obj3);
console.log(obj1); // { a: 1, b: 2, c: 3 }
console.log (obj); // {A: 1, B: 2, C: 3}, the target object itself will also change.

Copy

Object.assign The copied attributes are limited. Only the source object’s own attributes (not inherited attributes) are copied, and the enumerable attributes (enumerable: false) are not copied.

Object.assign({b: 'c'},
    Object.defineProperty({}, 'invisible', {
        enumerable: false,
        value: 'hello'
    })
)
// { b: 'c' }

The attribute named symbol value is also used Object.assign Copy

Object.assign({ a: 'b', b: 'c'}, { [Symbol('c')]: 'd' })
// { a: 'b', b: 'c', Symbol(c): 'd' }

summary

1. Add attributes to objects

class Point {
    constructor(x, y) {
        Object.assign(this, {x, y});
    }
}

2. Add methods to objects

Object.assign(mainContent.prototype, {
    oneMethod(arg1, arg2) {
    },
    anotherMethod() {
    }
});

It’s equivalent to the following

mainContent.prototype.oneMethod = function (arg1, arg2) {
};
mainContent.prototype.anotherMethod = function () {
};

3. Copy an object

const obj = { a: 1, b: 2, c: 3 };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1, b: 2, c: 3 }

4. Merger object

const obj1 = { a: 1 };
const obj2 = { b: 2 };
const obj3 = { c: 3 };

const obj = Object.assign(obj1, obj2, obj3);
console.log(obj1); // { a: 1, b: 2, c: 3 }
console.log (obj); // {A: 1, B: 2, C: 3}, the target object itself will also change.

5. Specify the default value for the property

const DEFAULTS = {
    logLevel: 0,
    outputFormat: 'html'
};
function processContent(options) {
    let options = Object.assign({}, DEFAULTS, options);
}

MDN

Copy accessor

const obj = {
  foo: 1,
  get bar() {
    return 2;
  }
};

let copy = Object.assign({}, obj); 
console.log (copy); // { foo: 1, bar: 2 }  copy.bar The value of is from obj.bar The return value of the getter function of

//The following function copies all the property descriptors of its own properties
function completeAssign(target, ...sources) {
  sources.forEach(source => {
    let descriptors = Object.keys(source).reduce((descriptors, key) => {
      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
      return descriptors;
    }, {});

    //  Object.assign  Enumerable symbols are also copied by default
    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 } }

Object.assign () update object%E6%9B%B4%E6%96%B0%E5%AF%B9%E8%B1%A1.md)