之前看阮一峰大神的ES6入门,觉得箭头函数是个好东西,今天用的时候遇到了一点问题,总结一下。
首先是参数部分:
ES6箭头函数,没有参数的时候这样写
()=>x;
等同于 function(){return x;}
有参数的时候就在括号里传(param1,param2...)
如果只有一个参数,可以省略括号,写成 x=>x
等同于function(X){return x;}
还有x=>x+x 很好理解。。嗯
如果箭头函数代码块的代码多于一句,就要用{}括起来。
这里就带来一个问题,对象外面也是大括号,所有如果返回一个对象,必须用小括号把对象包起来,防止解析错误。
箭头函数最大的一个好处就是它的THIS指向定义时所在环境的THIS,而非使用时环境的THIS,比如在SETTIMEOUT函数的回调函数中,如果使用箭头函数,那么THIS还是指向调用SETTIMEOUT的对象里的THIS,是不是很方便?
粘个阮大神的例子上来,就比较好理解了。
// ES6
function foo() {
setTimeout(() => {
console.log('id:', this.id);
}, 100);
}
// ES5
function foo() {
var _this = this;
setTimeout(function () {
console.log('id:', _this.id);
}, 100);
}
还有一些其他用处,下次再补充。
参考文献:
http://es6.ruanyifeng.com/?search=%E7%AE%AD%E5%A4%B4%E5%87%BD%E6%95%B0&x=0&y=0#docs/function#箭头函数