《深入理解ES6》之箭头函数
箭头函数是一种使用箭头(=>)定义函数的新语法,它与传统js函数的不同之处有:
- 没有this、super、arguments、和new.target绑定
- 不能通过new关键字调用
- 没有原型
- 不可以改变this的绑定
- 不支持arguments对象
- 不支持重复的命名参数
箭头函数的语法
箭头函数由函数参数、箭头、函数体组成。
当箭头函数只有一个参数时,可以直接写参数名,箭头紧随其后,箭头右侧的表达式被求值后便立即返回。
let first=value=>value; //相当于: let first=function(value){ return value; };
当传入两个或两个以上的参数,要在参数的两侧添加一对小括号,并且用逗号进行分隔。
let sum=(a,b)=>a+b; //相当于: let sum=function(a,b){ return a+b; };
如果没有参数,也要在声明的时候写一组没有内容的小括号。
let getName=()=>'jiaxiaonuo'; //相当于 let getName=function(){ return 'jiaxiaonuo'; };
如果想创建一个空函数,需要写一对没有内容的花括号。
let doNothing=()=>{}; //相当于: let doNothing=function(){};
创建立即执行函数表达式
let person=((name)=>{ return{ getName:function(){ return name; } }; })('jiaxiaonuo'); console.log(person.getName()); //'jiaxiaonuo' //相当于 let person=function(name){ return{ getName:function(){ return name; } }; }("jiaxiaonuo'); console.log(person.getName()); //'jiaxiaonuo'
箭头函数中没有this绑定,必须通过查找作用域链来决定其值。
箭头函数缺少正常函数所拥有的prototype属性,它的设计初衷是“即用即弃”,所以不能用它来定义新的类型。
箭头函数中的this值取决于该函数外部非箭头函数的this值,且不能通过call()、apply()或bind()方法来改变this的值。
var result =values.sort((a,b)=>a-b); //相当于: var result=values.sort(function(a,b){ return a-b; });
var sum=(num1,num2)=>num1+num2; console.log(sum.call(null,1,3));//4 console.log(sum.aplly(null,[1,3]);//4 var bounSum=sum.bind(null,1,3); console.log(boundSum());//4