js 进程与线程的讲解

进程与线程 最通俗易懂讲解(前端/后端都必须懂)

这是计算机基础核心知识点,面试必问,和你写 Vue、React、Node.js 息息相关。

我用生活例子 + 代码场景讲,保证一听就懂。


一、先给你最核心结论(背会)

  1. 进程(Process)

    • 操作系统分配资源的最小单位
    • 一个程序运行,就是一个进程
    • 进程之间相互独立,互不干扰
  2. 线程(Thread)

    • 进程内的执行单元 ,CPU 调度的最小单位
    • 一个进程里至少有一个线程
    • 同一个进程内的线程共享内存/资源
  3. 一句话总结
    进程是工厂,线程是工人。
    一个工厂可以有多个工人,工人共享工厂资源。


二、超通俗生活例子(秒懂)

1. 进程 = 一个独立工厂

  • 打开 Chrome 浏览器 → 1 个进程
  • 打开 VS Code → 1 个进程
  • 打开 微信 → 1 个进程
  • 工厂之间完全独立,一个工厂倒闭,不影响其他工厂

2. 线程 = 工厂里的工人

  • 浏览器这个工厂里:
    • 工人A:渲染页面
    • 工人B:执行 JS 代码
    • 工人C:发送网络请求
  • 工人共享工厂资源(内存、数据、缓存)

三、前端最关心:浏览器 / JS 里的进程与线程

1. 浏览器是多进程

每开一个标签页,基本就是一个新进程

好处:一个标签页崩溃,整个浏览器不会崩

2. JS 是单线程的!(最重要)

JavaScript 引擎只有一个主线程执行代码。

  • 同一时间只能做一件事
  • 所以会有阻塞(比如死循环会让页面卡死)

这就是为什么:
JS 不能写耗时操作(复杂计算、同步请求),会卡住页面!


四、进程 vs 线程 对比表(面试必背)

对比项 进程 线程
本质 程序的运行实例 进程内的执行路径
资源 独立拥有内存、资源 共享进程资源
开销 创建/销毁开销大 创建/切换开销小
通信 进程间通信麻烦 线程间通信简单
稳定性 一个崩溃不影响其他 一个崩溃,整个进程都崩
例子 打开微信、浏览器 JS 主线程、渲染线程

五、最经典面试题(直接背答案)

1. 进程和线程的区别?

  • 进程是资源分配单位,线程是执行单位
  • 进程相互独立,线程共享资源
  • 进程开销大,线程开销小
  • 进程稳定性高,线程稳定性低

2. 为什么 JS 是单线程?

因为 JS 主要用来操作 DOM

如果是多线程:

  • 线程A删节点
  • 线程B改节点
    浏览器就乱套了
    所以 JS 设计成单线程,保证 DOM 操作安全。

3. 单线程 JS 怎么处理异步?(ajax/定时器/fetch)

EventLoop(事件循环) + 多线程协作

  • JS 主线程执行代码
  • 网络请求、定时器交给浏览器其他线程
  • 完成后再通知主线程执行回调

六、结合你学的 Vue3 / React18

  1. 不要在主线程做大量计算
    会阻塞渲染 → 页面卡顿
  2. 异步请求(axios/fetch)
    都是浏览器其他线程处理,不阻塞 JS
  3. WebWorker
    可以让 JS 开启多线程 ,处理复杂计算
    (但不能操作 DOM)

七、终极精简总结(10 秒记住)

  1. 进程 = 工厂,独立资源
  2. 线程 = 工人,共享资源
  3. 浏览器多进程,标签页互不影响
  4. JS 单线程,所以不能阻塞
  5. 异步靠 EventLoop,不是多线程 JS

总结

  • 进程是程序运行的独立容器
  • 线程是容器里干活的执行单元
  • JS 是单线程,所以要避免耗时同步操作
  • 异步(网络/定时器)是浏览器多线程配合完成
相关推荐
橙露19 小时前
JavaScript 异步编程:Promise、async/await 从原理到实战
开发语言·javascript·ecmascript
我命由我1234520 小时前
React Router 6 - 嵌套路由、路由传递参数
前端·javascript·react.js·前端框架·html·ecmascript·js
十六年开源服务商20 小时前
2026年WordPress网站地图完整指南
java·前端·javascript
英俊潇洒美少年21 小时前
MessageChannel 如何实现时间切片
javascript·react.js·ecmascript
技术钱1 天前
react数据大屏四种适配方案
javascript·react.js·ecmascript
李明卫杭州1 天前
JavaScript 严格模式下 arguments 的区别
前端·javascript
一次旅行1 天前
今日心理学知识分享(三)
开发语言·javascript·程序人生·ecmascript
牛十二1 天前
openclaw安装mcporter搜索小红书
开发语言·javascript·ecmascript
小金鱼Y1 天前
🔥 前端人必看:浏览器安全核心知识点全解析(XSS/CSRF/DDoS)
前端·javascript·安全
时寒的笔记1 天前
js逆向05_ob混淆花指令,平坦流,某麦网(突破ob混淆寻找拦截器)
开发语言·前端·javascript