函数中this指向的问题，理解这一篇就可以啦！！！

理解函数中this指向的问题

在 JavaScript 中，this 是指向当前执行上下文的引用。在函数中，this 指向调用函数的对象。这对于理解 JavaScript 中的对象和方法的用法非常重要。

普通函数中的this问题

• 结论： this 永远指向调用函数的对象。

• 直接通过代码进行分析，举例如下：

// 例1代码执行
function Person() {
  this.name = "John";
  function sayName() {
    console.log(this.name);
  }
  sayName();
}

// 输出结果：undefined

在例1中，我们定义了一个 Person 函数，并在其内部定义了一个 sayName 函数。当我们调用 Person() 函数时，this 指向 Person 函数本身。因此，当我们调用 sayName() 函数时，this 指向 Person 函数，而 this.name 的值为 "John"。

// 例2代码执行
const person = new Person();
person.sayName();

// 输出结果：John

在例2中，我们使用 new 关键字创建了一个 person 对象。当我们调用 person.sayName() 方法时，this 指向 person 对象。因此，this.name 的值为 "John"。

箭头函数中的this问题

• 结论： this 永远指向箭头函数的父作用域。

• 直接通过代码进行分析，举例如下：

// 例3代码执行
const person = {
  name: "John",
  sayName: () => {
    console.log(this.name);
  },
};

person.sayName();

// 输出结果：undefined

在例3中，我们定义了一个 person 对象，并在其内部定义了一个 sayName 箭头函数。当我们调用 person.sayName() 方法时，this 指向 person 对象的父作用域，也就是全局作用域。因此，this.name 的值为 undefined。

总结

• 在普通函数中，this 指向调用函数的对象。
• 在箭头函数中，this 指向箭头函数的父作用域。

理解this指向问题的小技巧

• 记住，this 永远指向调用函数的对象。
• 如果遇到问题，可以尝试使用 console.log(this) 来查看 this 的值。
• 箭头函数的 this 指向其父作用域，而不是函数本身。

希望这篇文章对您理解函数中 this 指向的问题有所帮助。如果您还有任何问题，请随时留言。

SEO优化