箭头函数

160 阅读1分钟

箭头函数是匿名函数,所以它一般是函数表达式的形式,以后一般作为回调函数

语法

let 函数名 = (参数) => {
    函数体
}
let getSum = (a,b) => {
    let sum = a + b
    return sum
}
let sum = getSum(1,2)
console.log(sum)

语法细节

如果参数只有一个,可以省略()

let test = name => {
    console.log(`我的名字叫${name}`)
}
test('jack')

如果函数体只有一句且需要返回,则可以省略{},同时箭头函数会自动返回

// 有{}需要手动返回,没有{}不能添加return
let getSum = (a, b) => a + b
      
let sum = getSum(1, 2)
console.log(sum)

特性

let obj = {
  name: 'jack',
  say: () => {
    // 1.箭头函数本身不产生this,(只有function会产生this)
    // 2.箭头函数中的this指向    创建这个箭头函数所在对象(obj)   的上下文(window)
    console.log(this)
  }
}
obj.say()
let fn = obj.say
fn()
let temp = {
  name: 'rose'
}
obj.say.call(temp)

但是我们想让this可以指向obj,在箭头函数外在包一层函数即可

let obj = {
  name: 'jack',
  say: function() {
    return () => {
      console.log(this)
    }
  }
}
let fn = obj.say()
fn()
fn.call(temp)