JavaScript中 Promise 的使用技巧
更新时间：2022年08月15日 16:16:11 作者：JerryWang_sap
这篇文章主要介绍了JavaScript中 Promise 的使用技巧，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下
“生产代码”是可能需要一些时间来执行的代码。
“消费代码”是必须等待结果的代码。
Promise 是一个 JavaScript 对象，它链接生产代码和消费代码。
看一段最简单的代码：
let myPromise = new Promise(function(myResolve, myReject) {
// "Producing Code" (May take some time)
myResolve(); // when successful
myReject(); // when error
});
// "Consuming Code" (Must wait for a fulfilled Promise)
myPromise.then(
function(value) { /* code if successful */ },
function(error) { /* code if some error */ }
);执行 new Promise 的构造函数后，会立即进入 Promise 的构造函数体内，即包含了 resolve 和 reject 方法的匿名函数。
然后执行完毕。此时并不会执行 then 里的回调函数。
然后 then 指定的回调函数被异步调用，注意 Chrome 里的提示：
- 当 Promise 对象处于
pending（工作）状态时，结果是未定义的。 - 当 Promise 对象
fulfilled时，结果是一个值。如下图所示：
- 当 Promise 对象被
rejected时，结果是一个错误对象。
开发人员无法访问 Promise 属性状态和结果，必须使用 Promise 方法来处理 Promise。
看一个包含 UI 的例子：
Promise 把异步代码封装起来。上图的 setTimeout，模拟了一个耗时 3 秒的 HTTP 操作。
返回的 myPromise 对象，使用 then 注册回调函数。回调函数不关心自己什么时候被调用。
运行显示：
3 秒后：
一个文件访问的例子：
let myPromise = new Promise(function(myResolve, myReject) {
let req = new XMLHttpRequest();
req.open('GET', "mycar.htm");
req.onload = function() {
if (req.status == 200) {
myResolve(req.response);
} else {
myReject("File not Found");
}
};
req.send();
});
myPromise.then(
function(value) {myDisplayer(value);},
function(error) {myDisplayer(error);}
);函数体内一般是一个比较费时的操作，操作本身会立即执行，但什么时候执行结束？这就是一个异步操作了。执行结束后，通过 resolve 通知 then 注册的回调函数。
到此这篇关于JavaScript Promise 的使用技巧的文章就介绍到这了,更多相关JavaScript Promise 内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要为大家详细介绍了js绘制一条直线并旋转45度，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-08-08
通常小程序有为我们提供用户授权登陆的功能，但是这个只能获取用户的头像和昵称，今天带大家学习小程序登陆注册功能的开发,需要的朋友可以参考下2019-12-12
先来说eval的用法，内容比较简单，熟悉的可以跳过2012-03-03
这篇文章主要为大家介绍了easywasmplayer实现视频流播放示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-09-09
随着 App 成功上架,可能更新频率往往会越来越高,传统的应用更新方式要求用户重新下载并安装应用,这不仅耗费用户大量时间、流量,还严重影响用户体验,为了提升用户体验,热更新技术应运而生,所以本文介绍了uni-app实现热更新的详细操作步骤,需要的朋友可以参考下2025-04-04
微信小程序开发中选择地理位置就需要通过官方文档API去判断用户是否授权地理位置,用户开启授权后可直接获取地理位置,下面这篇文章主要给大家介绍了关于微信小程序获取当前位置的详细步骤,需要的朋友可以参考下2022-12-12
这篇文章主要为大家详细介绍了js实现常用排序算法的代码，感兴趣的小伙伴们可以参考一下2016-08-08
本教程旨在实现lightBox时的样式与行为分离，减少JS在各方面（全屏遮蔽、ie6中遮蔽select、双向居中、高度自适应内容等）的工作。2009-07-07
JavaScript语言中的Literal Syntax特性分析
JavaScript语言中的Literal Syntax特性分析...2007-03-03
这篇文章主要为大家详细介绍了bootstrap警告框使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-01-01
最新评论