深切明白ES6笔记(十一)Promise与异步编程

重要知识点:Promise生命周期、Promise基本操纵、Promise链、相应多个Promise以及集成Promise

《深切明白ES6笔记(十一)Promise与异步编程》

《深切明白ES6》笔记 目次

异步编程

JavaScript引擎中,只要一个主线程,当实行JavaScript代码块时,不允许其他代码块实行,而事宜机制和回调机制的代码块会被添加到使命行列(或许叫做客栈)中,当相符某个触发还调或许事宜的时刻,就会实行该事宜或许回调函数。

事宜模子

浏览器首次衬着DOM的时刻,我们会给一些DOM绑定事宜函数,只要当触发了这些DOM事宜函数,才会实行他们:

let button = document.getElementById("my-btn");
button.onclick = function(event) {
    console.log("Clicked");
};

回调形式

当 Node.js 被建立时,它经由过程提高回调函数编程形式提升了异步编程模子。回调函数形式类似于事宜模子,由于异步代码也会在背面的一个时候点才实行:

readFile("example.txt", function(err, contents) {
    if (err) {
        throw err;
    }
    console.log(contents);
});
console.log("Hi!");

假如回调过量,会堕入回调地狱;

Promise 基本

Promise能够当作是一个占位符,示意异步操纵的实行效果。函数能够返回一个Promise,而没必要定阅一个事宜或许向函数通报一个回调函数。

// readFile 许诺会在未来某个时候点完成
let promise = readFile("example.txt");

在此代码中, readFile() 实际上并未马上最先读取文件,这将会在稍后发作。此函数反而会返回一个 Promise 对象以示意异步读取操纵,因而你能够在未来再操纵它。

Promise 的生命周期

Promise的生命周期:进行中(pending),已完成(fulfilled),谢绝(rejected)
每一个 Promise 都邑阅历一个短暂的生命周期,初始为挂起状况(pending state) ,这示意异步操纵还没有完毕。一个挂起的 Promise 也被认为是未决的(unsettled )。一旦异步操纵完毕, Promise就会被认为是已决的(settled ) ,并进入两种能够状况之一:

  1. 已完成(fulfilled ) : Promise 的异步操纵已胜利完毕;
  2. 已谢绝(rejected ) : Promise 的异步操纵未胜利完毕,多是一个毛病,或由其他缘由致使。

内部的[[PromiseState]] 属性会被设置为”pending” 、 “fulfilled” 或 “rejected”,以反应Promise的状况。该属性并未在 Promise 对象上被暴露出来,因而你没法以编程体式格局推断 Promise 究竟处于哪一种状况。不过你能够运用then()要领在 Promise 的状况转变时实行一些特定操纵。

  • then()

then() 要领在所有的 Promise 上都存在,而且吸收两个参数。第一个参数是 Promise 被完成时要挪用的函数,与异步操纵关联的任何附加数据都邑被传入这个完成函数。第二个参数则是 Promise 被谢绝时要挪用的函数:

let promise = readFile("example.txt");
promise.then(function(contents) {
    // 完成
    console.log(contents);
}, function(err) {
    // 谢绝
    console.error(err.message);
});
promise.then(function(contents) {
    // 完成
    console.log(contents);
});
promise.then(null, function(err) {
    // 谢绝
    console.error(err.message);
});
  • catch() 要领

其行动等同于只通报谢绝处置惩罚函数给 then()

promise.catch(function(err) {
    // 谢绝
    console.error(err.message);
});
// 等同于:
promise.then(null, function(err) {
    // 谢绝
    console.error(err.message);
});

建立未决的 Promise

Promise 运用 Promise 组织器来建立:

// Node.js 类型
let fs = require("fs");
function readFile(filename) {
    return new Promise(function(resolve, reject) {
        // 触发异步操纵
        fs.readFile(filename, { encoding: "utf8" }, function(err, contents) {
            // 搜检毛病
            if (err) {
                reject(err);
                return;
            }
            // 读取胜利
            resolve(contents);
        });
    });
}
let promise = readFile("example.txt");
// 同时监听完成与谢绝
promise.then(function(contents) {
    // 完成
    console.log(contents);
}, function(err) {
    // 谢绝
    console.error(err.message);
});

romise组织函数吸收一个函数作为参数,该函数的两个参数分别是resolve和reject。它们是两个函数,由 JavaScript 引擎供应,不必本身布置。
实行器会在 readFile() 被挪用时马上运转

let promise = new Promise(function(resolve, reject) {
    console.log("Promise");
    resolve();
});
console.log("Hi!");

//输出效果
Promise
Hi!

建立已决的 Promise

Promise.resolve()

Promise.resolve()要领吸收一个参数,并会返回一个处于已完成状况的 Promise ,在then()要领中运用完成处置惩罚函数才提取该完成态的Promise通报的值,比方:

let promise = Promise.resolve(42);
promise.then(function(value) {
    console.log(value); // 42
});

Promise.reject()

能够运用Promise.reject()要领来建立一个已谢绝状况的Promise,一样只要在谢绝处置惩罚函数中或许catch()要领中才吸收reject()要领通报的值:

let promise = Promise.reject(42);
promise.catch(function(value) {
    console.log(value); // 42
});
    原文作者:sevencui
    原文地址: https://segmentfault.com/a/1190000016147179
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