一次读懂JavaScript执行上下文，助你进阶为前端高手

JavaScript执行上下文（Execution Context）是 JavaScript 程序运行时，代码执行的环境。它是 JavaScript 引擎在执行代码时创建的，并随着代码的执行而变化。

JavaScript 有两种执行上下文：

• 全局执行上下文 ：它是程序的入口点，在脚本开始执行时创建。
• 函数执行上下文 ：它是在函数被调用时创建的。

每个执行上下文都有自己的变量对象、作用域链和this值。变量对象存储着在该执行上下文中声明的变量，作用域链决定了变量的可见范围，而this值则指向当前执行上下文中的对象。

全局执行上下文

全局执行上下文在脚本开始执行时创建。它包含着所有的全局变量和函数。全局变量在脚本的任何地方都可以访问，而全局函数可以在脚本的任何地方被调用。

函数执行上下文

函数执行上下文是在函数被调用时创建的。它包含着函数的参数、局部变量和函数体。函数的参数在函数内部可以使用，局部变量只在函数内部可见，函数体是函数代码的主体。

this

this关键字的值取决于它所在执行上下文的类型。在全局执行上下文中，this的值为window对象。在函数执行上下文中，this的值为调用该函数的对象。

变量作用域

变量的作用域是指变量的可见范围。变量的作用域由它所在的执行上下文决定。在全局执行上下文中声明的变量具有全局作用域，在函数执行上下文中声明的变量具有局部作用域。

函数调用

当一个函数被调用时，JavaScript 引擎会为该函数创建一个新的执行上下文。这个新的执行上下文具有自己的变量对象、作用域链和this值。函数执行完成后，它的执行上下文就会被销毁。

执行栈

执行栈是一个数据结构，它存储着当前正在执行的函数的执行上下文。当一个函数被调用时，它的执行上下文会被压入执行栈。当函数执行完成后，它的执行上下文会被弹出执行栈。

内存分配

JavaScript 在执行代码时会分配内存。内存被分为两部分：堆和栈。堆存储着对象，栈存储着基本类型的值和函数的调用信息。

堆

堆是一个动态分配的内存区域，用于存储对象。对象在创建时被分配到堆中，并在不再需要时被释放。

栈

栈是一个静态分配的内存区域，用于存储基本类型的值和函数的调用信息。基本类型的值在创建时被分配到栈中，并在函数执行完成后被释放。函数的调用信息在函数被调用时被分配到栈中，并在函数执行完成后被释放。

垃圾回收

JavaScript 具有垃圾回收机制，用于回收不再需要的对象。垃圾回收机制会定期检查堆中的对象，并将不再需要的对象释放。

总结

JavaScript 执行上下文是一个关键的概念，它决定了变量的访问范围、函数的执行顺序以及this关键字的绑定。理解 JavaScript 执行上下文的工作原理对于编写出高质量的 JavaScript 代码非常重要。