EP-01 | JavaScript 的工作原理 🔥& 执行上下文

Source: Dev.to

什么是执行上下文？（通俗易懂）

把执行上下文想象成 JavaScript 工作的教室。

在这个教室里：

• 白板 – 所有重要的笔记（变量和函数）都写在这里 → 内存组件
• 老师 – 一条一条地读取并执行指令 → 执行线程

1. 内存组件（变量环境）

通俗含义
JavaScript 在运行代码之前存放数据的地方。

生活实例
想象你走进教室，老师在黑板上写下名字：

studentName = "Ali"
age = 10
greet = function(){...}

黑板就是内存组件，存放数据，等课堂开始前使用。

2. 代码组件（执行线程）

通俗含义
JavaScript 按行执行代码的部分，就像老师一次读完一条指令。

生活实例
在黑板（内存）写好后，老师开始阅读笔记本：

1. 向学生打招呼
2. 讲解课程内容
3. 提出问题
4. 等待回答
5. 进行下一条指令

老师不能同时读两行，这就是执行线程。

3. JavaScript 是同步且单线程的

通俗含义
JavaScript 一次只做一件事，并且按顺序进行。

生活实例
想象一个学生大声朗读一本书。他必须读完一句才可以开始下一句，不能同时读两句。这就是 JavaScript 的工作方式——一步一步、逐条执行。

完整的生活实例——把所有概念放在一起

var name = "Sara";

function sayHi() {
  console.log("Hi " + name);
}

sayHi();

生活拆解

• 内存组件（白板）
  • name: "Sara"
  • sayHi: function
• 执行线程（老师阅读步骤）
  1. 跳到 sayHi()
  2. 执行它 → 打印 "Hi Sara"

JavaScript 在继续下一行之前会先完成上述过程。