美文网首页
43.进程和线程和事件循环

43.进程和线程和事件循环

作者: 静昕妈妈芦培培 | 来源:发表于2022-02-17 09:50 被阅读0次

操作系统-进程-线程

线程进程是操作系统中的两个概念:

  • 进程(process):计算机已经运行的程序,是操作系统管理程序的一种方式;
  • 线程(thread):操作系统能够运行运算调度的最小单位,通常情况下它被包含在进程中;

听起来很抽象,这里还是给出我的解释:

  • 进程:我们可以认为,启动一个应用程序,就会默认启动一个进程(也可能是多个进程);
  • 线程:每一个进程中,都会启动至少一个线程用来执行程序中的代码,这个线程被称之为主线程;
  • 所以我们也可以说进程是线程的容器;

再用一个形象的例子解释:

  • 操作系统类似于一个大工厂;
  • 工厂中里有很多车间,这个车间就是进程;
  • 每个车间可能有一个以上的工人在工厂,这个工人就是线程;
image.png

操作系统的工作方式

操作系统是如何做到同时让多个进程(边听歌、边写代码、边查阅资料)同时工作呢?

  • 这是因为CPU的运算速度非常快,它可以快速的在多个进程之间迅速的切换;
  • 当我们进程中的线程获取到时间片时,就可以快速执行我们编写的代码;
  • 对于用户来说是感受不到这种快速的切换的;

你可以在Mac的活动监视器或者Windows的资源管理器中查看到很多进程:


image.png

浏览器中的JavaScript线程

我们经常会说JavaScript是单线程的,但是JavaScript的线程应该有自己的容器进程:浏览器或者Node
浏览器是一个进程吗,它里面只有一个线程吗?

  • 目前多数的浏览器其实都是多进程的,当我们打开一个tab页面时就会开启一个新的进程,这是为了防止一个页 面卡死而造成所有页面无法响应,整个浏览器需要强制退出;
  • 每个进程中又有很多的线程,其中包括执行JavaScript代码的线程;

JavaScript的代码执行是在一个单独的线程中执行的:

  • 这就意味着JavaScript的代码,在同一个时刻只能做一件事
  • 如果这件事是非常耗时的,就意味着当前的线程就会被阻塞;

所以真正耗时的操作,实际上并不是由JavaScript线程在执行的:

  • 浏览器的每个进程是多线程的,那么其他线程可以来完成这个耗时的操作;
  • 比如网络请求定时器,我们只需要在特性的时候执行应该有的回调即可;

浏览器的事件循环

如果在执行JavaScript代码的过程中,有异步操作呢?

  • 中间我们插入了一个setTimeout的函数调用;
  • 这个函数被放到入调用栈中,执行会立即结束,并不会阻塞后续代码的执行;
function sum(m, n) {
  return m + n;
}
function bar() {
  return sum(20, 30);
}
setTimeout(() => {
  console.log("settimeout");
});

const res = bar();
console.log(res);

执行结果

50
settimeout
image.png

宏任务和微任务

但是事件循环中并非只维护着一个队列,事实上是有两个队列:

  • 宏任务队列(macrotask queue):ajax、setTimeout、setInterval、DOM监听、UI Rendering等
  • 微任务队列(microtask queue):Promise的then回调、 Mutation Observer API、queueMicrotask()等

那么事件循环对于两个队列的优先级是怎么样的呢?

  • 1.main script中的代码优先执行(编写的顶层script代码);
  • 2.在执行任何一个宏任务之前(不是队列,是一个宏任务),都会先查看微任务队列中是否有任务需要执行
    • 也就是宏任务执行之前,必须保证微任务队列是空的;
    • 如果不为空,那么就优先执行微任务队列中的任务(回调);

例1:

setTimeout(function () {
  console.log("setTimeout1");
  new Promise(function (resolve) {
    resolve();
  }).then(function () {
    new Promise(function (resolve) {
      resolve();
    }).then(function () {
      console.log("then4");
    });
    console.log("then2");
  });
});

new Promise(function (resolve) {
  console.log("promise1");
  resolve();
}).then(function () {
  console.log("then1");
});

setTimeout(function () {
  console.log("setTimeout2");
});

console.log(2);

queueMicrotask(() => {
  console.log("queueMicrotask1");
});

