Object.assign()

将所有可枚举属性的值从一个或多个源对象复制到目标对象，并返回目标对象。

  1. Object.assign(target, ...sources)

不会跳过值为null或undefined 的源对象。

深拷贝问题

Object.assign() 拷贝的是属性值，如果源对象的属性值是一个对象的应用，它就会指向那个引用。【浅拷贝】

  1. let obj1 = {a: 0, b: { c: 0 }}
  2. let obj2 = Object.assign({}, obj1)
  3. let obj3 = JSON.parse(JSON.stringify(obj1))  // 可做深拷贝
  4. obj1.a = 4;
  5. obj1.b.c = 4;
  6. console.log(obj1) // {a: 4, b: {c: 4}}
  7. console.log(obj2) // {a: 0, b: {c: 4}}
  8. console.log(obj3) // {a: 0, b: {c: 0}}

合并对象

  1. let o1 = { a: 1 , b: 1, c: 1}
  2. let o2 = { b：2, c: 2 }
  3. let o3 = { c: 3 }
  4. const obj = Object.assign(o1, o2, o3);
  5. console.log(obj) // {a: 1, b: 2, c: 3 }
  6. console.log(o1)  // {a: 1, b: 2, c: 3 }

目标对象会改变， 相同属性会被后面的属性覆盖。

拷贝 symbol 类型的属性

  1. const o1 = {a: 1}
  2. const o2 = {[Symbol('foo')]: 2}
  3. const obj = Object.assign(o1, o2)
  4. console.log(obj) // {a: 1, [Symbol('foo')]: 2}
  5. Object.getOwnPropertySymbols(obj) // [Symbol(foo)]

继承属性和不可枚举属性是不能拷贝的

  1. const obj = Object.crate({foo: 1}, {
  2.     bar: {
  3.       value: 2  // 不可枚举属性
  4.   },
  5.   baz: {
  6.       value: 3,
  7.     enumerable: true  // 可枚举属性
  8.   }
  9. })
  10. const copy = Object.assign({}, obj)
  11. console.log(copy) // {baz: 3}

原始类型会被包装为对象

  1. const v1 = "abc"
  2. const v2 = true
  3. const v3 = 10
  4. const v4 = Symbol('foo')
  6. const obj = Object.assign({}, v1, null, v2, undefined, v3, v4)
  7. conosle.log(obj) // { "0": "a", "1": "b", "2": "c" }

原始类型会被包装， null 和 undefined 会被忽略。
注意： 只有字符串的包装对象才可能有自身可枚举属性。

拷贝访问器

  1. const obj = {
  2.     foo: 1,
  3.   get bar() {
  4.       return 2
  5.   }
  6. }
  7. let copy = Object.assign({}, obj)
  8. console.log(copy) // {foo: 1, bar: 2}
  11. // 拷贝所有自身属性的属性描述符
  12. function completeAssign(target, ...sources) {
  13.     sources.forEach(source => {
  14.         let descriptors = Object.keys(source).reduce((descriptors, key) => {
  15.             descriptors[key] = Object.getOwnPropertyDescriptor(source, key)
  16.             return descriptors
  17.         }, {})
  19.         // Object.assign 默认也会拷贝可枚举属性
  20.         Object.getOwnPropertySymbols(source).forEach(sym => {
  21.             let descriptor = Object.getOwnPropertyDescriptor(source, sym)
  22.             if (descriptor.enumerable) {
  23.                 descriptors[sym] = descriptor
  24.             }
  25.         })
  26.         Object.defineProperties(target, descriptors);
  27.     })
  28.     return target;
  29. }
  30. let deepCopy = completeAssign({}, obj) // { foo: 1, get bar() { return 2 }}

Object.create()

  1. Object.create(proto, [propertiesObject])

