前言
es6中的一系列关于函数用法的变化是非常有趣的，在es6的新标准下，你可以更加轻便地使用函数，并且可以仿照面向对象编程的思想来使用函数，将函数转化为“类”。（这里的类加了引号，原因我们会在后面的学习中解释）下面就让我们来一起看一看es6下的函数有哪些有趣的变化。
1.箭头函数
箭头函数是es6下实现的一种新的函数书写方法。在过去的编程中，我们如果实现一个将数组内的字符串全部变成大写，需要这样的匿名函数进行实现：
1const Marvel = ['spider man', 'iron man', 'thor', 'hulk', 'captain']; 2 3const UpperMarvel = Marvel.map(function (name) { 4 return name.toUpperCase(); 5}); 6 7console.log(UpperMarvel); // Uppercase of all the elements in Marvel[]
现在，我们可以通过箭头函数来实现这一过程了：
1const Marvel = ['spider man', 'iron man', 'thor', 'hulk', 'captain']; 2 3const UpperMarvel = Marvel.map( 4 name => name.toUpperCase() 5); 6console.log(UpperMarvel);
可以看到，我们去掉了function关键字，去掉了参数的圆括号，函数体的花括号，以及return语句。直接采用： 参数 => 参数的操作，这一形式来代替之前冗长的匿名函数。 需要注意的是，我们并不是彻底抛弃了圆括号和花括号，在以下情况时，我们需要召回我们的括号兄弟：
- 当我们有不止一个参数时——需要圆括号
- 当我们的函数体不能用一个表达式完成，而需要多个语句时——需要花括号，而且我们需要召回return语句！
请看下面这个例子：
1const Marvel = ['spider man', 'iron man', 'thor', 'hulk', 'captain']; 2 3const UpperMarvel = Marvel.map( 4 name => { 5 name = name.toUpperCase(); 6 return `${name} has ${name.length} characters in their name`; 7 }); 8console.log(UpperMarvel);
这里我们需要对name先进行大写处理，再通过模板字面量输出，多个语句，此时就必须有花括号出现。并且，由于我们当前花括号内的操作不再是一个单一表达式了，函数体必须由我们制定返回值，因此，return语句也是必不可少的！
2.箭头函数的this指针
提到this指针，还真是个非常头大的事情，对于初学者来说，javascript的第一个难点可能就在这里，很多人都不理解这个this指针到底是什么东西。我个人比较习惯把this理解为“所在地”，或者“你现在所处于”的意思，也就是说，它就是一个表示上下文环境的标志！我们来回顾一下在一般的javascript函数中，this都有哪些用法。
(1)当我们对某一对象调用方法的时候，例如Data.getName()
此时getName()函数中的this就指向对象Data。限定了当前大环境是Data对象，那么getName()得到的没准就是Data.name的值。
(2)Data1.getName().call(Data2)，此时我们的call()方法传入了对象Data2，了解call()方法，你应该就明白这里我们虽然调用了 Data1的getName()方法，但是已经把this指向了Data2！
(3)this指向全局对象
以上是this指针在以往普通函数中的使用。那么在新的箭头函数中，this指针的规则有什么新的调整吗？ 不难发现，在过去的函数中，this指针的指向取决于“怎么被调用，谁调用”，就像我们前面提到的Data.getName()一样，this指向Data。但在箭头函数中，this的指向更加直接，就是当前箭头函数的所在上下文环境！ 我们通过一个例子就可以看出this指针在箭头函数中的用法：
1function Latte() { 2 this.sugar = 0; 3 this.milk = 0; 4} 5 6Latte.prototype.addSugar = function () { 7 setTimeout(function () { 8 this.sugar++; 9 console.log('sugar added!'); 10 }, 500); 11}; 12 13const latte1 = new Latte(); 14latte1.addSugar(); 15 16setTimeout(function () { 17 console.log(latte1.sugar); // 0 18}, 1000);
你可能会以为这里setTimeout函数中的this.sugar++已经给sugar属性增加了啊！为什么还是0呢，这个+1去哪里了？让我们想想前面提到的普通匿名函数中的this指针的情况。注意这里this指针出现在setTimeout的第一个参数匿名函数中，这意味着什么？这个里层的匿名函数的this指针，可和addSugar方法中的this指针不是一个东西哦！这个this指针本身是没有制定上下文的，它会直接被指向全局对象，那么这个+1就加给了全局对象中的sugar（实际上相当于undefined + 1 =NaN）。这里我们解决方法就是使用闭包，把addSugar的this指针**“塞进”**setTimeout的匿名函数中，比如通过建立一个新变量赋值为this，再在里层的匿名函数中使用这个变量代替this指针即可！
但是如果使用箭头函数，情况就不是上述这样了。牢记我们的箭头函数中的this指针永远指向当前所处函数的上下文！也就是你即便有一百个箭头函数嵌套在一起，最里面的this指针一样指向最外层的函数的上下文！我们看看同样的例子，换作匿名函数：
1Latte.prototype.addSugar = function () { 2 setTimeout( () => { 3 this.sugar++; 4 console.log('sugar added!'); 5 }, 500); 6};
这里我们的sugar终于会＋1了，原因就是我们的this指针会自动指向当前setTimeout所在的上下文，也就是addSugar的function的this内容，这样就可以找到我们的latte1对象中的sugar属性了！
3.默认参数函数
在es6中我们可以给函数进行默认函数参数的设定，尤其是和之前我们讲到的数组对象的解构结合起来的时候，你就会发现我们可以用很简单的代码实现一个参数灵活的函数！一个显示咖啡里面配料比重的函数：
1function Latte(coffee = 30, sugar = 10, milk = 60){ 2 return `this cup of latte contains ${coffee}% of coffee,${sugar}% of sugar and ${milk}% of milk`; 3}
对应的输出如下：
1console.log(Latte()); // this cup of latte contains 30% of coffee,10% of sugar and 60% of milk 2console.log(Latte(15)); // this cup of latte contains 15% of coffee,10% of sugar and 60% of milk 3console.log(Latte(15,25,45)); // this cup of latte contains 15% of coffee,10% of sugar and 60% of milk
这就是默然参数函数的用处，你不再需要像以往一样，分别讨论参数的缺省情况。现在你可以考虑一下，如果我们的参数包括数组和对象，那么通过之前学到的解构，是不是可以发挥更强大的作用？这个留给你自己去尝试一下！ 以上就是es6中的一些函数方面的总结。