一、Promise的常用API
promise的这些方法执行完成都会返回一个新的promise,promise的状态由执行的结果决定。

(1) new Promise()中的excutor函数

new Promise((resolve, reject)=>{
// 根据处理的内容来返回成功或者失败
resolve(1)
})

excutor函数是在JS主线程中的,一旦声明就会立即执行

(2) Promise.prototype.then方法
then方法是提供给Promise实例对象使用的方法,通过then可以获取promise的执行结果,这个方法里的执行需要等到主线程执行完成之后才执行,属于微任务。
onResolved 表示成功的执行方法,通常写成 value => { }
onRejected 表示失败的执行方法,通常写成 reason => { }

const promise = new Promise((resolve, reject)=>{
setTimeout(()=>{
resolve(1)
}, 1000)
}) promise.then(
value => { console.log('成功', value)},
reason => { console.log('失败', reason)}
)
// 执行结果--- 成功 1

(3) Promise.prototype.catch
catch是提供给Promise实例对象使用的方法,通过catch来处理失败,处理失败的方法有两种,一种是通过上面的then方法,对每次的promise执行定义处理成功和处理失败的函数,第二种就是直接使用catch方法,可以进行一个错误穿透,不需要每次在then里定义失败的处理方法

const promise = new Promise((resolve, reject)=>{
setTimeout(()=>{
reject(0)
}, 1000)
}) promise.then(
value => { console.log('成功', value)}
).catch(
error => { console.log('error', error)}
)
// 执行结果--- error 0

(4) Promise.resolve
定义在构造函数Promise自身的方法,不需要创建实例对象,可直接返回执行成功

Promise.resolve(2)
.then(value=>{
console.log('成功', value)
})
// 执行结果--- 成功 2

(5)Promise.reject

定义在构造函数Promise自身的方法,不需要创建实例对象,可直接返回执行成功

Promise.reject(-1)
.then(value=>{
console.log('成功', value)
})
.catch(error=>{
console.log('error', error)
})
// 执行结果--- error -1

(6) Promise.all

定义在构造函数Promise自身的方法,接收一个由promise实例组成的数组,当所有的promise都执行完成且成功才会返回成功(result为成功数据的数组),只要有一个失败就会返回失败。

const p1 = new Promise((resolve, reject)=>{
setTimeout(()=>{
resolve(1)
}, 2000)
}) const p2 = new Promise((resolve, reject)=>{
setTimeout(()=>{
resolve(2)
},1000)
}) Promise.all([p1,p2])
.then(value=>{
console.log('value', value)
}) // 2s后输出,执行结果--- value [1, 2]

(7) Promise.race
定义在构造函数Promise自身的方法,和all一样,接收由promise实例组成的数组,区别在于,race方法是进行promise实例执行方法速度的比较,返回最快完成的异步操作

const p1 = new Promise((resolve, reject)=>{
setTimeout(()=>{
resolve(1)
}, 2000)
})
const p2 = new Promise((resolve, reject)=>{
setTimeout(()=>{
resolve(2)
},1000)
})
Promise.race([p1,p2])
.then(value=>{
console.log('value', value)
})
// 2s后输出,执行结果--- value 2

二、async和await
async和await合并使用,可以让promise的调用更加的简洁,看上去就像是同步的。
(1) async修饰函数,函数执行的返回值是一个promise对象,结果由函数的返回值决定,当没有返回值或者返回任意非promise的值时,状态为成功,当返回promise,由返回的promise里的执行的结果决定。


另外,async可不与await一起使用,但await必须在async 函数中使用

(2) await后跟表达式,可以是promise,也可以跟非promise,当后面的表达式是promise时,await + 表达式的结果为promise的执行结果,当表达式不是promise时,await + 表达式的结果为表达式自身。

(3) await的执行需要放在try catch里面进行错误的捕获,如果没有捕获错误,那么出错了代码就不能向下进行
格式如:

try {
// await的执行代码
} catch(error){
// 错误的处理代码
}

