理解JS异步&Promise

本文介绍了JavaScript的单线程特性和事件循环机制,详细讲解了调用栈、消息队列和堆的概念。接着,讨论了异步编程的两种常见方式:回调函数及其可能导致的回调地狱问题,以及Promise的使用,包括Promise的状态转换和then方法的链式调用。通过这些内容,帮助读者深入理解JS如何处理异步操作。
摘要由CSDN通过智能技术生成

JS是一种单线程语言,引擎中负责解析执行代码的线程只有一个主线程,即每次只能做一件事。同步对其而言,必须处理完一个事件才能处理下一个。这样虽然当前执行的任务永远不会被抢占,但如果一个任务耗时过长,则会造成阻塞。比如在请求页面时,总是需要耗费大量时间在等待回应上,在等待过程中用户无法进行其他任何操作。为了解决这个问题,JS设计出了一种异步方式。但由于JS是单线程语言,因此这里的异步并不是真正意义上的异步。

事件循环

运行模型
Stack:调用栈。当调用函数时,就会在栈中创建一个帧,其中包括该函数中的参数和局部变量。如果在该函数中还调用了其他函数,则会将被调用的函数也压入栈中,并处理该函数。

Queue:待处理消息队列。每一个消息都关联着一个用以处理这个消息的函数。运行时从队列头部移出一个消息,并作为输入调用与之关联的函数,调用一个函数总是会为其创造一个新的栈帧。函数的处理会一直进行到执行栈再次为空为止,然后事件循环将会处理队列中的下一个消息。

Heap:对象被分配在一个堆中,即用以表示一大块非结构化的内存区域。

同步任务会被直接压入调用栈中。而异步任务则先被压入消息队列中,当调用栈空时,才会将其取出压入调用栈。

异步编程的方式

最常见的异步任务则是setTimeout(callback,waitingTime),当执行到该函数时,会将整个setTimeout函数压入消息队列中,然后继续执行setTimeout函数之后的语句。需注意的是,这里的等待时间是最短等待时间,并不是精准的时间,因此如果设为0,并不代立即执行,而是最少需要等待0s,如果队列前面还有任务需要先执行前面的任务

setTimeout(function () {
   
    console.log(200);
}, 1000);
1.回调函数

有个任务,需要等待上级获批才能执行。完成任务只需要很短的时间,但等待上级批准的时间很长。此时可以将做任务函数作为等批准函数的回调函数

function work(callback){
   
	console.log('写报告');
	setTimeout(function () {
   
		// 耗时的任务加入消息队列
		console.log('上级获批');
		callback(); //执行回调函数
	}, 5000);
	console.log('先做别的工作');
}
function callback(){
   
	//回调函数
	console.log('做任务');
}
function relax(){
   
	//f2任务代码
	console.log('休息一下'
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值