ES6修补了一位Js修真者诸多的遗憾。

曾几何时,我这个小白从js非阻塞特性的坑中爬出来,当我经历了一些回调丑陋的写法和优化的尝试之后,我深深觉得js对于多线程阻塞式的开发语言而言,可能有着其太明显的缺点,而又无法忽略的是也正因为这一点,node.js处理并行的能力被人看作优点,在我看来,这其实有着些讽刺的意味,就好像踢足球时有的人总夸你腿短,所以频率快下盘稳好控球。。。好在js从出生以来就有一种独特的特质,就是模仿,对,就是模仿,模仿别人的优点来补足自己,同时保持自己的长处。

ES6就是通过Promise对象模仿出了异步处理更合理的处理方式。鼓掌!“啪啪啪。。。”

废话扯到这里,我们来看如何通过promise对象处理异步操作。

什么是Promise原型对象?

ES6 原生提供了 Promise原型 对象,用来传递异步操作的消息。让异步操作(通常是异步操作)事件队列之间知道彼此相邻的执行先后顺序。这样说,我相信初次接触的人会不太理解,没事,我提供一个清晰的实例来讲解。

基本的promise基础知识,你需要到 http://www.jianshu.com/p/063f7e490e9a 学习相关内容。

Promise怎么用实现异步?

让我们来看这个例子:

new Promise(
function(resolve,reject){
resolve(); //这里指调用后面then的方法体内容,即先执行2000ms的动作
}
).then(function() {
new Promise(function (resolve, reject) {
setTimeout(function () {
alert("先执行2000ms动作!");
resolve(); //这里指调用后面then的方法体内容,执行1000ms的动作
}, 2000);
}).then(function () {
setTimeout(function () {
alert("再执行1000ms动作!");
}, 1000);
});
});

  这段代码会先执行2000ms动作,再执行1000ms动作。

一个Promise实例对象会有三个状态,Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。其构造函数的参数为一个带有两个状态的参数的匿名函数,这两个状态在这儿指代将要执行的函数行为。

你需要注意的是,一个promise对象只能指派一个固定的函数行为,即resolve与reject指代一个固定的函数行为,即后面紧接着的then或err的函数内容。如果你想接着进行下一步异步操作,你需要在相应函数体内再兴建一个新的promise对象,并规定它对应状态的函数行为。这里往往是别的教程没有说清的地方。

我们再来探究一下如何用优化调用的写法?

如果Promise只是实现这样层层嵌入的模样,我并不觉得它对层层回调有多大的优化的地方。我们思考如何用简洁直观的链式调用形式来使用Promise对象。

我们知道Promise对象的then()方法会返回给下一个then()一个参数,如果我们让这个参数为新的Promise实例对象的话,不就能实现链式调用不同的Promise对象规定的resolve行为了吗?想到如此,迫不及待做尝试,看下面的代码:

new Promise(function(resolve,reject){
setTimeout(function(){
alert("执行3000ms的动作!"); //3000ms动作
resolve();
},3000); }).then(function(){
return new Promise(function(resolve,reject){
setTimeout(function(){
alert("执行2000ms的动作!"); //2000ms动作
resolve();
},2000);
}); }).then( function(){
alert("执行0ms的动作!"); //0ms动作
});

   这段代码会先执行3000ms动作,在执行2000ms动作,最后执行0ms动作!我们成功地实现了Promise对象的链式调用解决了异步操作的问题!此处应该再一次响起掌声“啪啪啪。。。”;

