ES6+的新特性

1.字面量增强

ES6中对对象字面量进行了增强，主要包括下面几部分：

属性的简写：Property Shorthand

在对象里面赋值，或者在函数返回对象的时候，经常会有a: a的代码出现，可以简写。

      var grade = "sss"
      var age = 18
      
      // var obj = {
      //   grade: grade,
      //   age: age
      // }

      var obj = {
        grade,
        age
      }



      function foo(){
        var message = "Hello World"
        var info = "my name is zzz"

        // return {
        //   message: message,
        //   info: info
        // }

        return {
          message,
          info
        }
      }

方法的简写：Method Shorthand

一种语法糖写法，更简洁。running是简写之前的，playing是简写之后的。

var obj = {
        grade,
        age,
        running: function(){

        },
        playing(){
          
        }
      }

这种写法不同于箭头函数，箭头函数是没有this的，而这种函数的简写是有this的。

计算属性名：Computed Property Names

可以将key的值作为属性名

      var grade = "sss"
      var age = 18
      var key = "address" 
      
      var obj = {
        grade,
        age,
        running: function(){

        },
        playing(){
          
        }

        [key]: "广州市"
      }

2.解构Destructuring

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

解构分为：数组的解构和对象的解构

1.数组解构基本语法

    var name = ["abc", "cba", "nba", "mba"]

    //没有数组解构之前的语法
    // var name1 = name[0]
    // var name2 = name[1]
    // var name3 = name[2]
    var [name1 , name2, name3] = name
    console.log(name1, name2, name3);

2.数组的严格顺序的，如果想要跳过某个数组元素，可以空着

var [name1, , name3] = name

3.解构出数组，剩余的放在newName数组里面

var [name1, name2, ...newName] = name

4.数组解构的默认值，如果没有值，可以解构的时候添加一个默认值

var [name1, name2, name3 = "default"] = name

 

1.对象解构基本语法

    var obj = { name: "zzz", age: 18, address: "广州"}

    //没有对象解构之前的语法
    // var name = obj.name
    // var age = obj.age
    // var address = obj.address
    var {name , age, address} = obj

2.对象解构任意顺序,对象是没有顺序的，是根据key来解构的

var { height, name, address} = obj

3.对变量进行重命名

var { height: wHeight, name: wName, age: wAge} = name