js是单线程,同一时间只能干一件事情
例子1 宏微任务的优先级
//遇到setTimeout会把他放到宏任务队列,准备执行(还没执行),等同步执行完后,他才会执行
setTimeout(() => {
console.log('setTimeout')
}, 0)
new Promise((resolve,reject) => {
resolve() //promise状态改变后,会将then的任务,加到微任务队列里面
reject() //只要状态一改变就不可逆了,reject不会执行
console.log('1')
}).then(value => {
console.log('promise')
})
/*
resolve=>{
console.log('牛逼')
}
这一段代码是同步执行的,因此会先输出"牛逼",在输出1
*/
console.log('2') //同步立刻执行,优先级最高
// 优先级: 同步>微任务>宏任务
// 主线程执行完后,先轮询微任务,在轮询宏任务
//输出结果:
//1
//2
//promise
//setTimeout
例子2 定时器的任务编排
setTimeout(()=>{
console.log('定时器1')
},2000)
setTimeout(()=>{
console.log('定时器2')
},2000)
for(let i = 0 ;i<10000;i++){
console.log(1)
}
//会先执行for循环主线程,这时候有一个定时器模块已经把定时器任务2秒后放入了宏任务队列,
//for循环执行完后,会立刻输出定时器的内容
例子3 dom渲染可以理解为宏任务
最好把script标签写在最底部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>1111111</div>
</body>
</html>
<script src="./for.js"></script>
for(var i = 1;i<10000;i++){
console.log(1)
}
