对象的新增方法 —— ES6基础总结（六）

时间 2019-12-05

标签对象新增方法 es6 基础总结栏目 JavaScript 繁體版

原文原文链接

前言

本文主要介绍ES6中对象新增的一些方法，关于对象其它扩展知识，请戳对象的扩展 —— ES6基础总结（五）es6

新增方法

Object.is()

JavaScript 缺少一种运算，在全部环境中，只要两个值是同样的，它们就应该相等。数组

同值相等（Same-value equality），与 === 的行为基本一致。post

+0 === -0   // true
    Object.is(+0, -0)   // false
    
    NaN === NaN     // false
    Object.is(NaN, NaN)     // true
    
    {} === {}   // false
    Object.is({}, {})   // false
复制代码

Object.assign()

Object.assign(target, source1, ... sourceN)ui

合并对象，将源对象的全部 可枚举 属性，合并到目标对象。spa

Object.assign({a: 1}, {b: 2}, {c: 3})   // {a: 1, b: 2, c: 3}
复制代码

注意：prototype

同名属性，后面的属性会覆盖前面的属性；3d

Object.assign({a: 1}, {b: 2}, {a: 11}, {b: 22})     // {a: 11, b: 22}
复制代码

参数不是对象，会将其转成对象再返回。转对象失败时（undefined和null）：code

目标参数：报错cdn

Object.assign(null, {a: 1})     // Cannot convert undefined or null to object
复制代码

源参数：跳过对象

Object.assign({a: 1}, undefined)    // {a: 1}
复制代码

布尔值和数值对应的包装对象，不会被拷贝；

Object.assign({a: 1}, true, 520)    // {a: 1}
复制代码

只有字符串对应的包装对象，会产生可枚举属性，会被拷贝；

Object.assign({a: 1}, 'test')   // {0: "t", 1: "e", 2: "s", 3: "t", a: 1}
复制代码

Symbol值的属性，会被拷贝；

Object.assign({s: Symbol('s')}, {a: 1})     // {s: Symbol(s), a: 1}
复制代码

只拷贝源对象的自身属性（不拷贝继承属性），也不拷贝不可枚举的属性；

Object.assign({a: 1},
    Object.defineProperty({}, 'enum', {
        enumerable: false,
        value: 'test'
    })
)   // {a: 1}
复制代码

浅拷贝；

let source = {
  a: 1,
  b: {
    b1: 'test1'
  }
}
let target = {}

Object.assign(target, source)       // {a: 1, b: {b1: "test2"}}

target.b.b1 = 'test2'
target.b.b1     // "test2"
source.b.b1     // "test2"
source.b === target.b   // true
复制代码

处理数组;

Object.assign([1, 2, 3], [4, 5])    // [4, 5, 3]
复制代码

Object.getOwnPropertyDescriptors()

返回指定对象全部自身属性（非继承属性）的描述对象。

Object.getOwnPropertyDescriptor(): 返回某个对象属性的描述对象。

let obj = {
        a: 1,
        fun () {
            console.log('fun')
        }
    }
    
    Object.getOwnPropertyDescriptors(obj)   
    // { 
    // a: {value: 1, writable: true, enumerable: true, configurable: true}
    // fun: {value: ƒ, writable: true, enumerable: true, configurable: true}
    // }
    Object.getOwnPropertyDescriptor(obj, 'a')   // {value: 1, writable: true, enumerable: true, configurable: true}
    Object.getOwnPropertyDescriptor(obj, 'fun')     // {value: ƒ, writable: true, enumerable: true, configurable: true}
复制代码

Object.setPrototypeOf() & Object.getPrototypeOf()

Object.setPrototypeOf(obj, proto)：设置对象的proptotype对象，相似于__proto__。

Object.getPrototypeOf(obj)：获取对象的proptotype对象。

let proto = {
      a: 1,
    }
    let obj = {
      b: 2
    }
    // 相似于 obj.__proto__ = proto
    Object.setPrototypeOf(obj, proto)
    
    obj.a   // 1
    obj.b   // 2
    Object.getPrototypeOf(obj) === proto    // true
复制代码

注意：

obj不是对象，会自动转成对象；

Object.setPrototypeOf(1, {}) === 1 // true
Object.setPrototypeOf(true, {}) === true // true

Object.getPrototypeOf(1)    // Number {[[PrimitiveValue]]: 0}
Object.getPrototypeOf(true)     // Boolean {[[PrimitiveValue]]: false}

Object.getPrototypeOf(1) === Number.prototype   // true
Object.getPrototypeOf(true) === Boolean.prototype   // true
复制代码

因为undefined、null没法转成对象，就会报错。

Object.setPrototypeOf(undefined, {})    // Object.setPrototypeOf called on null or undefined

Object.getPrototypeOf(undefined)    // Cannot convert undefined or null to object
复制代码

Object.keys() & Object.values() & Object.entries()

Object.keys()：返回参数对象自身的全部可遍历属性的键名；

Object.values()：返回参数对象自身的全部可遍历属性的键值；

Object.entries()：返回参数对象自身的全部可遍历属性的键值对。

let obj = {
        a: 1,
        b: 1,
    }
    
    Object.keys(obj)    // ["a", "b"]
    Object.values(obj)      // [1, 2]
    Object.entries(obj)     // [["a", 1], ["b", 2]]
复制代码

Object.fromEntries()

Object.entries()的逆操做，用于将一个键值对数组转为对象。

Object.fromEntries([
      ['a', 1],
      ['b', 2]
    ])      // {a: 1, b: 2}
复制代码

配合URLSearchParams对象，将查询字符串转为对象。

Object.fromEntries(new URLSearchParams('a=1&b=2'))      // {a: "1", b: "2"}
复制代码

参考

ECMAScript 6 入门

小结

本文只要介绍了ES6中对象的一些新增方法，其中包括：

Object.is()：基本行为与===类似;
Object.assign()：快速合并对象，但必定要注意是浅拷贝；
Object.getOwnPropertyDescriptors()：是对ES5中Object.getOwnPropertyDescriptor()进行的封装，返回对象全部的自身属性的描述对象；
Object.setPrototypeOf() & Object.getPrototypeOf()：用来读取/设置当前对象的prototype对象，与__proto__相同，两者配合使用；
Object.keys() & Object.values() & Object.entries()：返回可遍历属性造成的一个数组；
Object.fromEntries()：Object.entries()的逆操做。

感谢阅读，若有问题，欢迎指正。