箭头函数在平时开发中用着非常爽,箭头函数有什么特点呢
- 箭头函数不能够当做构造函数使用
- 箭头函数没有arguments对象
- 箭头函数不能够用yield,不能用作generator函数
- 箭头函数没有prototype属性,prototype属性值为空
箭头函数的this总是指向最近一层的作用域
举个例子,总所周知普调函数的this指向都是谁调用他指向谁
var name ="张三"
var obj = {
name: '李四',
getName: function() {
console.log(this.name)
return function(){
console.log(this.name)
}
}
}
obj.getName()()
// 输出结果
// 李四
// 张三
因为obj.getName()
相当于是obj调用的,所以里面的this
指向obj,obj.getName()()
相当于是window调用的
obj.getName()()
// 等价于
var fn = obj.getName()
window.fn()
另外一个例子
var name ="张三"
var obj = {
name: '李四',
getName: function() {
console.log(this.name)
return s = () =>{
console.log(this.name)
}
}
}
obj.getName()()
// 输出结果
// 李四
// 李四
在getName中返回一个箭头函数,因为箭头函数是在getName中,getName是它的一个上最近的一个函数作用域,所以箭头函数中的this指向obj。另外一个例子
var name ="张三"
var obj = {
name: '李四',
getName: () => {
console.log(this.name)
return s = () =>{
console.log(this.name)
}
}
}
obj.getName()()
会输出什么结果,大部分人可能跟我一样会认为会输出
李四 李四 // 其实最终的结果是张三 张三
刚开始都以为getName这个箭头函数是指向的object,其实不然,它是指向window的。箭头函数的this是 根据该函数的作用域指向的对象,作用域是指函数内部,getName作用域其实是指最外层的js环境,因为getName没有被函数包裹,最外层又是指向window
- 箭头函数使用
call applay
等改变this的指向也是没有用的,比如
var name ="张三"
var obj = {
name: '李四',
getName: () => {
console.log(this.name)
}
}
var obj1 = {
name: '李四',
getName: function() {
console.log(this.name)
}
}
obj.getName.call({name: '王五'}) // 张三
obj1.getName.call({name: '王五'}) // 王五