字面量的增强

在ES6中对对象的字面量进行了增强，称之为 Enhanced object literals（增强对象字面量）

属性的简写：Property Shorthand

在ES6之前在对象Boy中添加name 与 age 的参数，需要按照下面方式进行添加参数

var name = "sabo"
var age = 14

var boy = {
    name: name,
    age:age
}

ES6 属性的简写方式

var name = "sabo"
var age = 14

var boy = {
    name,
    age
}

在ES6之前在对象Boy中定义方法，首先定义方法名：function()的形式去定义

var boy = {
   foo: function() {
    console.log(this)
  }
}

ES6方法的简写方式，直接在方法名后面添加（）即可

var boy = {
   foo() {
    console.log(this)
  }
}

在ES6之前在对象Boy中定义一个参数（参数名不确定的情况下）

var boy = {
   name
}
obj[name + 123] = "aaa"

ES6计算属性名，直接在对象内部定义即可

var boy = {
   name,
   [name + 123]: "aaa"
}

ES6中新增了一个从数组或对象中方便获取数据的方法，称之为解构Destructuring

定义一个数组boy，并将数组的数据依次赋值给三个变量

var boy = ["a", "b", "c"]
var item1 = boy[0]
var item2 = boy[1]
var item3 = boy[2]

下面使用解构的方式去实现

var boy = ["a", "b", "c"]
var [item1, item2, item3] = boy

如果只解构数组boy中最后一个元素，怎么操作呢？

var [, , itemz] = boy

使用 , 来进行占位即可

只解构数组中中间一个元素呢？

var [,itemz,] = boy

如果只解构数组boy中第一元素后面的元素放到一个新数组中，怎么操作呢？

var [itemx, ...newNames] = boy

如果解构数组boy并且设置一个默认值，怎么操作呢？

var [item1, item2, item3,item4 = "d"] = boy

定义一个对象boy，并将boy的参数赋值给三个变量

var boy = = {
  name: "sabo",
  age: 14,
  height: 2.00
}
var name = boy.name
var age = boy.age
var height = boy.height

下面使用解构的方式去实现

var { name, age, height } = boy

单独解构boy中的一个参数

var { name } = boy

单独解构boy中的一个参数，并且重新定义key

var { name：newName } = boy

首先定义一个foo函数，函数中需要传入对象，并且打印对象的name与age

function foo(boy) {
  console.log(boy.name, boy.age)
}

通过解构的方式实现

function foo({name,age}) {
  console.log(name,age)
}
foo(boy)

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第3天，点击查看活动详情