箭头函数,就是对函数进行简化操作,基本写法
=>
=> 就是当你只需要一个只有一个参数的简单函数时,可以使用新标准中的箭头函数,它的语法非常简单:标识符=>表达式。你无需输入function和return,一些小括号、大括号以及分号也可以省略。
function show(x){
console.log(x)
};
show(4);
var fun = y => y;
console.log(fun(5));
() 多参数的处理
如果要写一个接受多重参数(也可能没有参数,或者是不定参数、默认参数、参数解构)的函数,你需要用小括号包裹参数 list
一个参数的情况下你可以不用小括号 var fun = y => y;
这样直接写,两个参数或者有更多的参数的时候就必要用小括号把参数包裹进去。
var fun = (x,y)=> x+y;
console.log(fun(7,9));
{} 函数体多内容的处理
复杂一些就好比这样
var fun = (x,y)=>{
x=x*y;
y=y*x;
return x+y;
};
console.log(fun(7,9));
这时我们需要把复杂的计算过程写到大括号里,如果不写大括号就意味着直接就是写入
return
了,所以需要写入到大括号里。
回调写法
回调函数,匿名函数也是可以用箭头函数来写的。
setTimeout(()=>{
console.log(123);
},1000);
怎么说呢,箭头函数也可以这样理解就是把函数中的
function
给省略了。
注意点
箭头函数我们还需要注意一些细节。
this 指向的问题
在函数中 this 指向是很容易搞混淆的。我们在做面向对象,事件的时候,会弄混的。这个 this 指向的问题我单独开一个新的文章来写。
不可以当做构造函数
这里有这样的一个构造函数
var A = function(){
this.a=10;
};
var A1 = new A();
console.log(A1.a);
这是一个简单的构造函数,这时候如果用 => 来代替了 function 以后会出现什么情况
var A = () =>{
this.a=10;
};
var A1 = new A();
console.log(A1.a);
可以看出箭头函数是不可以做构造函数的。
不可以使用 arguments
形式参数 arguments 是不能在箭头函数中使用的
var fun = function(){
console.log(arguments[4]+arguments[3]);
};
fun(1,2,3,4,5);
但是如果用 箭头函数就会报错
var fun = ()=>{
console.log(arguments[4]+arguments[3]);
};
fun(1,2,3,4,5);
Uncaught ReferenceError: arguments is not defined 说没有找到,没有定义。
不可以用在 Generator 函数中。
Generator 这个函数就是生成器,是为了解决异步操作。这个点也是比较多,我们单独写一个博客。
以上的四点是需要注意的地方。