1、箭头函数简介
- 用 => 来标识
- 箭头函数表达式的语法比函数表达式更简洁，并且没有自己的this，arguments，super或 new.target。这些函数表达式更适用于那些本来需要匿名函数的地方，并且它们不能用作构造函数。
2、通常函数的定义方法
var fn1 = function(a, b){ console.log(a + b);};fn1(1, 2); // 3function fn2(a, b){ console.log(a - b);}fn2(2, 1);//13、简写写法
对应上面两个
//删掉了functionvar fn11 = (a, b)=>{ console.log(a+b);};fn11(1, 2); // 3//删掉了function和函数名,无意义(a,b)=>{ console.log(a-b)}4、基础语法
附加规则
- 当函数参数只有一个时，可省略小括号，但没有时，不能省略。
- 函数体（中括号）中有且只有一行return语句时，中括号和return关键字可以省略。
- 函数返回json对象，且只有一行return语句时，返回的简写要加小括号;如let add = a =>({"a":2})
(参数1, 参数2, …, 参数N) => { 函数声明 } //相当于：(参数1, 参数2, …, 参数N) =>{ return 表达式; } (参数1, 参数2, …, 参数N) => 表达式（单一） // 当只有一个参数时，圆括号是可选的： (单一参数) => {函数声明} 单一参数 => {函数声明} // 没有参数的函数应该写成一对圆括号。 () => {函数声明} var add = function(a,b){ return a+b; }; // 即： var add = (a,b)=>{ return a+b }; // 即： var add = (a,b)=>a+b; --------------------------------------------------------------------------------------- var ret = function(a){ return a+1; }; // 即： var ret = a=>a+1; --------------------------------------------------------------------------------------- var non = function(){ return 2+1; }; // 即 var non = ()=>2+1; 函数体代码多于一行 let fun1 = function(){ console.log('1'); console.log('2'); return 1+2; } fun1(); // 简写为 let fun2 = ()=>{ console.log('1'); console.log('2'); return 1+2 } fun2(); 函数返回json对象时 let f1 = function(){ return {"a":2}; } let f2 = ()=>{"a":2} // 错误 let f2 = ()=>({"a":2}) 如果要返回一个对象，就要注意，如果是单表达式，这么写的话会报错： x => { foo: x } 因为和函数体的{ ... }有语法冲突，所以要改为： // ok: x => ({ foo: x }) 实例 let arr1 = [9,6,1,7]; let arr11 = arr1.sort( function(a,b){ return a-b; } ) console.log(arr11); let arr3= [2,3,9,5]; let arr33 = arr3.sort((a,b)=>a-b) console.log(arr33)5、总结
- 箭头函数看上去是匿名函数的一种简写，但实际上，箭头函数和匿名函数有个明显的区别：箭头函数内部的this是词法作用域，由上下文确定。
- 箭头函数写代码拥有更加简洁的语法。
- 不会绑定this，或者说箭头函数中 不会改变this本来的绑定。