由Vue管理的函式
例如：
computed計算屬性watch監視屬性filters (Vue3中已棄用且不再支持)過濾器- ....
上述屬性里配置的函式不要采用箭頭函式寫法，因為箭頭函式沒有自己的this物件，使用this時會向外找到window，不會指向Vue實體，也就呼叫不到Vue中的資料，
不被vue管理的函式
例如：
setTimeout計時器里的回呼函式setInterval定時器里的回呼函式ajax請求里的回呼函式- ....
上述回呼函式(除定時器外)使用普通函式定義的話，里面的this指向的是window，定時器中this指向undifined(這個死磕了老長時間，vscode沒提示，換webstorm除錯出來的...)
用箭頭函式時，this會向函式外找，找到Vue實體（因為在vue環境里嘛），
this指向大致分類
奉上 菜鳥教程(yyds) 里大佬總結的
- 在物件方法中， this 指向呼叫它所在方法的物件，
- 單獨使用 this，它指向全域(Global)物件，
- 函式使用中，this 指向函式的所屬者，
- 嚴格模式下函式是沒有系結到 this 上，這時候 this 是 undefined，
- 在 HTML 事件句柄中，this 指向了接收事件的 HTML 元素，
- apply 和 call 允許切換函式執行的背景關系環境（context），即 this 系結的物件，可以將 this 參考到任何物件，
附上 菜鳥中介紹this的直達鏈接：this詳解
總結
在Vue環境里：
- 由Vue管理的函式,盡量使用普通函式定義，
- 不被Vue管理的函式，盡量使用箭頭函式定義，
- 監視屬性里的普通函式，函式體里要使用定時器的話，要用箭頭函式來定義定時器，(舉個栗子)
這樣保證this總是指向Vue實體，可以呼叫到Vue資料，
有很多前輩寫的太高奧了，，越看越迷都迷了，，這里寫個總結當備忘，足夠用了，以后有時間了學透了再補充
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/499797.html
標籤：其他