Promise小结 ES6异步编程

Promise

Promise是什么：

Promise 是 JS 中进行异步编程的新的解决方案，ES6新增的语法(1)
从语法上来说: Promise 是一个构造函数
从功能上来说: promise 对象用来封装一个异步操作并可以获取其结果

promise 的状态改变

pending 变为 resolved
pending 变为 rejected
说明: 只有这 2 种, 且一个 promise 对象只能改变一次
无论变为成功还是失败, 都会有一个结果数据
成功的结果数据一般称为 vlaue, 失败的结果数据一般称为 reason

为什么要用Promise?

1. 指定回调函数的方式更加灵活:
   旧的: 必须在启动异步任务前指定
   promise: 启动异步任务 => 返回 promie 对象 => 给 promise 对象绑定回调函数
   (甚至可以在异步任务结束后指定)

2. 支持链式调用, 可以解决回调地狱问题
   什么是回调地狱?
   回调函数嵌套调用, 外部回调函数异步执行的结果是嵌套的回调函数执行的条件
   回调地狱的缺点?
   不便于阅读 / 不便于异常处理
   解决方案? promise 链式调用

3. 终极解决方案? async/await

区别实例对象与函数对象

• 实例对象: new 函数产生的对象, 称为实例对象, 简称为对象

• 函数对象: 将函数作为对象使用时, 简称为函数对象

function Fn() { }

const fn = new Fn()

JS 的 error 处理

错误的类型
Error: 所有错误的父类型
ReferenceError: 引用的变量不存在
TypeError: 数据类型不正确的错误
RangeError: 数据值不在其所允许的范围内
SyntaxError: 语法错误

错误处理
捕获错误: try ... catch
抛出错误: throw error

error 对象的结构
message 属性: 错误相关信息
stack 属性: 函数调用栈记录信息

如何使用Promise?

// 创建 promise 对象 
const p = new Promise((resolve, reject) => { 
// 执行异步操作 
setTimeout(() => { 
const time = Date.now() // 如果当前时间是奇数代表成功, 偶数代表失败
// 如果成功了, 调用 resolve(value) 
if (time%2===1) { resolve('成功的数据'+time) } 
else { // 如果失败了, 调用 reject(reason) reject('失败数据'+time) } }, 1000) 
})

// 通过 promise 的 then()指定成功和失败的回调函数 
p.then( value => { 
console.log('成功的回调, value:', value) 
},reason => { 
console.log('失败的回调, reason:', reason) } )

Promise 构造函数: Promise (excutor) {}

API (使用时再查询)

Promise 构造函数: Promise (excutor) {}
excutor 函数: 执行器 (resolve, reject) => {}
resolve 函数: 内部定义成功时我们调用的函数 value => {}
reject 函数: 内部定义失败时我们调用的函数 reason => {}

说明: excutor 会在 Promise 内部立即同步回调,异步操作在执行器中执行

Promise.prototype.then 方法: (onResolved, onRejected) => {}

onResolved 函数: 成功的回调函数 (value) => {}
onRejected 函数: 失败的回调函数 (reason) => {}

说明: 指定用于得到成功 value 的成功回调和用于得到失败 reason 的失败回调
返回一个新的 promise 对象

视频学习：尚硅谷Web前端Promise教程从入门到精通

async与await