【JavaScript】ES6

ES6

  • ECMAScript 6JavaScript的第二个主要修订版
  • ECMAScript 6也称为ES6ECMAScript 2015

新特性

1. letconst关键字

  • let用于声明变量,const用于声明常量
  let x = 3
  x = 4
  console.log(x) // 4

  const num = 0
  num = 1 // !error: Assignment to constant variable.(常量变量赋值报错)
复制代码
  • 均会在JavaScript中提供块作用域
  var x = 10
  {
    let x = 2
  }
  console.log(x) // 10
  
  var y = 10
  {
    const y = 2
  }
  console.log(y) // 10
复制代码

2. 箭头函数(Arrow Functions)

箭头函数可以通过简短的语法来编写函数表达式,不需要function关键字、return关键字和花括号。

  // ES5
  var x = function(x, y) {
    return x * y
  }

  // ES6
  const x = (x, y) => x * y
复制代码
  • 箭头函数没有自己的this值,它所使用的this来自于函数作用域链
  // ES6
  this.nums.forEach(v => {
    if (v % 5 === 0)
        this.fives.push(v)
  })

  // ES5-方式一
  var self = this
  this.nums.forEach(function (v) {
    if (v % 5 === 0)
        self.fives.push(v)
  })

  // ES5-方式二
  this.nums.forEach(function (v) {
    if (v % 5 === 0)
        this.fives.push(v)
  }, this)

  // ES5-方式三
  this.nums.forEach(function (v) {
    if (v % 5 === 0)
        this.fives.push(v)
  }).bind(this)
复制代码

3. For/of循环

讲到For/of循环,就不得不介绍For/in循环。For/of循环只循环集合本身的元素,For/in循环遍历的实际上是对象的属性名称,Array实际也是一个对象,它的每个元素索引被视为一个属性,因此在使用For/in循环遍历数组时会将数组的所有属性遍历出来却不包括length属性

  var arr = ['a', 'b', 'c'];
  arr.fourth = 'd';
  for (var i in arr) {
    console.log(i); // '0', '1', '2', 'fourth'
  }

  for (var i of arr) {
    console.log(i); // 'a', 'b', 'c'
  }
复制代码

数组Array具有下标,可以通过下标循环遍历集合本身元素,但是MapSet这类集合就无法使用下标,因此Es6标准引入了新的类型iterable类型,Array Map Set都属于iterable类型,可通过For/of循环遍历集合。ps: 亦可通过iterable内置方法forEach遍历(这是ES5.1标准引入的)

4. class关键字

关于class

5. Promise

I Promise a Result!!!

Promise对象支持两个属性:stateresult

  • Promise对象处于pending状态时,结果是undefined
  • Promise对象处于fulfilled状态时,结果是一个值。
  • Promise对象处于rejected状态时,结果是一个error对象。
  // Example
  let myPromise = new Promise(function(resolve, reject) {
    setTimeout(function() {
      resolve('hello world!')
    }, 3000)
  })

  myPromise.then(function(val) {
    alert(val)
  })
复制代码

持续更新中。。。。

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享