js的线程机制

简介: 进程线程,我们在大学的时候,操作系统中就已经非常熟悉了,我们可以做个简单的回顾。

网络异常,图片无法展示
|

进程线程,我们在大学的时候,操作系统中就已经非常熟悉了,我们可以做个简单的回顾。


概念回顾


进程与线程


进程:程序的一次执行,它占有一片独有的内存空间。


线程:进程内的一个独立的执行单元。是程序执行的一个完整流程。是CPU的最小调度单元。


多进程运行:一个应用程序可以启动多个实例运行


多线程:一个进程内,同时有多个线程运行。


应用程序必须运行在某个进程的某个线程上;一个进程中至少有一个运行的线程:主线程(进程启动后自动创建);一个进进程也可以同时运行多个线程即多线程运行;一个进程内的数据可以给多个线程共享,多进程之间的数据不能直接共享;线程池:保存多个线程对象的容器,实现线程对象的反复利用。


线程优缺点:


多线程


优点:

  • 有效提升CPU的利用率


缺点:

  • 开销较大
  • 线程间切换存在开销
  • 死锁和同步问题


单线程


优点:

  • 顺序编程,简单易懂


缺点:

  • 效率较低

js是单线程运行的!最初是为解决表单提交验证而存在的。

浏览器有多进程(chrome、新IE),也有单进程(老IE、firefox)。

浏览器是多线程运行的。


浏览器内核


内核:支撑浏览器运行的最核心的程序。


类型:

  • Chrome、Safari:webkit
  • firefox:Gecko
  • IE:Trident
  • 360、搜狗:Trident(牵扯到支付安全性的)+ webkit


组成模块:


主线程:

  • js引擎模块:负责js程序的编译与运行
  • html、css文档解析模块:负责页面文本的解析
  • DOM/CSS模块:负责dom/css在内存中的相关处理
  • 布局和渲染模块:负责页面的布局和效果的绘制(内存中的对象)


分线程:

定时器模块、DOM事件响应模块、网络请求模块(ajax)


js的单线程


js是单线程的吗?怎么证明它是单线程呢?它为什么是单线程,不是多线程呢?它可以是多线程的吗?

这一连串的问题,又该如何回答?


定时器


首先,我们先来看下定时器(可以证明js是单线程的)。

定时器并不能保证真正的定时器执行,一般会有一点延迟或者很长时间的延迟。

网络异常,图片无法展示
|

使用setTimeout,刷新浏览器每次时间都是在200毫秒左右,很少会有准确的200毫秒。

let start = Date.now()
setTimeout(() => console.log('延迟实际时间:', Date.now() - start), 200)
for (let i = 0; i < 1000000000; i++) { }

如果在后面添加数组使用,让浏览器做一个长时间任务。

网络异常,图片无法展示
|

可以看到原本的200毫秒,变成了700多毫秒。

所以说定时器并不能保证真正的定时执行。


定时器回调函数是在主线程中执行,这牵扯到js内部的运行机制:同步任务和异步任务,先执行同步的for循环任务,之后才回去执行异步的setTimeout任务。


js单线程详细


console.log('start');
setTimeout(() => console.log('setTimeout延迟'), 0)
console.log('end');
// start
// end
// setTimeout延迟


setTimeout的回调函数是在主线程中执行的,定时器回调函数只有在运行栈中的代码全部执行完成后才有可能执行。 从上例可以看出,js会先执行同步输出,之后才会执行setTimeout内部的回调。


js的单线程是与它的功能有关。js主要是与用户、浏览器进行交互,以及DOM 的操作。

如果js是多线程的,那么两个线程同时操作一个DOM节点,一个线程想要更新这个DOM,一个线程想要删除这个DOM。如果先删除了这个DOM节点,那么就无法更新这个节点。


在H5中,虽然增加了多线程(Web Workers),但是始终只能由一个主线程去更新操作界面(否则会增加复杂度)。因为Web Workers内代码不能操作DOM更新UI(workers内无window)。

此外Web Workers不是每个浏览器都支持这个特性,并且不能跨域加载js。

