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 内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
javascript 使用for循环时该注意的问题-附问题总结
所谓for循环就是重复的执行一段代码,for循环也是希望在创建循环时常会用到的工具,这篇内容主要给大家介绍javascript 使用for循环时该注意的问题-附问题总结,需要的朋友可以参考下2015-08-08ibm官方资料把应用程序从 Internet Explorer 迁移到 Mozilla
使特定于 Internet Explorer 的 Web 应用程序在 Mozilla 上运行时,您遇到过麻烦吗?本文讨论了将应用程序迁移到基于开源 Mozilla 浏览器上时的常见问题。首先讨论跨浏览器开发的基本技术,然后介绍克服 Mozilla 和 Internet Explorer 之间差异的策略。2008-04-04JavaScript中使用Object.prototype.toString判断是否为数组
这篇文章主要介绍了JavaScript中使用Object.prototype.toString判断是否是数组,本文讲解了Object.prototype.toString相关知识,并给出了判断数组的实现代码,使用本文方法同样可以判断javascrpty的其它数据类型,需要的朋友可以参考下2015-04-04js 去掉空格实例 Trim() LTrim() RTrim()
js 去掉空格实例Trim(),LTrim(),RTrim() 需要的朋友可以过来参考下,希望对大家有所帮助2014-01-01
最新评论