JavaScript中的promise使用

phodal 发布于2019-08-21 16:54 / 620人阅读

摘要：它的作用是为实例添加状态改变时的回调函数。方法方法是的别名，用于指定发生错误时的回调函数。是一个处理和前一个回调函数运行时发生的错误发生错误比较推荐的书写方法是先使用来给添加的回调，然后使用来捕获所有的链接上的或者异常。

promise初始

Promise 是异步编程的一种解决方案，Promise 可以认为是一个对象，从它可以获取异步操作的消息。Promise 提供统一的 API，各种异步操作都可以用同样的方法进行处理。具有两大特点：

对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败），只有promise执行的结果可以影响当前状态，无论是异步操作还是同步操作。

一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。

基本用法

ES6 规定，Promise对象是一个构造函数，用来生成Promise实例。

new Promise(
    /* executor */
    function(resolve, reject) {...}
);

Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。它们是两个函数，由 JavaScript 引擎提供，不用自己部署。看一个实例：

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

promise.then(function() {
  console.log("resolved.");
});

console.log("Hi!");

// Promise
// Hi!
// resolved

可以看到，在new promise的时候，会立即执行promise构造函数中的参数function，也就是包含resolve、reject两个方法的函数会被立即执行，上面代码中，Promise 新建后立即执行，所以首先输出的是Promise。然后，then方法指定的回调函数，将在当前脚本所有同步任务执行完才会执行，所以resolved最后输出。
注意：
1. promise的参数函数中如果resolve、reject这两个函数中的某个带了参数也是 promise的话，那么这个原本的promise的状态将会由参数中的promise的状态决定
2. resolve、reject并不会想return一样结束函数的运行

then方法

then方法是定义在原型对象Promise.prototype上的。它的作用是为 Promise 实例添加状态改变时的回调函数。then方法的第一个参数是resolved状态的回调函数，第二个参数（可选）是rejected状态的回调函数。then方法返回的是一个新的Promise实例（注意，不是原来那个Promise实例）。因此可以采用链式写法，即then方法后面再调用另一个then方法。

// getJSON 是一个promise实例
getJSON("/posts.json").then(function(json) {
  return json.post;
}).then(function(post) {
  // ...
});

很多时候在then中会人为的书写一些异步操作，这样可以很好的链式调用，但是即使不是人为的异步操作，JavaScript也会自动的把then的返回值封装为promise实例，可以一直使用then无限回调。

catch方法

Promise.prototype.catch方法是.then(null, rejection)的别名，用于指定发生错误时的回调函数。如果异步操作抛出错误，状态就会变为rejected，就会调用catch方法指定的回调函数，处理这个错误。另外，then方法指定的回调函数，如果运行中抛出错误，也会被catch方法捕获。

//getJSON 是一个promise
getJSON("/posts.json").then(function(posts) {
  // ...
}).catch(function(error) {
  // 处理 getJSON 和 前一个回调函数运行时发生的错误
  console.log("发生错误！", error);
});

比较推荐的书写方法是先使用then来给promise添加resolve的回调，然后使用catch来捕获所有的链接上的reject或者异常。

promise.resolve理解

可以说Promise.resolve是唯一的把promise转换为完成状态的操作，Promise.resolve方法的参数分成四种情况：

参数是一个promise实例
如果参数是Promise实例，那么Promise.resolve将不做任何修改、原封不动地返回这个实例。这个之前已经说过了，如果promise的的resolve参数带的是一个promise，那么原本promise的将会被丢弃，由这个新的promise的状态来取代

参数是一个thenable对象
thenable对象指的是具有then方法的对象，Promise.resolve方法会将这个对象转为Promise对象，然后就立即执行thenable对象的then方法。

参数不是具有then方法的对象，或根本就不是对象
如果参数是一个原始值，或者是一个不具有then方法的对象，则Promise.resolve方法返回一个新的Promise对象，状态为resolved。

不带有任何参数
Promise.resolve方法允许调用时不带参数，直接返回一个resolved状态的Promise对象。

promise.reject理解

