箭头函数
语法
完整写法
const foo = (argu1,argu2)=>{
console.log('箭头函数',argu1,argu2);
}
简写写法
-
函数当且仅当只有一个参数时,小括号可以省略
const foo = argu => {
console.log("箭头函数", argu);
}; -
函数执行体当且仅当只有一行代码,中括号可以省略,并默认将这一行代码的执行结果作为返回值
const foo = argu => argu++ ;
-
函数执行体当且仅当只有一行代码,并且返回一个对象,可以省略一组中括号,并且要用小括号包起来
const foo = argu => ({name:'柏拉图',age:23});
特点
一、声明方式不同,匿名函数
-
声明一个普通函数需要使用关键字
function
来完成,并且使用function
既可以声明成一个具名函数也可以声明成一个匿名函数 -
声明一个箭头函数则只需要使用箭头就可以,无需使用关键字
function
,比普通函数声明更简洁 -
箭头函数只能声明成匿名函数,但可以通过表达式的方式让箭头函数具名
二、this指向不同
箭头函数 没有自己的 this
对象, 内部的 this
就是定义时上层作用域中的this
。也就是说,箭头函数内部的 this
指向是固定的,相比之下,普通函数的 this
指向是可变的。
三、箭头函数的this永远不会变,call、apply、bind也无法改变
我们可以用 call
、apply
、bind
来改变普通函数的 this
指向,但是由于箭头函数的 this
指向在它定义时就已经确定了,永远指向它定义时的上层作用域中的 this
,所以使用这些方法永远也改变不了箭头函数 this
的指向。
四、箭头函数没有原型prototype
因为箭头函数没有自己的 this
,它的 this
其实是继承了外层执行环境中的 this
,且 this
指向永远不会变,并且箭头函数没有原型 prototype
,没法让他的实例的 __proto__
属性指向,所以箭头函数也就无法作为构造函数,否则用 new
调用时会报错
五、箭头函数不能当成一个构造函数
六、没有new.target
new
是从构造函数生成实例对象的命令。ES6
为 new
命令引入了一个 new.target
属性,这个属性一般用在构造函数中,返回 new
调用的那个构造函数。如果构造函数不是通过 new
命令或 Reflect.construct()
调用的,new.target
会返回 undefined
,所以这个属性可以用来确定构造函数是怎么调用的。
七、箭头函数没有自己的arguments
-
箭头函数处于全局作用域中,则没有
arguments
: 箭头函数使用arguments则会报错,因为箭头函数自身是没有arguments的,然后它会往上层作用域中去查找arguments,由于全局作用域中并没有定义arguments,所以会报错 -
箭头函数处于普通函数的函数作用域中,
arguments
则是上层普通函数的arguments
: