ES6的箭头符号

箭头符号在JS中一直扮演着重要的角色。在JS教程里，一开始都会介绍如何使用箭头括号来加注释。

我们先回顾下箭头符号的一般用法：

--!>  单行注释

<=   小于等于

=>   ?

=>是ES6中新的用法。

函数表达式无处不在

JavaScript中有一个有趣的特性，无论何时，当你需要一个函数时，你都可以在想添加的地方输入这个函数。

箭头函数的产生，主要由两个目的：更简洁的语法和与父作用域共享关键字this

为什么叫Arrow Function？因为它的定义用的就是一个箭头：

x =>x * x;

相当于：

function (x){

return x*x;

}

箭头函数简化的了函数的定义，省略了“function” “{}”“return”

包含多个语句时，不能省略“{}”和“return”

x => {

if (x > 0) {

return x * x;

} else {

return - x * x;

}

}

如果参数不是一个，用括号括起来：

如果要返回一个对象，就要注意，如果是单表达式，这么写的话会报错：

var a = (x)=>{age:x};console.log(a(12)); //undefined

因为和函数体的{ ... }有语法冲突，所以要改为：

var b = (x)=>({age:x});console.log(b(12)); // { age: 12 }

箭头函数和ES5的函数有什么不同呢？

先来欣赏一段常见的代码

再来修改我们欣赏的这段代码

回顾下JS中this的指向问题

有对象就指向调用对象

函数有所属对象时，通常通过表达式调用，这时 this 自然指向所属对象。比如下面的例子：

getValue() 属于对象 myObject，并由 myOjbect 进行调用，因此 this 指向对象 myObject

没调用对象就指向全局对象

用new构造就指向新对象

通过 new 关键词来调用构造函数，此时 this 会绑定在该新对象上

通过 apply 或 call 或 bind来改变 this 的所指

apply() 方法接受两个参数第一个是函数运行的作用域，另外一个是一个参数数组(arguments),意思就是将当前函数的上下文进一步扩大到调用的对象上下文上。

call() 方法第一个参数的意义与 apply() 方法相同，只是其他的参数需要一个个列举出来。

见证奇迹的时刻：看看使用箭头函数后this的指向

箭头函数this的指向会指向最外层的obj对象

箭头函数有几个使用注意点

（1）函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。

（2）不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。 

（3）不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用Rest参数代替。