目录
相关文章
|
1月前
|
存储 JavaScript 前端开发
深入理解JavaScript中的事件循环(Event Loop):机制与实现
【10月更文挑战第12天】深入理解JavaScript中的事件循环(Event Loop):机制与实现
76 3
|
2月前
|
JavaScript 安全 前端开发
乾坤js隔离机制
乾坤js隔离机制
|
11天前
|
JavaScript 安全 中间件
深入浅出Node.js中间件机制
【10月更文挑战第36天】在探索Node.js的奥秘之旅中,中间件的概念如同魔法一般,它让复杂的请求处理变得优雅而高效。本文将带你领略这一机制的魅力,从概念到实践,一步步揭示如何利用中间件简化和增强你的应用。
|
23天前
|
Java
线程池内部机制:线程的保活与回收策略
【10月更文挑战第24天】 线程池是现代并发编程中管理线程资源的一种高效机制。它不仅能够复用线程,减少创建和销毁线程的开销,还能有效控制并发线程的数量,提高系统资源的利用率。本文将深入探讨线程池中线程的保活和回收机制,帮助你更好地理解和使用线程池。
48 2
|
23天前
|
消息中间件 JavaScript 中间件
深入浅出Node.js中间件机制
【10月更文挑战第24天】在Node.js的世界里,中间件如同厨房中的调料,为后端服务增添风味。本文将带你走进Node.js的中间件机制,从基础概念到实际应用,一探究竟。通过生动的比喻和直观的代码示例,我们将一起解锁中间件的奥秘,让你轻松成为后端料理高手。
27 1
|
27天前
|
Java
在Java多线程编程中,`wait()` 和 `notify()/notifyAll()` 方法是线程间通信的核心机制。
在Java多线程编程中,`wait()` 和 `notify()/notifyAll()` 方法是线程间通信的核心机制。它们通过基于锁的方式,使线程在条件不满足时进入休眠状态,并在条件成立时被唤醒,从而有效解决数据一致性和同步问题。本文通过对比其他通信机制,展示了 `wait()` 和 `notify()` 的优势,并通过生产者-消费者模型的示例代码,详细说明了其使用方法和重要性。
25 1
|
1月前
|
安全 Java 开发者
在多线程编程中,确保数据一致性与防止竞态条件至关重要。Java提供了多种线程同步机制
【10月更文挑战第3天】在多线程编程中,确保数据一致性与防止竞态条件至关重要。Java提供了多种线程同步机制,如`synchronized`关键字、`Lock`接口及其实现类(如`ReentrantLock`),还有原子变量(如`AtomicInteger`)。这些工具可以帮助开发者避免数据不一致、死锁和活锁等问题。通过合理选择和使用这些机制,可以有效管理并发,确保程序稳定运行。例如,`synchronized`可确保同一时间只有一个线程访问共享资源;`Lock`提供更灵活的锁定方式;原子变量则利用硬件指令实现无锁操作。
20 2
|
1月前
|
JSON JavaScript 中间件
深入浅出Node.js中间件机制
本文将带你探索Node.js中一个核心概念——中间件机制。我们将通过浅显的语言和生动的比喻,揭示中间件如何作为请求和响应之间的“交通枢纽”,在应用程序中起到至关重要的作用。从基础原理到实际应用,你将了解到中间件不仅简化了代码结构,还提高了开发效率,是Node.js开发不可或缺的一部分。
49 1
|
1月前
|
JavaScript 前端开发 开发者
原型链深入解析:JavaScript中的核心机制
【10月更文挑战第13天】原型链深入解析:JavaScript中的核心机制
30 0
|
1月前
|
JavaScript 安全 中间件
深入浅出Node.js中间件机制
【10月更文挑战第4天】在探索Node.js的海洋中,中间件机制犹如一座灯塔,为开发者指引方向。本文将带你一探究竟,从浅入深地理解这一核心概念。我们将通过生动的比喻和实际代码示例,揭示中间件如何在请求和响应之间搭建桥梁,实现功能的扩展与定制。无论你是初学者还是有经验的开发者,这篇文章都将为你提供新的视角和深入的理解。
47 0
下一篇
无影云桌面