持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第16天，点击查看活动详情
🥙前言
看了这篇文章，麻麻再也不用担心我不理解JS中this的指向问题了。本文以文章目录为顺序，层层递进。耐心的看完，会有很大的收获。
🦪正文
一、this的作用？我们为什么要用this，没它不行吗？
从某些角度来说，开发中如果没有this，很多问题也有其他的解决办法。 但是没有this，会让我们编写代码变得非常不放便。 多说无益，举个栗子 看看就知道了，示例代码如下：
var obj = {
name: '张三',
eating () {
console.log(obj.name + '在吃饭')
},
studying () {
console.log(obj.name + '在学习')
},
running () {
console.log(obj.name + '在跑步')
}
}
obj.eating()
obj.studying()
obj.running()
复制代码
上述示例代码，如果我们修改了变量obj名字为object，之后需要修改的代码有以下两处：
首先，需要修改的代码有方法的调用。
其次，就是在eating、studying、running三个方法中打印语句中的变量名
如果我们的obj对象中不止三个方法呢？如果是一百个方法呢？一个一个改，杀了我吧（裂开）。 如下示例代码，展示了使用this进行优化的效果：
var obj = {
name: '张三',
eating () {
console.log(this.name + '在吃饭')
},
studying () {
console.log(this.name + '在学习')
},
running () {
console.log(this.name + '在跑步')
}
}
obj.eating()
复制代码
优化后的代码不管我们怎么改变变量名称 ，我们需要修改的地方只有一个，那就是方法调用时的对象名称。是不是简便了许多，为编程的效率提升的不止一点哦。
二、this在全局作用域中指向哪里？
其实在大多数情况下，this都是出现在函数中。但也有出现在全局作用域下的情况，我们就来举个栗子说一说。
示例代码如下：
var name = 'code'
console.log(this)
console.log(this.name) // 输出 code
console.log(window.name) // 输出 code
复制代码
浏览器下输出结果如下图所示： 由图可知，全局作用域下，浏览器环境中：this指向的是全局对象window。
这里需要补充一下的是，在全局作用域下，node环境中，this指向的是一个
空对象{}。
三、同一个函数中this的不同指向
先看代码，再做结论。
如下示例代码展示了不同的调用方法，得到的this的不同指向。示例代码如下：
// 定义一个函数
function foo () {
console.log(this)
}
// 调用方式一：直接调用
foo() // this指向：window
// 调用方式二：间接调用
var obj = {
name: '张三',
fn: foo
}
obj.fn() // this指向：obj对象
// 调用方式三：通过call/apply调用
foo.call('123') //this指向： String {‘123’}对象
复制代码
浏览器输出结果如下所示： 如上所示，三个不同的调用方法，得到了三个不同的this指向。
结论: 1.函数在调用时，JavaScript会默认给this绑定一个值； 2.this的绑定值与定义的位置没有关系； 3.this的绑定和调用方式以及调用的位置没有关系； 4.this是在运行时被绑定的，而不是在定义时。
🥑文末
⏳
✨
👍
⭐️
✏️
