测试环境为Node.js/谷歌浏览器,如若没有声明,默认环境为Node.js
在Promise
语法出现前,我们是这样使用具有依赖关系的异步函数的,以读取文件内容为例:
let fs = require("fs");
fs.readFile('./1.txt','utf-8',(err, result1) => {
console.log(result1);
fs.readFile('./2.txt','utf-8',(err, result2) => {
console.log(result2);
fs.readFile('./3.txt','utf-8',(err, result3) => {
console.log(result3);
});
});
});
这就是我们通常所说的回调地狱,在结构上有着极不便于阅读的缺点,为此Promise的出现为我们在结构上做了极大的优化
大纲
Promise的初使用
Promise是什么?
对象
promise
对象通过new
直接创建
//let p = new Promise(); 没有参数会报错
let p = new Promise((resolve,reject) => {
}); //通常传入一个匿名函数,函数参数一般为resolve和reject
试着打印一下这个对象
let p = new Promise((resolve,reject) => {
});
console.log(p); //=> Promise { <pending> }; :Node.js
console.log(p); //=> Promise {<pending>}; :谷歌浏览器
Promise的状态
Promise一共有三种状态,上面打印的是Promise的第一种状态pending(等待)
以下是Promise的三种状态,任何一个Promise对象的状态有且仅有以下一种
- pending(等待)
- resolve(成功)
- reject(拒绝)
打印一个Promise对象
在谷歌浏览器分别实现为
Promise { <pending> }
Promise { <fullfilled>: (参数) }
Promise { <rejected>: (参数) }
在Node.js分别实现为
Promise { <pending> }
Promise { (参数) }
Promise { <rejected>: (参数) }
在Node.js中分别简单地实现Promise的三种状态
let p1 = new Promise((resolve, reject) => {
//不做任何处理,默认返回pending状态的Promise
});
console.log(p1); //=> Promise { <pending> }
let p2 = new Promise((resolve, reject) => {
resolve("second"); //用resolve函数返回的都是resolve状态的Promise,参数为second
});
console.log(p2); //=> Promise { 'second' }
let p3 = new Promise((resolve, reject) => {
reject("thrid"); //用reject函数返回的都是reject状态的Promise,参数为thrid
}); //因为抛出了拒绝状态而没有处理,所以这里会报错,可以暂时不用管,不影响我们的结果
console.log(p3); //=> Promise { <rejected> 'third' }
那么Promise的状态有什么用呢?
传递给后面的then函数处理携带的参数
then()
关于它的使用只需要记住一点:
then方法是跟在Promise对象后面使用的
关于then的特点,需要记住一下几点(最后会做验证)
1.then方法处理上一个Promise的状态,并返回一个新的resolve状态(如果上一个Promise状态不为pending的话,否则返回pendding状态的Promise),参数为undefined
2.then方法默认返回的也是一个Promise对象,因此then是可以链式使用的
2.如果then方法没有处理Promise的状态,那么这个Promise的状态会继续向下传递,给下面的then处理
then方法可以接收一个或者两个函数,一般都是匿名函数
/*接收两个函数,这两个函数可以分别处理上一个Promise的状态*/
new Promise((resolve, reject) => {
}).then(value => {
//假如Promise的状态为resolve,那么value为对应resolve参数的值
console.log(value);
},reason => {
//假如Promise的状态为reject,那么value为对应reject参数的值
console.log(reason);
})
/*接收一个函数*/
new Promise((resolve, reject) => {
}).then(value => {
//假如Promise的状态为resolve,那么value为对应resolve参数的值
console.log(value);
})
/*或者*/
new Promise((resolve, reject)<