new Promise(function (resolve) {
  resolve();
}).then(function () {
  console.log("then3");
});



执行结果:

promise1
2
then1 
queueMicrotask1 
then3
setTimeout1
then2
then4
setTimeout2

例2:


async function async1() {
  console.log("async1 start");
  await async2();
  console.log("async1 end");
}

async function async2() {
  console.log("async2");
}

console.log("script start");

setTimeout(function () {
  console.log("setTimeout");
}, 0);

async1();

new Promise(function (resolve) {
  console.log("promise1");
  resolve();
}).then(function () {
  console.log("promise2");
});

console.log("script end");

执行结果:

script start
async1 start
async2
promise1
script end
async1 end
promise2
setTimeout


例3:

Promise.resolve()
  .then(() => {
    console.log(0);
    return 4;
  })
  .then((res) => {
    console.log(res);
  });

Promise.resolve()
  .then(() => {
    console.log(1);
  })
  .then(() => {
    console.log(2);
  })
  .then(() => {
    console.log(3);
  })
  .then(() => {
    console.log(5);
  })
  .then(() => {
    console.log(6);
  });

执行结果:

0
1
4
2
3
5
6

例4:

Promise.resolve()
  .then(() => {
    console.log(0);
    return {
      then(resolve) {
        console.log('then立即执行')
        resolve(4)
      }
    };
  })
  .then((res) => {
    console.log(res);
  });

Promise.resolve()
  .then(() => {
    console.log(1);
  })
  .then(() => {
    console.log(2);
  })
  .then(() => {
    console.log(3);
  })
  .then(() => {
    console.log(5);
  })
  .then(() => {
    console.log(6);
  });

执行结果:

0
1
then立即执行
2
4
3
5
6

例5:

Promise.resolve()
  .then(() => {
    console.log(0);
    return Promise.resolve(4);
  })
  .then((res) => {
    console.log(res);
  });

Promise.resolve()
  .then(() => {
    console.log(1);
  })
  .then(() => {
    console.log(2);
  })
  .then(() => {
    console.log(3);
  })
  .then(() => {
    console.log(5);
  })
  .then(() => {
    console.log(6);
  });

执行结果:

0
1
2
3
4
5
6

例6:

Promise.resolve()
  .then(() => {
    console.log(0);
    return new Promise(resolve => {
      console.log('promise回调立即执行')
      resolve(4)
    });
  })
  .then((res) => {
    console.log(res);
  });

Promise.resolve()
  .then(() => {
    console.log(1);
  })
  .then(() => {
    console.log(2);
  })
  .then(() => {
    console.log(3);
  })
  .then(() => {
    console.log(5);
  })
  .then(() => {
    console.log(6);
  });

执行结果:

0
promise回调立即执行
1
2
3
4
5
6

例7:

Promise.resolve()
  .then(() => {
    console.log(0);
    return Promise.resolve(4);
  })
  .then((res) => {
    console.log(res);
  });

Promise.resolve()
  .then(() => {
    console.log(1);
  })
  .then(() => {
    console.log(2);
  })
  .then(() => {
    console.log(3);
  })
  .then(() => {
    console.log(5);
  })
  .then(() => {
    console.log(6);
  });

Promise.resolve()
  .then(() => {
    console.log(7);
  })
  .then(() => {
    console.log(8);
  });

//执行结果:
// 0
// promise回调立即执行
// 1
// 7
// 2
// 8
// 3
// 4
// 5
// 6

node的事件循环

浏览器中的EventLoop是根据HTML5定义的规范来实现的,不同的浏览器可能会有不同的实现,而Node中是由libuv实现的。
这里我们来给出一个Node的架构图:

  • 我们会发现libuv中主要维护了一个EventLoop和worker threads(线程池);
  • EventLoop负责调用系统的一些其他操作:文件的IO、Network、child-processes等


    image.png

libuv是一个多平台的专注于异步IO的库,它最初是为Node开发的,但是现在也被使用到Luvit、Julia、pyuv等其他地方;

Node事件循环的阶段

我们最前面就强调过,事件循环像是一个桥梁,是连接着应用程序的JavaScript和系统调用之间的通道:

  • 无论是我们的文件IO、数据库、网络IO、定时器、子进程,在完成对应的操作后,都会将对应的结果和回调函数放到事件循环(任务队列)中;
  • 事件循环会不断的从任务队列中取出对应的事件(回调函数)来执行;

