美文网首页
promise异步开发对象

promise异步开发对象

作者: 笑该动人d | 来源:发表于2020-09-10 09:23 被阅读0次

前言

JavaScript是一种同步编程语言,程序由上往下依次执行。在处理异步任务时,可以使用回调函数。 例如我们前面介绍的异步读取文件操作.

一、介绍

  • Promise 是异步编程的一种更优雅的解决方案,比传统的解决方案——回调函数——更合理和更强大。它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了Promise对象。

  • 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。

简单理解为: promise是对异步操作的封装,封装异步文件读写, ajax异步网络请求...

Promise对象有以下两个特点。

(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。

(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。


二、promise的运用

1.基本用法

这里拿读取文件为例;
(1)创建promise对象,封装异步读取文件promise对象
  • promise对象中有一个参数,这个参数是一个回调函数,回调函数中也有两个参数,分别是处理成功的方法resolved和处理失败的方法rejected
const fs = require('fs');    //引入nodejs内置文件模块
//创建promise对象
/**
 * Promise()对象中有一个参数,
 * 这个参数是一个回调函数,回调函数中有两个参数,分别是异步成功和异步失败的结果
 * */
const promiseObj = new Promise(function(resolv,reject){
    //读取文件,参数为(文件路径,回调函数(错误信息,读取返回的结果))
    fs.readFile('./text.txt',function(err,data){
        if(err){
            reject(err);
        }else{
            resolv(data);
        }
    })
});
(2)处理异步文件读取成功&失败的结果
  • 成功时,调用then回调函数,这里的result即是读取文件成功返回的结果,与data一致
  • 失败时,调用catch回调函数
promiseObj.then(function(result){
    console.log(result.toString());
});
promiseObj.catch(function(err){
    console.log(err.toString());
})
  • 链式写法,可以将上面处理返回的结果简写为:
promiseObj.then( (result) => {
    console.log(result.toString());
}).catch( (err) => {
    console.log(err.toString());
});
(3)链式写法
  • 将封装对象和处理结果简写成以下格式
new Promise(function(resolv,reject){
    //读取文件,参数为(文件路径,回调函数(错误信息,读取返回的结果))
    fs.readFile('./text.txt',function(err,data){
        if(err){
            reject(err);
        }else{
            resolv(data);
        }
    })
}).then( (result) => {
    console.log(result.toString());
}).catch( (err) => {
    console.log(err.toString());
});

2.链式调用

  • 业务逻辑:读取3个文件,当文件test1读取成功时,再去读取文件test2, 当文件test1读取成功时,再去读取文件test1
const fs = require('fs');   //引入内置文件模块
(1)一般的正常的读取文件实现方式

这种层层嵌套的格式会让人看着很男理解,所以要用到链式调用

fs.readFile('test1', function (err, data) {
        if (err) {
            console.log('读文件出错' + err);
        } else {
            console.log(data.toString());
            //读取文件2
            fs.readFile('test2', function (err, data) {
                if (err) {
                    console.log('读文件出错' + err);
                } else {
                    console.log(data.toString());
                    //读取文件3
                    fs.readFile('test3', function (err, data) {
                        if (err) {
                            console.log('读文件出错' + err);
                        } else {
                            console.log(data.toString());
                        }
                    });
                }
            });
        }
    });
(2)异步读取多个文件
const promiseObj1 = new Promise((resolved,rejected)=>{
    fs.readFile('test1.txt',(err,data)=>{
        if(err){
            rejected(err);
        }else{
            resolved(data);
        }
    })
});

const promiseObj2 = new Promise((resolved,rejected)=>{
    fs.readFile('test2.txt',(err,data)=>{
        if(err){
            rejected(err);
        }else{
            resolved(data);
        }
    })
});

const promiseObj3 = new Promise((resolved,rejected)=>{
    fs.readFile('test3.txt',(err,data)=>{
        if(err){
            rejected(err);
        }else{
            resolved(data);
        }
    })
});
  • 处理异步文件读取的结果,链式调用
promiseObj1.then(result1 => {
    console.log(`result1 = ${result1}`);
    //当result1为真时,将对象promiseObj2返回到函数调用处
    return promiseObj2;
}).then(result2 => {
    console.log(`result2 = ${result2}`);
    return promiseObj3;
}).then(result3 => {
    console.log(`result3 = ${result3}`);
}).catch(err => {
    console.log(`文件读取失败:${err}`);
})
(3)异步读取文件封装为函数

我们可以看到在上面异步读取多个文件时,重复了多次的操作,只是读取的文件名不一样,所以我们可以将异步读取文件封装成函数

  • 封装异步读取文件
const readPromiseObj = function(fileUrl){
    const promiseObj1 = new Promise((resolved,rejected)=>{
        fs.readFile(fileUrl,(err,data)=>{
            if(err){
                rejected(err);
            }else{
                resolved(data);
            }
        })
    });
    return promiseObj1;    //每读取完成一次文件后会,将Promise读取的对象返回到给封装的函数
}
  • 处理读取结果
//readPromiseObj('test1.txt')即是返回读取文件test1的Promise读取的对象
readPromiseObj('test1.txt').then(result1 => {    
    console.log(`result1 = ${result1}`);
    //当打印完成第一次读取成功的结果的时候,再次调用函数readPromiseObj('test2.txt')去读取test2温江,并将Promise读取的对象返回
   return readPromiseObj('test2.txt');
}).then(result2 => {
    console.log(`result2 = ${result2}`);
    return readPromiseObj('test3.txt');
}).then(result3 => {
    console.log(`result3 = ${result3}`);
}).catch(err => {
    console.log(`读取错误 ${err}`);
});

三、模块化

  • 暴露 module.exports
//readFilePromise.js
const fs = require('fs');
/**
 *  封装promise对象到readFileByPromise函数中
 */
const readFileByPromise = (path) => {
    const promiseObj = new Promise((resovled, rejected) => {
        //具体异步操作
        fs.readFile(path, (err, data) => {
            if (err) {
                rejected(err);
            } else {
                resovled(data);
            }
        });
    });
    return promiseObj;
}
//将readFileByPromise函数暴露出去
module.exports = {readFile:readFileByPromise};
  • 接收
//test.js
//引用readFilePromise.js模块
const readPromise = require('./readFilePromise.js');

//调用暴露出来的readFile函数
const promise = readPromise.readFile('./test2.txt');
promise.then((result)=>{
    console.log(`result: ${result}`);
});

四、Promise.all() 多个异步任务,并发执行

1.原生的异步操作,

  • 当第一个异步操作执行成功后再去执行下一个异步操作

2.并发的异步操作

  • 几个异步操作同时进行,输入的结果顺序按照异步操作的时间先后顺序进行打印,有几个异步操作,就打印几个结果
  • 示例代码块
//三个异步操作对象
Promise.all([
    promise1,
    promise2,
    promise3
]).then( result => {
    console.log(`result : ${result}`);
})

五、Promise.race() 多个异步任务,谁最先执行完,then函数就处理谁

几个异步操作同时进行,输入的结果为最先执行结束的异步函数对象,打印一个结果
//三个异步操作对象
Promise.race([
    promise1,
    promise2,
    promise3
]).then( result => {
    console.log(`result : ${result}`);
})
  • 示例

相关文章

  • 《JS原理、方法与实践》- ES6新增对象(下篇)

    异步处理(Promise) ES2015中新增的Promise对象专门用于处理异步。Promise对象使用then...

  • Node 学习(二)

    Promise学习 Promise含义 容器,保存异步操作的结果对象,获取异步操作的消息 Promise对象特点 ...

  • Promise

    Promise对象就是一个异步请求占位符对象 把异步请求封装在Promise对象中,Promise的构造函数传入一...

  • ES6 同步和异步、Promise

    一.同步与异步 1. Promise作用:解决异步回调的问题 二.Promise对象 目的:创建异步对象,当异步对...

  • Promise

    Promise接口的基本思想是,异步任务返回一个Promise对象。 Promise对象只有三种状态。 异步操作“...

  • promise异步操作

    promise异步操作 定义:包含异步操作结果的对象 状态: 声明方式: new Promise((resolve...

  • react 中的 promise详解

    一、promise是什么?为什么会有promise? 首先,promise是js的抽象异步处理对象实现异步编程的方...

  • promise对象

    promise对象 含义promise是一个对象,可以获取异步操作的消息,是异步编程的一种方案。 特点对象状态不受...

  • ES6 Promise 异步1

    - 异步 和 同步 promise对象: 用同步方式书写异步代码 promise 让异步写起来,像写同步一样流程...

  • ES6 Promise简单封装

    /* * Promise --是异步编程的一种解决方案 消除异步操作(有了Promise对象,就可以...

网友评论

      本文标题:promise异步开发对象

      本文链接:https://www.haomeiwen.com/subject/rmfpxktx.html