ES6箭頭函式常見考點與注意事項

2021-09-17 01:20:43 字數 1982 閱讀 6424

2.注意事項(與普通函式的區別)

3.箭頭函式獲取引數

4.箭頭函式中this的指向

《es6標準入門第三版》

基本使用

varf=

()=> console.

log(

'hello')f

()//輸出 hello

如果箭頭函式不需要引數或需要多個引數, 就使用圓括號代表引數部分

// 沒有引數,()必不可少()

=> console.

log(

'hello'

)// 乙個引數,()可以省略

letfoo

= v => v

console.

log(

foo(5)

)// 5

// 多個引數,() 必不可少

letfoo

=(a,b)

=> console.

log(a+b)

foo(1,

2)// 3

箭頭函式有多行語句 需要使用 把語句包裹起來,單行不需要

let

foo=

(a,b)

=>

foo(1,

2)// 6

如果語句部分不加 預設生成的結果為 return 語句部分的返回值,如果加了就代表是乙個語句,不會自動返回語句的值。

let

foo=

(a,b)

=> a+b

let a =

foo(1,

2) console.

log(a)

// 3

// 可以表示為

function

foo(a,b)

letfoo

=(a,b)

=>

let ret =

foo(1,

2) console.

log(ret)

// undefined

//等同於

function

foo(a,b)

也可以稱作箭頭函式與普通函式的區別,主要有四點:

箭頭函式體內的 this 物件就是定義時所在的物件,而不是使用時候的物件

不可以當作建構函式 new 不可用。箭頭函式不能用 new 關鍵字來例項化物件,否則報錯。

不可以使用 arguments 物件,該物件在函式體內不存在,如果要用,可以用 rest 引數代替.

不可以使用 yield 命令,因此箭頭函式不能用作 generator 函式.

由於箭頭函式中沒有 arguments 物件, 沒辦法取得引數列表, 需要借助 rest 引數來獲取引數。

const

numbers=(

...nums)

=> nums

console.

log(

numbers(1

,2,3

,4,5

))// [1,2,3,4,5]

補充:rest引數的解釋

es6引入了 rest 引數(形式為"…變數名"),用於獲取函式的多餘引數,這樣就不需要使用 arguments 物件了。rest 引數搭配的變數是乙個陣列,該變數將多餘的引數放入其中。

settimeout 方法是掛在window物件下的, settimeout 中所執行函式中的 this,永遠指向 window 物件。

function

foo(),

100)

;var id =21;

}foo.

call()

;// id 21

function

foo(

)foo.

call()

;// id 42

es6箭頭函式

本例是在了解es6知識後在原來定義函式的基礎上進行理解var searchvalue 查詢匹配物件 var button var input var select button if searchvalue.input undefined button.click else 重新整理 tableli...

es6 箭頭函式

1.單引數 function cheng a 3 let cheng a 3 a a console.log cheng 9 2.多引數 function add a,b let add a,b a b 預設返回值 console.log add 3,9 3.無返回值 function add a,...

ES6 箭頭函式

es6 中,箭頭函式就是函式的一種簡寫形式,使用括號包裹數,跟隨乙個 緊接著是函式體 var getprice function 箭頭函式 var getprice 9.15 箭頭函式不僅僅是讓 變得簡潔,函式中 this 總是繫結總shi 指向物件自身 function person 1000 使...