箭头函数存在的意义

我们都知道,ES6新增了一种函数定义形式:箭头函数。

function name(arg1, arg2) {…} 可以使用 (arg1, arg2) => {…} 来定义。

为什么新增了“箭头函数”呢?

箭头函数

箭头函数存在的意义,第一写起来更加简洁,第二可以解决ES6之前函数执行中this是全局变量的问题,请看如下代码:

function fn() {
  console.log('real', this)  // {a: 100}, 该作用域下的this的真实的值
  var arr = [1,2,3]
  // 普通JS
  arr.map(function(item) {
    console.log('js', this) // window  普通函数,这里打印出来的是全局变量,令人费解
    return item + 1
  })
  // 箭头函数
  arr.map(item => {
    console.log('es6', this)  // {a: 100} 箭头函数,这里打印的就是父作用域的this
    return item + 1
  })
}
fn.call({a: 100})