由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数据




    




    




    




    

。

有很多前辈写的太高奥了



  




  




  




  



，  


  


  


  


，越看越迷都迷了    
     
     
     
    ，




   




   




   




   


，这里写个总结当备忘 



 



 



 



，足够用了                       ，以后有时间了学透了再补充