ECMAScript 2017(ES8)已经发布,很多习惯语法却停留在ES6之前。路在前方。
ES8相关
http://www.php.cn/js-tutorial-374051.html
https://segmentfault.com/a/1190000010213513
http://www.jianshu.com/p/a138a525c287
ES6箭头函数
这里仅仅列出一些例子,详细阐述在下边的链接文章中。
// ES5
var selected = allJobs.filter(function (job) {
return job.isSelected();
});
// ES6
var selected = allJobs.filter(job => job.isSelected());
如果要写一个接受多重参数(也可能没有参数,或者是不定参数、默认参数、参数解构)的函数,你需要用小括号包裹参数list。
// ES5
var total = values.reduce(function (a, b) {
return a + b;
}, 0);
// ES6
var total = values.reduce((a, b) => a + b, 0);
那么不是非常函数化的情况又如何呢?除表达式外,箭头函数还可以包含一个块语句。
// ES5
$("#confetti-btn").click(function (event) {
playTrumpet();
fireConfettiCannon();
});
// ES6
$("#confetti-btn").click(event => {
playTrumpet();
fireConfettiCannon();
});
箭头函数没有它自己的this
曾经,我们封装嵌套函数,匿名函数时。总先什么一个变量获取this的引用,然后在嵌套函数内部使用。在箭头函数这里,已经不需要这样了。
{
...
addAll: function addAll(pieces) {
var self = this;
_.each(pieces, function (piece) {
self.add(piece);
});
},
...
}
// ES6
{
...
addAll: function addAll(pieces) {
_.each(pieces, piece => this.add(piece));
},
...
}
// 甚至可以写成下边这样的
// ES6的方法语法
{
...
addAll(pieces) {
_.each(pieces, piece => this.add(piece));
},
...
}
更多
更多信息请进下边的链接。
http://www.infoq.com/cn/articles/es6-in-depth-arrow-functions
http://www.infoq.com/cn/profile/%E5%88%98%E6%8C%AF%E6%B6%9B