• 回调地狱、syn函数和await函数


    一、回调地狱

    1、回调函数:把一个函数作为参数传递给另一个函数,在另一个函数中作为参数的函数不会立即执行,只有当满足某个条件后才会执行,这个函数称为回调函数。

    2、同步任务:主线程中的程序依次排列,只有当前一个任务执行结束后才会执行后一个任务。

    3、异步任务:不会进入主线程队列,它会进入异步的队列。前一个任务是否执行完毕不影响下一个任务的执行。

    异步任务又称为不阻塞任务。

    3、回调地狱:回调函数嵌套回调函数就会形成回调地狱

    4、回调地狱的缺点

    (1)可读性差、维护困难

    (2)无法进行return和throw

    (3)多个回调之间无法建立练习

    二、Promise对象

    promise:是一个原生的js对象,为了解决回调地狱问题,可以替换掉回调函数。是一个新的异步任务的解决方案。

    1、promise的三种状态

    (1)pending[待定] 初始状态

    (2)resloved[实现] 操作成功

    (3)reject[被否决] 操作失败

    2、执行过程

    (1)当promise对象的状态发生改变时就会触发后面的.then()里的响应函数处理后续步骤

    (2)状态一经改变,不会再变

    (3)promise实例对象一经创建,就会立即执行

    注:promise对象之所以可以连续的.then是因为.then里面的回调函数的返回值也是一个promise对象。

    3、构造函数

    Promise(reslove,reject)

    reslove:表示异步操作成功后的函数,将promise对象的状态由初始化状态转换到成功,并将函数的执行结果传递出去,由下一个then接收

    reject:表示异步操作失败后的回调函数,在回调函数执行错误时,并将错误的信息作为参数传递出去,由catch来接收。

    4、Promise的all方法:实现了异步任务并行执行能力

    1. function getWidth() {
    2. return new Promise((resolve,reject)=>{
    3. setTimeout(resolve(5),1000)
    4. })
    5. }
    6. function getHight(){
    7. return new Promise((resolve,reject)=>{
    8. setTimeout(resolve(4),1000)
    9. })
    10. }
    11. Promise.all([getWidth(),getHight()]).then((result)=>{
    12. console.log('result:',result);
    13. })

    三、syn函数和await函数

    1、Promise对象的缺陷:虽然跳出了回调地狱,但是在流程复杂的代码中会出现很多的then,这样会导致代码的可读性差。

    2、async/await出现的原因:是对Promise的一种优化,又称为Promise的语法糖。

    1. var sleep = function(time){
    2. return new Promise((resolve,reject)=>{
    3. setTimeout(function () {
    4. resolve();
    5. },time)
    6. })
    7. }
    8. var start = async function(){ //异步调用,实现同步效果
    9. console.log('start')
    10. await sleep(3000).then((data)=>{
    11. console.log('end')
    12. })
    13. }
    14. start();

    2、asyns/await的使用规则

    (1)await关键字只能在asyc标识的函数中使用

    (2)await后面可以直接跟一个Promise对象(更多的是跟一个返回Promise对象的表达式)

    (3)await函数不能单独使用

    (4)await可以直接拿到promise中resolve中的数据

    4、promise和async/await区别

    (1)promise是ES6中出现,async/await是在ES7中出现的

    (2)async/await的写法更优雅

    (3)对reject状态的捕捉方式不同

             1️⃣promise采用.then后面跟.catch方法捕捉,通常.catch放在最后

             2️⃣async/await可以用.then后面跟.catch方法捕捉,也可以用try...catch方法捕捉

  • 相关阅读:
    Aria2NG连接aria2-pro提示认证失败的处理办法
    Nim语言获取exe绝对路径(自身)
    linux之后台运行命令
    Day03 leecode#有效的括号#合并两个有序链表
    LeetCode - 622. 设计循环队列(C语言,顺序存储结构,配图)
    Ubuntu18.04安装 ROS Melodic教程
    工控机通过Profinet转Modbus RTU网关与报警控制仪通讯配置案例
    GAN!生成对抗网络GAN全维度介绍与实战
    Flutter 使用 CustomPaint 绘制基本图形
    ASP.NET Core 6框架揭秘实例演示[40]:基于角色的授权
  • 原文地址:https://blog.csdn.net/m0_73634593/article/details/128086269