三分钟带你了解JS的运行机制

运行机制

单线程异步机制

同步 :就是按程序顺序执行
异步:计时器,ajax 读取文件

同步程序执行完成后执行异步程序 ,如果计时器排在后面,那么计时器肯定是后面执行,不管设置多久。所以计时器是不准的

process.nextTick(()=>{
	//同步
	//VUE中的
})
同步代码执行之后,异步代码之行之前
setImmediate(()=>{

})
当前事件循环代码执行之后

有运行栈和任务队列两个概念运行栈中放的是同步的代码,然后异步程序会放到任务队列中。

事件循环:不断检测任务队列中有没有任务。例如,setTImeout设置时间,时间到了就会放到任务队列中,然后不断检测,按到先来先执行的顺序来执行。

出个例子

setImmediate(()=>{
	console.log(1)
})
process.nexTick(()=>{
	console.log(2)
})
console.log(3)
setTimeout(()=>{console.log(4)},0)
setTimeout(()=>{console.log(5)},100)
console.log(6)
//结果 362415

宏任务与微任务

宏任务:计时器、ajax、读取文件
微任务:promise.then
执行顺序:
1.同步程序
2.process.nextTick()
3.微任务
4.宏任务
5 setImmediate
扩展上述例子

setImmediate(()=>{
   console.log(1)
})
process.nexTick(()=>{
   console.log(2)
})
console.log(3)
setTimeout(()=>{console.log(4)},0)
setTimeout(()=>{console.log(5)},100)
console.log(6)
new Promise((resolve)=>{
   console.log(7)//在运行栈中执行
}).then(()=>{
   console.log(8)
})
//结果 36728415

Promise对象

//promise es6新增的对象

let p = new Promise((resolve) => {

console.log('hello')

resolve('world')

})

p.then((data) => {

console.log(data)

})

//输出只有hello 只有调用resolve才会调用then

axios.get('').then((res)=>{

console.log(res);

})

//get方法返回的是promise对象,reslove传回res

async函数

1.async函数的返回值是promise对象

async function fun(){
	return 1;
}
//相当于
function fun(){
	return new Promise((resolve)=>{
		resolve(1);
	})
}

fun().then((data)=>{
	console.log(data);
	//这样就拿到了返回值
})

2.await 用法

异步的代码更像是同步的代码

let p = new Promise((resolve)=>{
	resolve(1);
})
let p2 = new Promise((resolve)=>{
	resolve(2);
})
async = 

猜你喜欢

转载自blog.csdn.net/DragonOfMoon/article/details/124116353