ES6的promise对象应该这样用的更多相关文章

  1. ES6的promise对象研究

    ES6的promise对象研究 什么叫promise? Promise对象可以理解为一次执行的异步操作,使用promise对象之后可以使用一种链式调用的方式来组织代码:让代码更加的直观. 那我们为什么 ...

  2. 教你如何使用ES6的Promise对象

    教你如何使用ES6的Promise对象 Promise对象,ES6新增的一个全新特性,这个是 ES6中非常重要的一个对象 Promise的设计初衷 首先,我们先一起了解一下,为什么要设计出这么一个玩意 ...

  3. ES6 - promise对象

    Promise的设计初衷 我们使用ajax请求数据,得到数据后再对数据进行操作,可是有时候,对得到的数据进行操作的过程中,可能又要用到ajax请求,这时,我们的代码就变成了这样: $.ajax({ s ...

  4. ES6中Promise对象个人理解

    Promise是ES6原生提供的一个用来传递异步消息的对象.它减少了传统ajax金字塔回调,可以将异步操作以同步操作的流程表达出来使得代码维护和可读性方面好很多. Promise的状态: 既然是用来传 ...

  5. ES6的Promise对象

    http://es6.ruanyifeng.com/#docs/promise Promise 对象 Promise 的含义 基本用法 Promise.prototype.then() Promise ...

  6. 前端知识点回顾之重点篇——ES6的Promise对象

    Promise Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大. 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异 ...

  7. 谈谈 ES6 的 Promise 对象

    https://segmentfault.com/a/1190000002928371 前言 开篇首先设想一个日常开发常常会遇到的需求:在多个接口异步请求数据,然后利用这些数据来进行一系列的操作.一般 ...

  8. ES6 用Promise对象实现的 Ajax 操作

    下面是一个用Promise对象实现的 Ajax 操作的例子. const getJSON = function(url) { const promise = new Promise(function( ...

  9. ES6之Promise对象

    创建Promise对象 function getHtml(url) { return new Promise((resolve, reject) => { let xhr = new XMLHt ...

随机推荐

  1. Sublime Text:Windows下配置C 编译环境和GDB调试环境

    写此文解决两个问题: 1.在Sublime Text中实现编译运行含有外部输入的C程序(如含有scanf的程序); 2.在程序运行完毕后不退出cmd,能继续用gdb调试程序. 一.MinGW 下载地址 ...

  2. java 部分隐藏字段

    项目中,很多时候要对数据作隐私保护,隐藏一些数据的关键信息,比如身份证,隐藏其中的出生年月 //利用正则表达式匹配替换字符串 String email = "young452wer@gami ...

  3. Windows Server 2008 R2 IIS7.5 部署 MVC HTTP 404.0 Not Found 错误

    如图 在Windows Server 2008 R2 IIS7.5 部署 MVC HTTP 404.0 Not Found 错误,在Win7环境下测试正常,在百度中查找相关解决方法,如修改配置文件等, ...

  4. 远程CDN加速不可用,加载本地库

    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery ...

  5. IOS __ 面试题

    1.下面四种内部排序算法中哪一种在最差的情况下时间复杂度最高:(B) A.快速排序 B.冒泡排序 C.堆排序 D.归并排序   2.Shell中,将command1的输出作为command2的输入应该 ...

  6. LeetCode 345. Reverse Vowels of a String

    Write a function that takes a string as input and reverse only the vowels(元音字母) of a string. Example ...

  7. 设计模式之简单工厂模式Simple Factory(四创建型)

    工厂模式简介. 工厂模式专门负责将大量有共同接口的类实例化 工厂模式可以动态决定将哪一个类实例化,不必事先知道每次要实例化哪一个类. 工厂模式有三种形态: 1.简单工厂模式Simple Factory ...

  8. Oracle执行计划详解

    Oracle执行计划详解 --- 作者:TTT BLOG 本文地址:http://blog.chinaunix.net/u3/107265/showart_2192657.html --- 简介:   ...

  9. UVA 10692 Huge Mods(指数循环节)

    指数循环节,由于a ^x = a ^(x % m + phi(m)) (mod m)仅在x >= phi(m)时成立,故应注意要判断 //by:Gavin http://www.cnblogs. ...

  10. 自定义RatingBar的一个问题(只显示显示一个星星)

    问题一: 在自定义RatingBar时在设置了numStars属性后只显示一张图(一个星星) 解答: 注意准备的替换图片千万不要使用.9PNG格式的图片,要不之后显示一张图(一个星星)! 问题二: 设 ...