但是一次完整的事件循环Tick分成很多个阶段:

  • 定时器(Timers):本阶段执行已经被 setTimeout() 和 setInterval() 的调度回调函数。
  • 待定回调(Pending Callback):对某些系统操作(如TCP错误类型)执行回调,比如TCP连接时接收到 ECONNREFUSED。 pidle, prepare:仅系统内部使用。
  • 轮询(Poll):检索新的 I/O 事件;执行与 I/O 相关的回调;
  • 检测(check):setImmediate() 回调函数在这里执行。
  • 关闭的回调函数:一些关闭的回调函数,如:socket.on('close', ...)
image.png

Node的宏任务和微任务

我们会发现从一次事件循环的Tick来说,Node的事件循环更复杂,它也分为微任务和宏任务:

  • 宏任务(macrotask):setTimeout、setInterval、IO事件、setImmediate、close事件;
  • 微任务(microtask):Promise的then回调、process.nextTick、queueMicrotask;

但是,Node中的事件循环不只是 微任务队列和 宏任务队列:

  • 微任务队列:
    • next tick queue:process.nextTick; ü other queue:Promise的then回调、queueMicrotask; p 宏任务队列:
    • timer queue:setTimeout、setInterval; ü poll queue:IO事件;
    • check queue:setImmediate; ü close queue:close事件;

Node事件循环的顺序

所以,在每一次事件循环的tick中,会按照如下顺序来执行代码:

  • next tick microtask queue;
  • other microtask queue;
  • timer queue;
  • poll queue;
  • check queue;
    *close queue;
async function async1() {
  console.log("async1 start");
  await async2();
  console.log("async1 end");
}

async function async2() {
  console.log("async2");
}

console.log("script start");

setTimeout(function () {
  console.log("setTimeout0");
}, 0);

setTimeout(function () {
  console.log("setTimeout2");
}, 300);

setImmediate(() => console.log('setImmediate'))

process.nextTick(() => console.log('nextTick1'))

async1();
process.nextTick(() => console.log('nextTick2'))

new Promise(function (resolve) {
  console.log("promise1");
  resolve();
  console.log("promise2");
}).then(function () {
  console.log("promise3");
});

console.log("script end");

//执行结果:

script start
async1 start
async2
promise1
promise2
script end
nextTick1  
nextTick2
async1 end   
promise3
setTimeout0
setImmediate
setTimeout2

相关文章

  • 43.进程和线程和事件循环

    操作系统-进程-线程 线程和进程是操作系统中的两个概念: 进程(process):计算机已经运行的程序,是操作系统...

  • JS JavaScript事件循环机制

    JS JavaScript事件循环机制 首先区分进程和线程 进程是cpu资源分配的最小单位(系统会给它分配内存) ...

  • 5分钟搞懂事件循环

    事件循环 基础概念: 进程和线程. 什么是进程 程序是指令. 进程是程序的实体. 当我们打开电脑,查看任务管理器,...

  • 进程-线程-事件循环

    19.1 进程和线程 19.2 浏览器中的Javascript线程 浏览器的每一个tab页面就会开启一个新的进程,...

  • 事件循环机制

    想要了解javascript的事件循环机制,首先从基础概念出发;关于线程和进程 进程好比图中的工厂;有单独的的自己...

  • Node js事件循环

    Node js事件循环 //程序时如何工作的 /** Node js是单进程单线程,是通过事件和回调支持并发,所以...

  • 浏览器多进程和事件循环详解

    参考链接 由于网上的关于浏览器进程和JS进程、JS线程和事件循环之间的关系模糊不清,这里主要是查阅资料进行详细汇总...

  • node.js(七)

    Node.js 事件循环 Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高。No...

  • 线程和进程概念

    线程和进程 进程 线程 线程和进程的区别

  • Node事件循环和多进程

    nodejs事件循环与多进程 why 事件循环对于深入理解nodejs异步至关重要fs, net,http,eve...

网友评论

      本文标题:43.进程和线程和事件循环

      本文链接:https://www.haomeiwen.com/subject/bmtllrtx.html