简单阐述对 This 的理解？ ​

题干 ​

• this

题解 ​

JS 中的 this 是一个特殊的关键字，它在不同的上下文中指向不同的值。

this 的值取决于调用模式：

• 全局上下文中的 this：当在全局作用域中使用 this 时，它指向全局对象（在浏览器中是 window 对象，在 Node.js 中是 global 对象）。

• 函数中的 this：当函数作为对象的方法调用时，this 指向调用该函数的对象。

🌰：

const obj = {
  name: 'Alice',
  sayHello: function() {
    console.log(`Hello, ${this.name}!`);
  }
};

obj.sayHello(); // 输出：Hello, Alice!

在上述例子中，sayHello 方法是作为 obj 对象的方法调用的，因此 this 指向 obj 对象。

• 构造函数中的 this：当使用 new 关键字调用构造函数创建对象时，this 指向新创建的对象。构造函数通常以大写字母开头，用于创建多个相似对象。

🌰：

function Person(name) {
  this.name = name;
}

const person1 = new Person('Bob');
console.log(person1.name); // 输出：Bob

在上述例子中，Person 函数是作为构造函数调用的，this 指向新创建的 person1 对象，并将 name 属性赋值为 'Bob'。

• 使用 call() 和 apply() 方法显式指定 this：JS 中的函数对象提供了 call() 和 apply() 方法，用于显式指定函数执行时的 this 值。

🌰：

function sayHello() {
  console.log(`Hello, ${this.name}!`);
}

const obj = {
  name: 'Alice'
};

sayHello.call(obj); // 输出：Hello, Alice!

在上述例子中，call() 方法将 sayHello 函数的执行上下文中的 this 指向了 obj 对象。

需要注意的是，箭头函数中的 this 与普通函数不同。箭头函数没有自己的 this，它会继承外部作用域的 this 值。这意味着在箭头函数中，this 的值由箭头函数定义的位置决定，而不是调用方式。

总的来说，this 是 JS 中的一个关键字，它的值取决于函数的调用方式。在全局上下文中，this 指向全局对象；在函数中，this 指向调用该函数的对象；在构造函数中，this 指向新创建的对象；通过 call() 和 apply() 方法可以显式指定函数执行时的 this 值；箭头函数继承外部作用域的 this 值。

相关 ​

箭头函数与普通函数的区别

什么是执行上下文、JS 有几种上下文

贡献者 ​

isboyjc