ES6对象扩展

ES6对象扩展

对象简写

ES6允许属性和方法名简写方式。
属性名的简写即只书写属性名，属性值则为与属性名同名的变量值。
方法简写即是省略function关键字。

属性简写

let name="es6"
let descript="es6 test"
let esayObj = {name,descript}

console.log(esayObj)//Object {name: "es6", descript: "es6 test"}

//相当于如下写法：
let name="es6"
let descript="es6 test"
let esayObj = {
    name:name,  //上面的写法省略了属性赋值操作，在对象的解构中会自动为属性名赋值为相同名称的变量值
    descript:descript
}

console.log(esayObj)//Object {name: "es6", descript: "es6 test"}

方法简写

let functionTest = {
    sayHi(){
        console.log("Hi function!")
    }
}
functionTest.sayHi()

//相当于如下结构
let functionTest = {
    sayHi:function(){
        console.log("Hi function!")
    }
}
functionTest.sayHi()

属性名表达式

ES6对象的属性名支持表达式表式，而ES5只能支持字面量，使用表达式表式的时候需要使用[]将表达式包裹起来。

let propKey = 'foo';

let obj = {
  [propKey]: true,
  ['a' + 'bc']: 123
};

console.log(obj)//Object {foo: true, abc: 123}

Object.is()

ES5比较两个值是否相等，只有两个运算符：相等运算符（==）和严格相等运算符（===）。它们都有缺点，前者会自动转换数据类型，后者的NaN不等于自身，以及+0等于-0。JavaScript缺乏一种运算，在所有环境中，只要两个值是一样的，它们就应该相等。

ES6提出“Same-value equality”（同值相等）算法，用来解决这个问题。Object.is就是部署这个算法的新方法。它用来比较两个值是否严格相等，与严格比较运算符（===）的行为基本一致。

Object.is('foo', 'foo')//true

Object.assign(targetObj,…sourceObj)

Object.assign方法用于合并对象，将源对象中所有可枚举的属性合并到目标对象中。

需注意的是：

• 相同属性名的值会被后面的源对象给覆盖掉
• 如果没有源对象，则直接返回目标对象
• 传入的参数都会被转换成Object对象，源对象如果转换错误则跳过该源对象，目标对象转换错误则报错。
• Object.assign实行的是浅拷贝，只拷贝了源对象的引用，即合并后目标对象的任何该表，在源对象上也会改变。
• Object.assign只拷贝源对象自身的属性，而不拷贝继承属性。

let sourceObj1 = {
    name:"source1",
    sayHi(){
        console.log("Hi!")
    }
}

let sourceObj2 = {
    name:"source2",
    sayHello(){
        console.log("Hello!")
    }
}
let targetObj = Object.assign({},sourceObj1,sourceObj2)
console.log(targetObj.name)//source2
targetObj.sayHi()          //Hi!
targetObj.sayHello()       //Hello

扩展运算符

ES6引入了...作为扩展运算符。它主要作用是解构匹配尚未被读取的数据。

let [a,b,...c] = [1,2,3,4,5,6,7]
console.log(c)

NULL传导运算符

在实际应用中，我们要使用某个对象的属性，往往会先判断这个对象是否存在，如果这个对象的属性存在的层次比较深，那么我们就必须逐级判断，例如：

const firstName = (message
  && message.body
  && message.body.user
  && message.body.user.firstName) || 'default';

ES6中提出了一个更简单的写法?.,这就是null传导符，上面的例子可以简化为：

const firstName = message?.body?.user?.firstName || 'default';

其他对象方法

Object.getOwnPropertyDescriptor(obj,prop)：获取对象指定属性的描述信息
Object.keys(obj):获取对象属性名称的集合
Object.values(obj)：获取对象属性值的集合
Object.entries(obj)：获取对象属性名和属性值的键值对集合
Object.getOwnPropertyNames:返回一个数组，包含对象自身的所有属性（不含Symbol属性，但是包括不可枚举属性）
Object.getOwnPropertySymbols:返回一个数组，包含对象自身的所有Symbol属性
Object.setPrototypeOf(object, prototype):用来设置一个对象的prototype对象，返回参数对象本身
Object.getPrototypeOf(obj):用于获取对象的prototype对象
Object.getOwnPropertyDescriptors(obj)：返回指定对象所有自身属性（非继承属性）的描述对象