【前端】JavaScript 中的 this 与全局对象 window深度解析

---

博客主页： [小ᶻ☡꙳ᵃⁱᵍᶜ꙳] 本文专栏: 前端

---

---

---

💯前言

• 在 JavaScript 中，this 是一个极为重要且复杂的关键字，其灵活的特性常常让初学者甚至中级开发者感到困惑，特别是在不同环境中，this 的指向可能会发生显著变化。在浏览器环境下，this 在全局作用域中通常指向 window 对象，这一点对于初次接触 JavaScript 的开发者来说尤其难以理解。本文将深入探讨 JavaScript 中 this 的工作原理，并解释为什么全局变量在浏览器中会成为 window 对象的属性。此外，我们还将分析严格模式下 this 的行为差异，以及在不同调用上下文中如何最佳实践 this 的使用。
  JavaScript

---

💯什么是 this？

在 JavaScript 中，this 是一个特殊的引用，通常用于指向当前的执行上下文或对象环境。this 的值并不是静态确定的，而是取决于函数的调用方式和调用位置。为了真正理解 this，我们需要深入了解 JavaScript 中不同调用方式所带来的上下文差异，以及它们对 this 指向的影响。

---

this 的多样性

JavaScript 中，this 的行为取决于其所处的执行上下文，以下是 this 常见的几种场景：

1. 全局上下文：
   在全局作用域中执行的代码（例如脚本最外层的代码），this 始终指向全局对象。在浏览器环境中，全局对象就是 window。例如：

   console.log(this); // 输出: window
   

   

   在这个例子中，代码执行在全局上下文中，因此 this 指向全局对象 window。这是 JavaScript 语言设计中的一个基本概念，旨在提供一种便捷的方式来访问全局对象及其属性和方法。

2. 函数调用：
   当函数在非严格模式下被直接调用时，this 会默认指向全局对象 window。例如：

   function f1() {
        
       console.log(this);
   }
   f1(); // 输出: window
   

   

   在上述代码中，f1() 函数是在全局环境中直接调用的，因此 this 指向全局对象 window。这种现象被称为“默认绑定”，是 JavaScript 中一种标准的绑定行为，确保函数在没有明确调用者的情况下，仍有一个合理的上下文。

3. 对象方法调用：
   当函数被作为对象的方法调用时，this 指向调用该函数的对象。如下所示：

   var obj =