es6使用箭頭函式需要注意的問題

2022-08-21 17:15:14 字數 932 閱讀 2700

箭頭函式沒有它自己的this值,箭頭函式內的this值繼承自外圍作用域,誰定義的函式,this指向誰

對於箭頭函式來說,並沒有自己的this,它的this將始終指向讓它生效的物件,即它的外部呼叫者:

const obj1 = ,

normalfunc: function ()

}// obj1.arrowfunc 在全域性物件 window 下生效,指向 window

obj1.arrowfunc() // window

// 普通方式宣告的函式 this 指向持有這個函式的物件,即 obj1

obj1.normalfunc() // obj1

const obj2 = , 0)

},normalfunc: function () , 0)

}}// arrowfunc 中的箭頭函式在 obj2 下生效,指向 obj2

obj2.arrowfunc() // obj2

// normalfunc 中的匿名函式的 this 始終指向 window

obj2.normalfunc() // window

在函式中,可以通過arguments關鍵字來獲取到當前函式中傳入的引數,但是在箭頭函式中是沒有這個關鍵字的,該物件在函式體內不存在。如果要用,可以用 rest 引數代替。

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

不可以當作建構函式,也就是說,不可以使用new命令,否則會丟擲乙個錯誤。

// es6

function foo() , 100);

}// es5

function foo() , 100);

}

ES6使用箭頭函式注意點

新事物也是有兩面性的,箭頭函式有他的便捷有他的優點,但是他也有缺點,他的優點是 簡潔,this提前定義,但他的缺點也是這些,比如 太過簡潔,導致不好閱讀,this提前定義,導致無法使用js進行一些es5裡面看起來非常正常的操作。本質來說箭頭函式沒有自己的this,它的this是派生而來的,根據 詞法...

ES6箭頭函式的使用

箭頭函式是 es6 裡面乙個簡寫函式的語法方式 箭頭函式只能簡寫函式表示式,不能簡寫宣告式函式 functionfn 不能簡寫 const fun function 可以簡寫 const obj 可以簡寫 語法 函式的行參 constfn function a,b 可以使用箭頭函式寫成 const ...

es6箭頭函式

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