IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 详说Promise与async/await -> 正文阅读

[JavaScript知识库]详说Promise与async/await

1.什么是promise

promise是对异步编程的抽象。一个promise对象代表一个异步操作,可以将回调函数与异步对象脱离,通过then方法在这个异步操作上绑定回调函数。

2.promise的状态

pedding初始状态;fulfilled成功状态;rejected失败状态;
状态一旦改变,就不会再发生变化。

3.promise的优点

将异步对象和回调函数脱离,从回调地狱中解脱,避免了层层嵌套。
提供了唯一then接口,更好的控制异步操作,代码简洁化。

4.promise的缺点

无法中途取消,一旦状态开始发生变化,就无法取消;
如果不设置回调函数,内部报错不会反应给外部;
当处于pedding状态,无法知道目前进展到哪一阶段。

5.promise的方法

  • 1.Promise.then()
    已经实例过的promise对象调用该方法,状态改变时确定执行的操作,传递resolve和reject方法作为回调;
  • 2.Promise.prototype.then()
    链式操作,返回的是一个新的promise对象,使用多个then方法,指定了多个回调函数,第一个回调函数完成之后,会将返回值传入第二个回调函数
  • 3.promise.prototype.catch()
    用于指定发生错误时的回调函数。
  • 4.Promise.all()
    用于将多个Promise实例包装为一个新的Promise实例。
    举例:
var p = Promise.all([p1,p2,p3]);
//可接受一个数组,也可以不是数组,但是必须具有itrator接口,返回值是promise实例。

p的状态由p1、p2、p3决定:
1.只要有一个为rejected,第一个为rejected的实例的返回值,会传递给p的回调函数。
2.只有状态全部为fulfilled,p的状态才会变为fulfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数。

  • 5.Promise.race()
    也是用于将多个Promise实例包装为一个新的Promise实例。
    状态
    只要有一个实例的状态发生变化,p的状态就会发生变化。最先变化的promise实例的返回值,传给p的返回值。
  • 6.Promise.resolve()、Promise.reject()
    将现有的对象转为Promise对象,且它的状态为rejected、fulfilled,之后回调函数立即执行。

6.原理(为什么两个参数能够做处理)

promise有唯一的接口then方法,then()用来promise状态改变时确定执行的操作,resolve时执行第一个函数(onFulfilled),reject时执行第二个函数 onRejected。

7.async

  • async定义了一个异步函数,返回的是一个Promise对象;
  • 如果没有返回一个直接量,输出该函数为Promise.resolve(undefined)(在async函数中返回一个直接量,async会通过Promise.resolve()将直接量封装成Promise对象;如果函数内部抛出错误,async会通过Promise对象的catch()进行捕获)。

8.await

  • await只能用在async函数中,如果用在普通函数则报错。
  • await是个运算符,用于组成表达式,await表达式的运算结果取决于它等的东西。
  • await在等待async函数的返回值,不仅可以是一个Promise对象,还可以是任何表达式的结果。await后面可以接普通函数调用或者是Promise对象。
  • 如果返回的不是一个Promise对象,那await表达式的结果就是它等到的东西;
  • 如果返回来的是一个Promise对象,此时await会阻塞后面的代码,等待返回的这个Promise对象完成,然后得到resolve的值,作为await表达式的运算结果。

9.解决异步的方式

回调函数、promise、async/await

10.为什么async/await比promise更好

1.简洁,不需要写.then,避免了嵌套代码,实现了类似同步编程,async函数内部实现同步,代码变得清晰和简洁。
2.错误处理,使用try/catch可以同时处理同步和异步的错误。
3.条件语句,场景:需要获取数据,根据返回数据确定是直接返回数据,还是做其他操作,只需要将最总结果传递到对外层即可。
4.中间值,场景:调用promise1,使用promise1的值调用promise2,使用promise2的值调用promise3:

const value1 promise1(); 
const value2 promise2(value1); 
return promise3(value1,value2);  
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-03-08 22:20:01  更:2022-03-08 22:24:43 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 7:37:38-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码