首页 🚓JavaScript

js运行机制

同步程序按顺序执行

console.log(1);
console.log(2);
console.log(3);
1
2
3

异步执行程序

console.log(1);
// 异步自习程序
setTimeout(() => {
  console.log(2);
}, 0);
setTimeout(() => {
  console.log(3);
}, 0);
setTimeout(() => {
  console.log(4);
}, 0);
console.log(5);
1
5
2
3
4

同步程序执行完成后,执行异步程序。

单线程

js是单线程,一个任务完成之后再执行另一个

执行顺序
1,同步执行
2,process.nextTick()
3, 异步执行
4,setImmediate()//当前事件循环结束,然后执行

setImmediate(() => {
  console.log(1);
});
process.nextTick(() => {
  console.log(2);
});

console.log(3);
// 异步自习程序
setTimeout(() => {
  console.log(4);
}, 0);
setTimeout(() => {
  console.log(5);
}, 0);
setTimeout(() => {
  console.log(6);
}, 0);
console.log(7);
3
7
2
4
5
6
1

事件循环

image-20210911214320472

同步任务执行完,看异步任务,事件循环会一直找任务队列里的任务
setImmediate(() => {
  console.log(1);
});
process.nextTick(() => {
  console.log(2);
});

console.log(3);
// 异步自习程序
setTimeout(() => {
  console.log(4);
}, 0);
setTimeout(() => {
  console.log(5);
}, 1000);
setTimeout(() => {
  console.log(6);
}, 0);
console.log(7);
3
7
2
4
6
1
5

异步任务:宏任务,微任务

宏任务:计时器,ajax,读取文件

微任务:promise.then

执行顺序

1, 同步程序

2,process.nextTick

3, 微任务

4,宏任务

5,setImmediate

setImmediate(() => {
  console.log(1);//setImmediate
});
console.log(2);//同步任务
setTimeout(() => {
  console.log(3);//异步,宏任务
}, 0);
setTimeout(() => {
  console.log(4);
}, 1000);//异步,宏任务
console.log(5);//同步任务
new Promise((resolve) => {
  console.log(6);//同步任务
  resolve();
}).then(() => {
  console.log(7);//异步,微任务
});
process.nextTick(() => {
  console.log(8);//process.nextTick
});
2
5
6
8
7
3
1
4



文章评论

目录