002.ES2015和ES2016新特性--箭头函数.md
1. ES2015中的箭头函数
JavaScript有一级函数的特性,也就是说,函数像其他值一样可以当成参数传来传去。
var result = [1,2,3].reduce(function(total, current){
return total + current;
}, 0) //6;
使用箭头函数改造一下:
var result = [1,2,3].reduce((totoal, current) => total + current, 0);
console.log(result);
再看几个例子:
var even = [3,1,16,17,29].filter(el => !(el % 2));
console.log(even);
var sorted = data.sort((a, b) => {
var diff = a.price - b.price;
if(diff != 0){
return diff;
}
return a.total - b.total;
})
1.1. 箭头函数的执行上下文
箭头函数有一个非常重要的特性,就是其执行上下文(也就是代码中的this)指向为外层代码,例如:
function MyComponent(){
this.age = 26;
setTimeout(() => {
this.age += 1;
console.log(this.age);
}, 100);
}
new MyComponent(); // 27 in 100ms.
在Angular2中这一特性非常有用,对于特定的Component来说,箭头函数所绑定的上下文就是Component的实例。如果我们把MyComponent定义为Angular2中的组件,就可以使用age属性用来进行数据绑定。
作者:gavin
出处:http://www.cnblogs.com/gavin-cn
版权:本文版权归作者和博客园共有
转载:欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
出处:http://www.cnblogs.com/gavin-cn
版权:本文版权归作者和博客园共有
转载:欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。