JS异步那些事三（Promise）

wenzi 发布于2019-08-21 13:48 / 2176人阅读

摘要：异常处理异常处理一直是回调的难题，而提供了非常方便的方法在一次调用中，任何的环节发生，都可以在最终的中捕获到错误处理基本的小结具体的很多的用法可以参考阮一峰的入门教程，还有就是上面提到的电子书。

JS异步那些事一（基础知识）
JS异步那些事二（分布式事件）
JS异步那些事三（Promise）
JS异步那些事四（HTML 5 Web Workers）
JS异步那些事五（异步脚本加载）

Promise，Deferred 对象 前戏

先来谈谈jquery中的promise的使用，来看一个例子
原本写一个小动画我们可能是这样的

但是如果我们使用promis对象的话，就可以使得代码更加简单易懂

看了上面的例子大概对promise的作用有一定的了解了吧，那就来说说promis的原理吧

Promise对象方法

对于DOM，动画，ajax相关方法，都可以使用 promise 方法。调用 promise 方法，返回的是 promise 对象。可以链式调用 promise 方法。

比如jquery中的ajax的 $.post $.get $.ajax 等方法，实际上都是默认调用了promise方法，然后返回了一个promise对象

promise对象常见的方法有三个： done ， fail ， then 。

jquery 这里的接口方法太多了，就跟早期的事件方法绑定一样， live ， delegate ， bind ，最终还是归为 on

deferred对象方法

deferred 对象呢，也就是使用 $.Deferred() 方法，以及 $.when() 等方法创造出来的对象，它可以理解为一个升级版特殊的的promise对象
来看看一个例子

Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。

上面代码中，timeout方法返回一个Promise实例，表示一段时间以后才会发生的结果。过了指定的时间（ms参数）以后，Promise实例的状态变为Resolved，就会触发then方法绑定的回调函数。

异常处理

　　异常处理一直是回调的难题，而promise提供了非常方便的catch方法：在一次promise调用中，任何的环节发生reject，都可以在最终的catch中捕获到：

Promise.resolve().then(function(){
    return loadImage(img1);
}).then(function(){
    return loadImage(img2);
}).then(function(){
    return loadImage(img3);
}).catch(function(err){
    //错误处理
})

基本的 api

Promise.resolve()
Promise.reject()
Promise.prototype.then()
Promise.prototype.catch()
Promise.all()
Promise.race()

小结

具体的很多的用法可以参考阮一峰的 http://es6.ruanyifeng.com/#docs/promise 入门教程，还有就是上面提到的电子书 http://liubin.org/promises-book/#introduction。

超融合服务器混合云云服务器那些事 jquery_promise异步 webrtc需要导那些js 异步js

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

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

JS异步那些事四（HTML 5 Web Workers）

摘要：向添加一个事件监听器当传递消息时，会执行事件监听器中的代码。终止当我们创建对象后，它会继续监听消息即使在外部脚本完成之后直到其被终止为止。 JS异步那些事一（基础知识）JS异步那些事二（分布式事件）JS异步那些事三（Promise）JS异步那些事四（HTML 5 Web Workers）JS异步那些事五（异步脚本加载）什么是 Web Worker？当在 HTML ...

ZoomQuiet 2019-08-21 13:48 评论0 收藏0
JS异步那些事四（HTML 5 Web Workers）

摘要：向添加一个事件监听器当传递消息时，会执行事件监听器中的代码。终止当我们创建对象后，它会继续监听消息即使在外部脚本完成之后直到其被终止为止。 JS异步那些事一（基础知识）JS异步那些事二（分布式事件）JS异步那些事三（Promise）JS异步那些事四（HTML 5 Web Workers）JS异步那些事五（异步脚本加载）什么是 Web Worker？当在 HTML ...

maybe_009 2019-08-05 17:48 评论0 收藏0
JS异步那些事一（基础知识）

摘要：异步那些事一基础知识异步那些事二分布式事件异步那些事三异步那些事四异步那些事五异步脚本加载事件概念异步回调首先了讲讲中两个方法和定义和用法方法用于在指定的毫秒数后调用函数或计算表达式。功能在事件循环的下一次循环中调用回调函数。 JS异步那些事一（基础知识）JS异步那些事二（分布式事件）JS异步那些事三（Promise）JS异步那些事四（HTML 5 Web Workers...

李涛 2019-08-21 13:49 评论0 收藏0
JS异步那些事五（异步脚本加载）

摘要：遵循的是异步模块定义规范，遵循的是通用模块定义规范。不同的脚本加载这个模块，得到的都是同一个实例。关于异步那些事就写到这里了，很多地方理解的不够深刻希望大家多多指教。 JS异步那些事一（基础知识）JS异步那些事二（分布式事件）JS异步那些事三（Promise）JS异步那些事四（HTML 5 Web Workers）JS异步那些事五（异步脚本加载）异步脚本加载阻塞性...

terasum 2019-08-21 13:50 评论0 收藏0
2018 浅谈前端面试那些事

摘要：声明的变量不得改变值，这意味着，一旦声明变量，就必须立即初始化，不能留到以后赋值。虽然今年没有换工作的打算但为了跟上时代的脚步还是忍不住整理了一份最新前端知识点知识点汇总 1.HTML HTML5新特性，语义化浏览器的标准模式和怪异模式xhtml和html的区别使用data-的好处meta标签canvasHTML废弃的标签IE6 bug，和一些定位写法css js放置位置和原因...

LiuRhoRamen 2019-08-30 14:11 评论0 收藏0