小程式中使用箭頭函式的問題

2021-09-11 21:55:28 字數 678 閱讀 9825

做了乙個專案, 因為只有乙個頁面, 不想引入redux, 同時因為所有邏輯擠在了同頁面的js下面, 對於後續的除錯bug很不友好, 因此想到了把js函式拆分出去.

import send from '../../utils/send.js'

...send,

...export default () =>

///複製**

當我執行**的時候發現this為undefined, 當時很不理解, 為什麼會出現這種問題, 在index中呼叫的send函式, 他的this指向理應是page中的this啊, 以為記憶出錯了, 隨後使用了bind,call,aplly等方法來繫結this, 然而全部無效. 此時只好祭出搜尋**, 在查詢資料的時候, 看到了這句話:

當我們使用箭頭函式的時候,函式體內的this指向就是定義時所在的物件,而不是使用時候所在的物件,並不是因為箭頭函式內部有繫結this的機制,而是箭頭函式沒有自己的this,他的this是繼承外面的,因此他的內部this就是外部**層的this

原部落格位址

恍然大悟,改寫了send.js方法, 解決了這個問題.

export defualt function

send

()複製**

map中使用箭頭函式遇到的坑

箭頭函式提供了更簡潔和更短的語法,其中乙個可用功能是可以將函式編寫為具有隱式返回值的lambda表示式。這對於功能樣式 很方便,比如使用函式對映陣列 const numbers 1,2,3,4 numbers.map n n n 這個箭頭函式將按照預期的方式工作,它將值自身相乘並返回到包含的新陣列 ...

箭頭函式this的問題

箭頭函式沒有自己的this物件,所以在箭頭函式取this的時候就是定義時上層作用域中的this function foo 100 var id 21 foo 21 這時候foo的this指向window foo.call 42 foo的this指向並且箭頭函式時向上找最近的定義時上層作用域 var ...

箭頭函式及箭頭函式中this的使用

1.定義函式的方式 function const aaa function 3.es6中的箭頭函式 const ccc 引數列表 3.1 有乙個引數 括號可省略 const sum num1 3.2 有兩個引數 const sum num1,num2 3.3 函式 塊中有多行 時 依次寫 const...