proto 新创建对象的原型对象。
propertiesObject 要添加到新创建对象的可枚举属性对象的属性描述符以及相应的属性名称。

  1. const person = {
  2.     isHuman: false,
  3.   printIntroduction: function() {
  4.       console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`)
  5.   }
  6. }
  7. const me = Object.create(person)
  8. me.name = "Matthew"
  9. me.isHuman = true
  11. my.printIntroduction(); 
  12. "My name is Matthew. Am I Human? true"
  1. let o = Object.create(null) // {}
  3. let o2 = Object.create(Object.prototype) // {}
  5. let o3 = Object.create(Object.prototype, {
  6.     foo: {
  7.         writable: true,
  8.         configurable: true,
  9.         value: 'hello'
  10.     },
  11.     bar: {
  12.         configurable: false,
  13.         get: function() { return 10 },
  14.         set: function(val) {
  15.             console.log('setting `o.bar` to', value)
  16.         }
  18.     }
  20. })
  21. //  o3 = {
  22.     bar: 10,
  23.     foo: "hello",
  24.     get bar: ƒ (),
  25.     set bar: ƒ (val)
  26. }

Object.defineProperties()

直接在一个对象上定义新的属性或修改现有属性，并返回该对对象。

  1.         /***
  2.      * Object.defineProperties(obj, props)
  3.      *
  4.      * props => 属性+属性描述符
  5.      * value => undefined; 属性值
  6.      * configurable => false; 可配置【删除，修改】
  7.      * enumerable => false; 可枚举
  8.      * writable => false; 可写性
  9.      * get => undefined; 函数返回值将被用作属性值
  10.      * set => undefined; 将参数值作为该属性的新值
  11.      */
  13.      let obj = {};
  14.     Object.defineProperties(obj, {
  15.         'name': {
  16.             value: '张三',
  17.             writable: false,
  18.         },
  19.         'age': {
  20.             value: 20,
  21.             writable: true,
  22.         },
  23.         'love': {
  24.             value: 'football',
  25.             configurable: fale,
  26.         }
  27.     });
  28.     obj.name = '张无忌';
  29.     obj.age = 18;
  30.     delete obj.love;
  31.     console.log(obj)

Object.definePropery()

直接在一个对象上定义一个新的属性，或修改一个对象的现有属性，并返回这个对象。

  1. /***
  2. * Object.defineProperty(obj, prop, descriptor)
  3. *
  4. * prop 要定义或修改的属性
  5. * descriptor 属性描述符
  6. * return 被传递给函数的对象
  7. */
  9. let o = {};
  10. o.a = 1;
  11. // 等同于
  12. Object.difineProperty(o, 'a', {
  13.     value: 1,
  14.   writeable: true,
  15.   configurable: true,
  16.   enumerable: true,
  17. });
  19. Object.defineProperty(o, "name", {value: 1});
  20. // 等同于
  21. Object.defineProperty(o, 'name', {
  22.     value: 1,
  23.   writable: false,
  24.   configurable: false,
  25.   enumerable: false,
  26. })

Object.freeze()

冻结一个对象，冻结对象不能修改、添加、删除，也不饿能改变该对象的可枚举性，可配置性，可写。

  1. // 冻结对象
  2. let obj = {prop: 42};
  3. Object.freeze(obj);
  4. obj.prop = 33;
  5. delete obj.prop;
  6. console.log(obj.prop);
  8. // 冻结数组
  9. let arr = [1, 2];
  10. Object.freeze(arr);
  12. arr[0] = 11;
  13. // arr.push(33);
  14. console.log(arr);
  16. // 深冻结
  17.     function deepFreeze(obj) {
  19.         let propNames = Object.getOwnPropertyNames(obj);
  21.         // 冻结自身前冻结属性
  22.         propNames.forEach((name) => {
  23.             let prop = obj[name];
  24.             // 如果是一个对象，冻结它
  25.             if (typeof prop=='object' & prop!=null) {
  26.                 deepFreeze(prop);
  27.             }
  28.         });
  30.         return Object.freeze(obj);
  31.     }
  33.     let obj2 = {
  34.         internal: {
  35.             a: 'hello'
  36.         }
  37.     };
  39.     deepFreeze(obj2);
  40.     obj2.internal.a = 'anotherValue';
  41.     console.log(obj2.internal.a);

Object.seal()

封闭一个对象，阻止添加新属性并把所有现有对象标记为不可配置。但只要当前属性时可写的就可以改变。

  1.         let obj = {
  2.         prop: function() {},
  3.         foo: 'bar',
  4.     };
  6.     obj.foo = 'baz';
  7.     obj.lumpy = 'woof';
  8.     delete obj.prop;
  10.     let o = Object.seal(obj);
  11.     console.log(o === obj); // true
  12.     console.log(Object.isSealed(obj)); // true

Object.keys()

返回对象自身可枚举属性组成的数组，属性名属性与for…in 循环遍历的顺序一致。

  1.         let arr = ['a', 'b', 'c'];
  2.     console.log(Object.keys(arr)); // ['0', '1', '2'];
  4.     let obj = {0: 'a', 1: 'b', 2: 'c'};
  5.     console.log(Object.keys(obj)); // ['0', '1', '2'];
  7.     let anObj = {100: 'a', 2: 'b', 7: 'c'};
  8.     console.log(Object.keys(anObj)); // ['100', '2', '7']
  10.     let myObj = Object.create({}, {
  11.         getFoo: {
  12.             value: function() {
  13.                 return this.foo;
  14.             }
  15.         }
  16.     });
  17.     myObj.foo = 1;
  18.     console.log(Object.keys(myObj)); // ['foo']

Object.values()

【不支持ie】
返回一个给定对象自身的所有可枚举属性值的数组
与for…in 循环遍历该对象时返回顺序一致，但 for…in 循环还会枚举原型链中的属性

  1. let valObj = {foo: 'bar', baz: 42};
  2. console.log(Object.values(valObj)); // ['bar', 42]
  4. console.log(Object.values('foo')); // ['f', 'o', 'o']

Object.entries()

【不支持Ie】
返回一个给定对象自身可枚举属性的键值对数组
与for…in 循环遍历该对象时返回顺序一致，但for…in 循环还会枚举原型链中的属性。

  1. const obj = {foo: 'bar', baz: 42};
  2. console.log(Object.entries(obj));
  4. // 对象转map
  5. let mapObj = new Map(Object.entries(obj));
  6. console.log(mapObj);