es6新增了箭头函数, 先来看一个以前的例子
const add = function(a, b) {
console.log( this )
return a + b
}
add( 1 , 2 )
使用了箭头函数
const add = (a, b) => {
return a + b
}
如果是上面这样还可以简写为
const add = (a, b) => a + b
this指向问题
let obj = {
test(){
setTimeout(function(){
console.log(this)
})
}
}
obj.test()
通常情况下都是输出window
箭头函数(本身没有完整的执行上下文)和外层执行上下文共享this值, 来改进下代码:
let obj = {
test(){
setTimeout(() => {
console.log(this)
})
}
}
obj.test() // this => obj
箭头函数还有一个问题, 箭头函数不能创建一个闭包。先来看一个例子:
function test(){
return () => console.log(arguments)
}
test(1,2,3)(4,5)
按照正常的写法:
function test(){
return function(){
console.log(arguments)
}
}
test(1,2,3)(4,5)
这里应该输出的是4,5
如果使用了箭头函数这里却输出了1,2,3
还有一个容易出错的地方, 通常在使用map filter这些高阶函数的时候, 有时候要返回一个对象, 使用了箭头函数之后必须要加()否则就会报一个语法错误
let arr = [1,2,3].map( val => { number: val, isOK: true } ) ❌
let arr = [1,2,3].map( val => ({ number: val, isOK: true }) ) ✅
