js的await与async简单使用

 function ha(a){
    console.log("csdvcvsvs:",a)
}
async function ha2(a){
    return {then:function (resoved,rej){
        rej(a)
        }}
}

async  function ju(){
  await  ha2(1).then(function (re){
        console.log(re)
    }).catch(function (reson){
        console.log(reson)
    })
    ha2(2).then(function (re){
        console.log(re)
    }).catch(function (reson){
        console.log(reson)
    })
    ha("jjjjjjjj")

}
ju()

1:async返回的是Promise对象,没有定义返回的回调,会默认返回resolved回调为undefined;返回定义了以返回定义为准;
2:await必须在async定义的函数内部使用;
3:
1)JS是单线程的,大部分代码都是同步编程。

2)JS中利用浏览器的多线程机制,基于单线程的EventLoop(事件循环机制)实现出异步的效果。

2、event loop (微任务与宏任务):
1)微任务 (microtask):优先级高,并且可以插队,不是先定义先执行。包括:promise.then,async/await [generator],requestAnimationFrame,observer,MutationObserver,setImmediate。

2)宏任务 (macrotask):优先级低,先定义的先执行。包括:ajax,setTimeout,setInterval,事件绑定,postMessage,MessageChannel(用于消息通讯)。

3、根据事件循环机制,重新梳理一下流程:
+先找微任务队列,如果微任务队列中有,先从微任务队列中,一般按照存放顺序获取并且去执行。

+如果微任务队列中没有,则再去宏任务队列中查找,在宏任务队列中,一般是按照谁先到达执行的条件,就先把谁拿出来执行。
JS是单线程的:浏览器只分配一个线程用来渲染JS代码。

1、JS中的代码大部分都是“同步编程”:上面的任务没有处理完成,下面的任务是无法处理的。

2、但是JS中利用浏览器的多线程机制,可以规划出“异步编程”效果。
一、JS异步的执行原理
  我们知道JavaScript是单线程的,而浏览器是多线程的。单线程执行任务需要一个个排队进行,假如一个任务需要很长时间执行(像ajax需要较长时间),会直接导致无响应,后面的任务一直在等待执行。这时候就需要用到异步。

想了解异步,首先我们要知道浏览器有最基本的三个常驻线程: JS引擎线程,事件触发线程,GUI渲染线程。

其中JS引擎线程和事件触发线程共同构成了一种事件循环机制,而GUI渲染线程与JS引擎是互斥的,当JS引擎执行时GUI线程会被挂起,GUI更新保存在一个队列中,当JS引擎空闲时,立即被执行。

我们从它的事件循环机制解析:

在这里插入图片描述

JS引擎线程中分为同步和异步任务:

1.同步任务全部通过主线程执行,形成执行栈。

2.当有异步任务时交给异步进程(WebAPIs):包含事件触发线程或者定时器线程等处理,形成任务队列。

3.当执行栈中的任务全部处理完成,主线程为空闲的时候,会从任务队列中提取任务到执行栈中执行。

通俗来说,JavaScript除了主线程之外还存在一个任务队列,任务队列存放需要异步执行的内容,执行完主线程后,就会不断循环扫描执行任务队列的任务,直至队列清空。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值