JavaScript中的箭頭函數與常規函數

箭頭功能與JS中的常規功能有何不同?


自JavaScript誕生以來,常規函數就是“老派”函數:

function run() {

}

它們可以直接運行:

run()

或者可以將它們分配給變量:

const run = function run() {

}

run()

這樣做時,該功能可以匿名:

const run = function () {

}

run()

唯一的區別是,現在在出現錯誤時出現的堆棧跟踪中,您將不再看到函數名稱。

2015年ES6中引入的Arrow函數有點像最後一個常規函數版本,因為它們沒有名稱。絕不。

語法“足跡”較小:

const run = () => {

}

run()

如果有一個參數,則可以省略括號:

const run = param => {

}

run()

如果只有一條語句,我們也可以省略花括號:

const run = param => 'running'
run()

在這種情況下,返回值是字符串'running'

箭頭函數和常規函數都可以用作對象方法。

現在,這兩個功能之間的最大區別在於this綁定在一個方法中。

考慮以下示例:

const car = {
  brand: 'Ford',
  model: 'Fiesta',
  start: function() {
    console.log(`Started ${this.brand} ${this.model}`)
  },
  stop: () => {
    console.log(`Stopped ${this.brand} ${this.model}`)
  }
}

this在裡面start()方法是指對象本身。

但是在stop()方法,這是一個箭頭函數,不是。

this沒有綁定到對象實例。它指出了什麼this指向外部範圍。

這意味著箭頭功能不適用於對象方法當您想訪問時this

免費下載我的JavaScript初學者手冊


更多js教程: