JavaScript 内部机制:理解核心原理 ✨

JavaScript 是一种不可思议的语言,我们每天都在使用它,却并不了解其背后发生了什么。让我们深入探讨 JavaScript 的工作原理,揭开其面纱。

基础:单线程执行

在核心层面,JavaScript 是一种单线程、同步语言,这意味着它一次处理一个任务,在一个线程中执行。

尽管 JavaScript 是单线程的,但它具有异步能力,使其看起来像是多线程。

JavaScript 运行时解剖:

每个 JavaScript 运行时都包含三个关键组件,它们协同工作:

1- 调用栈:

  • 一种数据结构,用于跟踪正在执行的函数。它遵循后进先出(LIFO)的原则------最后添加的函数先被移除。
  • 栈底是全局执行上下文,即全局代码的环境,随着函数被调用,它们的执行上下文被堆叠在顶部。

2- 内存堆:

  • 在程序执行期间,用于存储对象、数组和其他复杂数据结构。
  • JavaScript 使用垃圾回收来释放对象所占用的内存。

3- 执行上下文:

  • 执行上下文是一种特殊环境,用于处理 JavaScript 代码的执行。
  • JavaScript 有一个全局执行上下文,以及每个被调用函数的函数执行上下文。

执行上下文的阶段:

1- 内存创建阶段:

  • 创建全局对象(在浏览器中是window,在 Node.js 中是global)。
  • 将this关键字绑定到全局对象。
  • 创建变量并声明:
    • 对于var声明:分配内存并初始化为undefined(变量提升)
    • 对于let和const声明:分配内存但保持在临时死区(未初始化)

2- 执行阶段:

  • 逐行执行代码。
  • 为变量分配实际值。
  • 为函数调用创建新的执行上下文。

异步 JavaScript:事件循环和队列

JavaScript 的异步性通过以下机制实现:

任务队列(宏任务队列)

  • 一个先进先出(FIFO)的队列,用于存放已准备好执行的回调。

微任务队列

  • 一个优先级更高的队列,用于promise和其需要在下一个任务之前处理的微任务。

事件循环

  • 事件循环是 JavaScript 中异步编程的基础:
  • 它持续检查调用栈是否为空。
  • 如果调用栈为空,它会先查看微任务队列。
  • 处理完微任务后,它会检查任务队列。
  • 它会将队列中的第一个回调取出并推入调用栈。

结论

理解 JavaScript 的内部工作原理有助于你编写更高效的代码。从其单线程特性到事件循环和执行上下文,这些基本概念构成了 JavaScript 行为的骨干。

掌握这些概念后,你将更深入地了解 JavaScript 代码的实际执行过程。

快乐编码 😊

原文:dev.to/alaa-samy/j...

相关推荐
前端精髓14 小时前
调用openrouter的免费API模型
java·前端·javascript
赛博守夜人14 小时前
AI安全攻防与治理之十四:AI 安全测试不能脱离传统安全,Web、API、移动端与模型攻击面的组合拳
前端·人工智能·安全
开开心心_Every14 小时前
快速隐藏程序工具自定义快捷键一键切换
java·开发语言·前端·spring·智能手机·word·intellij-idea
networknomad15 小时前
OpenReplay:自己搭的会话回放工具,给前端排错用的
前端·其他
缓慢更新15 小时前
AI 辅助生成单测:从接口定义到用例的流水线
java·服务器·前端·网络·数据库·人工智能
陈随易16 小时前
AI 运维服务器,安全又可靠的方法
前端·后端·程序员
风骏时光牛马17 小时前
AI稳定性治理体系构建与疑难问题深度分析
前端
IT_陈寒17 小时前
JavaScript的this坑人实录,这次我真的记下来了
前端·人工智能·后端
开开心心就好18 小时前
音频降噪剪辑工具,音量裁剪一键处理
运维·服务器·前端·spring·ocr·音视频·1024程序员节
PedroQue9920 小时前
0.8.2 新增 backFallback 配置,无 tabbar 页返回无忧
前端·uni-app