javascript中this指向问题

之前在开发vue的时候,我经常碰到这样的问题:
在$http.post或者get内部的回调函数中无法使用this.xxx来获取data中的值或者改变data中的值
解决的方法就是在post或get外部 let that = this 从而在内部就能使用that.xxx来获取data中的值
之前知其然而不知其所以然,今天在复习JavaScript知识的时候梳理了一下this的有关知识

首先致谢阮一峰大佬的文章http://www.ruanyifeng.com/blog/2018/06/javascript-this.html

this有关的问题主要是出在在函数中调用this的情况

let func = function () {
    console.log(this.toString())
}

let obj = new Object()
obj.func = func

func()
obj.func()

以下是在nodejs中的运行结果,在浏览器中结果也是大同小异

[object global]
[object Object]

可以看到直接调用func返回的是global对象,而通过obj调用func返回的是obj这个对象
这里借用阮一峰大佬的图的来解释一下
javascript中this指向问题_第1张图片
函数的定义是单独存储于一块内存的,默认下所属于全局对象,但是可以把一个指针指向该函数,那么该函数就归拥有指针的对象所有了,上图是调用全局的foo函数,那么返回的自然是全局范围内的x
javascript中this指向问题_第2张图片
这幅图调用obj.foo 返回的是obj对象内的x

你可能感兴趣的:(JavaScript)