Promise.reject(reason)方法也会返回一个新的 Promise 实例，该实例的状态为rejected。
注意，Promise.reject()方法的参数，会原封不动地作为reject的理由，变成后续方法的参数。这一点与Promise.resolve方法不一致。

其他

done()
Promise对象的回调链，不管以then方法或catch方法结尾，要是最后一个方法抛出错误，都有可能无法捕捉到（因为Promise内部的错误不会冒泡到全局）。因此，我们可以提供一个done方法，总是处于回调链的尾端，保证抛出任何可能出现的错误。

done()
finally方法用于指定不管Promise对象最后状态如何，都会执行的操作。它与done方法的最大区别，它接受一个普通的回调函数作为参数，该函数不管怎样都必须执行。

云服务器 GPU云服务器中的Promise es6中的promise Promise使用 javascript中的

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/88889.html

JavaScript 异步

摘要：从最开始的到封装后的都在试图解决异步编程过程中的问题。为了让编程更美好，我们就需要引入来降低异步编程的复杂性。写一个符合规范并可配合使用的写一个符合规范并可配合使用的理解的工作原理采用回调函数来处理异步编程。 JavaScript怎么使用循环代替(异步)递归问题描述在开发过程中，遇到一个需求：在系统初始化时通过http获取一个第三方服务器端的列表，第三方服务器提供了一个接口，可通过...

tuniutech 2019-08-21 18:34 评论0 收藏0
JavaScript引擎是如何工作的？从调用栈到Promise你需要知道的一切

摘要：最受欢迎的引擎是，在和中使用，用于，以及所使用的。怎么处理每个引擎都有一个基本组件，称为调用栈。也就是说，如果有其他函数等待执行，函数是不能离开调用栈的。每个异步函数在被送入调用栈之前必须通过回调队列。例如方法是在中传递的回调函数。翻译：疯狂的技术宅原文：www.valentinog.com/blog/engine… 从Call Stack，Global Me...

zzbo 2019-06-18 11:16 评论0 收藏0
JavaScript引擎是如何工作的？从调用栈到Promise你需要知道的一切

摘要：最受欢迎的引擎是，在和中使用，用于，以及所使用的。单线程的我们说是单线程的，因为有一个调用栈处理我们的函数。也就是说，如果有其他函数等待执行，函数是不能离开调用栈的。每个异步函数在被送入调用栈之前必须通过回调队列。翻译：疯狂的技术宅原文：https://www.valentinog.com/bl... 本文首发微信公众号：前端先锋欢迎关注，每天都给你推送新鲜的前端技术文章 sh...

Simon_Zhou 2019-08-26 13:49 评论0 收藏0
ES6-7

摘要：的翻译文档由的维护很多人说，阮老师已经有一本关于的书了入门，觉得看看这本书就足够了。前端的异步解决方案之和异步编程模式在前端开发过程中，显得越来越重要。为了让编程更美好，我们就需要引入来降低异步编程的复杂性。 JavaScript Promise 迷你书（中文版）超详细介绍promise的gitbook，看完再不会promise...... 本书的目的是以目前还在制定中的ECMASc...

mudiyouyou 2019-08-21 18:40 评论0 收藏0
理解 Javascript 中的 Promise

摘要：理解承诺有两个部分。如果异步操作成功，则通过的创建者调用函数返回预期结果，同样，如果出现意外错误，则通过调用函数传递错误具体信息。这将与理解对象密切相关。这个函数将创建一个，该将在到秒之间的随机数秒后执行或。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你！ showImg(https://segmentfault.com/img/bVbkNvF?w=1280&h=...

paulli3 2019-08-23 13:57 评论0 收藏0
理解 Javascript 中的 Promise

摘要：理解承诺有两个部分。如果异步操作成功，则通过的创建者调用函数返回预期结果，同样，如果出现意外错误，则通过调用函数传递错误具体信息。这将与理解对象密切相关。这个函数将创建一个，该将在到秒之间的随机数秒后执行或。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你！ showImg(https://segmentfault.com/img/bVbkNvF?w=1280&h=...

chaos_G 2019-08-02 12:12 评论0 收藏0