ES5函数与ES6箭头函数比较（javascript基础）

1，ES5函数

例 function test() {}，函数分为四个部分：

第一部分，保留字function；

第二部分，函数名，可以省略（function(){}..这是一个匿名函数anonymous）；

第三部分，一对圆括号，中间为参数，可为空，附带两个隐藏参数，this和arguments；

第四部分，执行的代码块；

这部分只有一对括号，作用却很大。比如调用一个函数：var ss = aa; 和 var ss = aa(); 是不一样的。前面的是把函数的指针赋给了ss，ss也就是这个函数，后面的是把aa函数执行的结果赋给了ss  ， ss是它的返回值。

第五部分，最后还可以加一对圆括号，为调用函数。

2，ES6箭头函数

例 () => {}，函数仅保留两个部分：

第一部分，一对圆括号，传参；

第二部分，执行的代码块。

第三部分，最后还可以加一对圆括号，为调用函数。

以上，仅为结构的简单差别，用法上要做中注意的是this的指向问题：

ES5中，this指向函数执行时的上下文环境对象，this的指向有三种情况：

1，如下，b()是C对象以属性的形式调用的，c.b()，此时 b 函数中的this指向的是this.c这个对象；

注意:此种调用方式经常会出现this绑定丢失的情况，比如函数作为参数传递的时候(存在隐式赋值，这时候虽然形式上是obj.fn，实际上等于var a = obj.fn，与直接调用fn是一样的，另比如settimeout等js内置函数，也是一样)

隐式绑定

2，普通函数的调用，b()，此时this指向window；

默认绑定。

3，c.b().call({ name: "B"})，call会使this指向改变。

显式绑定

以此原理，衍生出了硬绑定:用一个函数包含对象c和函数b(),内部调用b.call(c)，重复使用外部函数，实现b的this绑定。

es5提供了api，b.bind(c)

4，第四种是new操作符创建新对象的四个步骤中，会修改this指向:

1)，创建一个新对象

2)，原型继承

3)，绑定this

4)，return，如无return值，返回本身

以上四中优先级:

new > 显式 > 隐式 > 默认

console打印结果为a+

ES6中，箭头函数this的指向，是定义时，this的指向对象。此处指向factory构造函数的实例。

console打印结果为a

以上，欢迎大家借鉴与指正！