一、说明
ECMAScript6可以用箭头"=>"定义函数。x => x * x
或(x) => {return x * x;}
与匿名函数function(x){return x * x;}
相等。
二、示例
2.1 没有参数的箭头函数
var f = () => 9;console.log(f()); //9
2.2 一个参数的箭头函数
var f = x => x * x;console.log(f(3)); //9var f = x => {return x * x;};console.log(f(3)); //9var f = (x) => x * x;console.log(f(3)); //9var f = (x) => {return x * x;};console.log(f(3)); //9
2.3 两个或更多参数的箭头函数
var f = (x, y) => x * y;console.log(f(2, 3)); //6var f = (x, y , ...more) => { var multiply = x * y; for(var i = 0; i < more.length; i++){ multiply *= more[i]; } return multiply;};console.log(f(2, 3, 4, 5)); //120
2.4 map/reduce应用
var f = [1, 2, 3].map(x => x * x);console.log(f); //[1, 4, 9]var f = [1, 2, 3].reduce((x, y) => x + y);console.log(f); //6
三、this作用域/返回对象
3.1 this作用域
箭头函数中的this总是指向外层作用域,即使在内层函数里面,所以可以不用写var that = this;
。
var obj = { name: 'mazey', f: function(){ var myName = () => this.name; //这里的this指向obj return myName(); }};console.log(obj.f()); //mazey
3.2 返回对象
因为对象和块的冲突问题,箭头函数返回一个如{name:'mazey'}
的对象必需用()
括起来。
var f = () => {name:'mazey'};console.log(f()); //undefinedvar f = () => ({name:'mazey'});console.log(f()); //{name: "mazey"}