关于vue的this指向问题
问题
关于vue的this指向问题
由大模型辅助整理，保留原意，优化结构与可读性。
问题概述
提问者在 Vue 项目中遇到了 this 指向的疑问：为什么在某些函数内部访问的 this 与预期不一致，涉及函数作用域下 this 的绑定规则。
涉及技术
JavaScript、Vue、this 绑定
期望结果
希望系统性理解 this 在普通函数、箭头函数、严格模式等不同场景下的指向规则，以及如何通过 bind 等方式修正 this 指向。
回答
原始回答
2019-10-18
function的作用域呗
想改变可以用bind。也可以用箭头函数=>
更新时间 2019年10月18日14:43:55
我看这个问题还在一直回复，我再来完善一下我的答案
我们来思考一个问题，this指向谁？
全局状态下
function中
function中、并赋值给某个对象
function中、并赋值给某个对象，之后赋值给另外一个对象并调用
上面只是常规状态，那么严格模式下呢？
留下一道相似的题，当this改变的时候，a也会切换到this的环境中吗？为什么？
先来写一下结论吧。通常this会指向调用他的对象，如果没有会指向windows，如果严格模式下指向undefined。结合这个规则回去看看上面的问题吧。
AI 优化 · 回答整理
解答思路
this 指向的本质是「函数的作用域规则」：普通函数中的 this 由调用方式决定，若指向出现偏差，可以用 bind 显式绑定，或直接改用箭头函数，因为箭头函数不会创建自己的 this，而是继承定义时所在作用域的 this。
详细说明
按常见场景梳理 this 的指向规律：
- 全局环境下：非严格模式中
this指向window（浏览器环境），严格模式下为undefined。 - 普通 function 内部：
this由调用方式决定，直接调用时指向全局对象（非严格模式）或undefined（严格模式）。 - function 作为某个对象的方法调用：
this指向调用该方法的对象，例如obj.fn()中this指向obj。 - 方法被赋值给其他对象后再调用：
this会指向新的调用者，而不是原来定义时所在的对象，这也是很多「this 丢失」问题的根源。
概括结论：this 通常指向调用它的对象；如果没有明确的调用者，则指向 window（非严格模式）或 undefined（严格模式）。这也是 Vue 组件方法中经常需要用箭头函数或 bind 来保证 this 正确指向组件实例的原因——因为普通函数在被作为回调（如 setTimeout、事件监听）传递时，调用者往往不再是组件实例本身。
小结
this 的指向取决于函数被「如何调用」，不是「在哪里定义」。理解「调用者决定 this」和箭头函数「继承外层 this」这两条规则，就能解释绝大多数 Vue 组件中的 this 指向问题；改变指向可以用 bind/call/apply 或箭头函数。
由大模型辅助整理，保留原意，补充结构与代码格式。
回答转载自 SegmentFault