Promise的理解和使用(二)的更多相关文章

  1. 「每日一题」面试官问你对Promise的理解?可能是需要你能手动实现各个特性

    关注「松宝写代码」,精选好文,每日一题 加入我们一起学习,day day up 作者:saucxs | songEagle 来源:原创 一.前言 2020.12.23日刚立的flag,每日一题,题目类 ...

  2. 理解ThreadLocal(之二)

    想必很多朋友对ThreadLocal并不陌生,今天我们就来一起探讨下ThreadLocal的使用方法和实现原理.首先,本文先谈一下对ThreadLocal的理解,然后根据ThreadLocal类的源码 ...

  3. 深入理解C/C++二维数组

    深入理解C/C++二维数组 前言 本来以为自己对二维数组的理解还可以,没感觉有什么,但是今天小伙伴问了一个问题感觉迷惑了好久,于是决定细致的记录一下,一步一步的探究各种关于二维数组的问题,巩固基础. ...

  4. 如何理解CPU上下文切换(二)

    如何理解CPU上下文切换(二) 1.引 你们好,可爱的小伙伴们.^_^ 多个进程竞争CPU就是一个经常被我们忽视的问题. 你们一定很好奇,进程在竞争CPU的时候并没有真正运行,为什么还会导致系统的负载 ...

  5. 深入理解zabbix(二)

    深入理解zabbix(二) 链接:https://pan.baidu.com/s/1q5YwJMTcZLcS5OQ0iOu44A 提取码:8gdi 复制这段内容后打开百度网盘手机App,操作更方便哦 ...

  6. 深入理解NIO(二)—— Tomcat中对NIO的应用

    深入理解NIO(二)—— Tomcat中对NIO的应用 老哥行行好,转载和我说一声好吗,我不介意转载的,但是请把原文链接贴大点好吗 Tomcat大致架构 先贴两张图大致看一眼Tomcat的架构 Tom ...

  7. promise的理解和使用

    1. Promise是什么 1.1 promise 的理解 1. 抽象表达: Promise 是 JS 中进行异步编程的新的解决方案(旧的是纯回调形式) 2. 具体表达: (1)从语法上说:Promi ...

  8. 谈谈你对Promise的理解

    一.Promise是什么? 理解 抽象表达: Promise 是一门新的技术(ES6 规范) Promise 是 JS 中进行异步编程的新解决方案(备注:旧方案是单纯使用回调函数) 具体表达: 从语法 ...

  9. promise的理解和应用

    老铁们,我又满血复活了,今天我准备来吹一波我对promise,如有错吴请直接指出,明白了吗?话不多说开始吧 首先我们需要知道啥叫promise,我问了问大佬,他说这个东西是 异步操作的同步代码(but ...

  10. 深入理解多线程(二)—— Java的对象模型

    上一篇文章中简单介绍过synchronized关键字的方式,其中,同步代码块使用monitorenter和monitorexit两个指令实现,同步方法使用ACC_SYNCHRONIZED标记符实现.后 ...

随机推荐

  1. EasyExcel自适应列宽

    import com.alibaba.excel.enums.CellDataTypeEnum; import com.alibaba.excel.metadata.Head; import com. ...

  2. 2022-10-04:以下go语言代码输出什么?A:{123} main.T{x:123} B:{123} T{x:123} C:boo boo D:boo main.T{x:123}。 packag

    2022-10-04:以下go语言代码输出什么?A:{123} main.T{x:123} B:{123} T{x:123} C:boo boo D:boo main.T{x:123}. packag ...

  3. 2022-05-19:给定一个数组arr,给定一个正数M, 如果arr[i] + arr[j]可以被M整除,并且i < j,那么(i,j)叫做一个M整除对。 返回arr中M整除对的总数量。 来自微软。

    2022-05-19:给定一个数组arr,给定一个正数M, 如果arr[i] + arr[j]可以被M整除,并且i < j,那么(i,j)叫做一个M整除对. 返回arr中M整除对的总数量. 来自 ...

  4. 【保姆级教程】如何用Rust编写一个ChatGPT桌面应用

    为什么我们需要一个桌面应用 原因实在太多,我们需要便捷地导出记录,需要在回答长度超长的时候自动加上"继续",需要收藏一些很酷很实用的prompt...... (首先我假设你是一名如 ...

  5. Vue——属性指令、style和class、条件渲染、列表渲染、事件处理、数据双向绑定、过滤案例

    vm对象 <body> <div id="app"> <h1>{{name}}</h1> <button @click=&qu ...

  6. 【QCustomPlot】下载

    说明 使用 QCustomPlot 绘图库辅助开发时整理的学习笔记.同系列文章目录可见 <绘图库 QCustomPlot 学习笔记>目录.本篇介绍 QCustomPlot 的下载. 目录 ...

  7. [汽车]车架号(VIN)的设计与规范

    1 车架号概述 VIN是英文Vehicle Identification Number(车辆识别代码)的缩写,也就是我们平时所说的车架号.大架号. 总共由17位字符组成,是汽车唯一的身份识别信息,好比 ...

  8. C++面试八股文:了解sizeof操作符吗?

    某日二师兄参加XXX科技公司的C++工程师开发岗位第10面: 面试官:了解sizeof操作符吗? 二师兄:略微了解(不就是求大小的嘛..) 面试官:请讲以下如何使用sizeof? 二师兄:sizeof ...

  9. Kali Linux的目录结构

    Linux目录和Windows目录有着很大的不同,Linux目录类似一个树,最顶层是其根目录,如下图: kali Linux 目录结构 bin目录 存放二进制可执行文件(如我们常用的 ls ping ...

  10. Kubernetes——构建平台工程的利器

    作者|Loft Team 翻译|Seal软件 链接|https://loft.sh/blog/why-platform-engineering-teams-should-standardize-on- ...