学习promise

概念学习

promise思维导图学习

Promise 对象用于延迟(deferred) 计算和异步(asynchronous ) 计算.。一个Promise对象代表着一个还未完成，但预期将来会完成的操作。 Promise 对象是一个返回值的代理，这个返回值在promise对象创建时未必已知。它允许你为异步操作的成功或失败指定处理方法。 这使得异步方法可以像同步方法那样返回值：异步方法会返回一个包含了原返回值的 promise 对象来替代原返回值。

具体应用

现在我们已经知道promise就是javascript下一个对象，也拥有自己的方法，用来处理javascript中的异步请求，比如ajax请求，文件的读写。

首先我们先来了解下promise的具体语法

new Promise(
    function(resolve, reject) {...} //在这个函数内可以进行一些耗时外部数据请求，其中两个参数也是函数，分别用来解决promise请求处理成功或失败
);

我们可以调用promise.then方法来对请求的数据进行处理显示。
下面是一个具体的例子

demo.js

console.log('start');
var myFirstPromise = new Promise(function(resolve, reject){
    //当异步代码执行成功时，我们才会调用resolve(...), 当异步代码失败时就会调用reject(...)
    //在本例中，我们使用setTimeout(...)来模拟异步代码，实际编码时可能是XHR请求或是HTML5的一些API方法.
    setTimeout(function(){
        resolve("成功!"); //代码正常执行！

    }, 2500);
});

console.log('hello');

myFirstPromise.then(function(successMessage){
    //successMessage的值是上面调用resolve(...)方法传入的值.
    //successMessage参数不一定非要是字符串类型，这里只是举个例子
    console.log("Yay! " + successMessage);
});
console.log('world');

控制台输出为

start
hello
world
Yay! 成功!

上面的例子中由于我在setTimeout函数中设置等待时间为2.5s，所以其他其他部分的代码就会先于请求代码执行，这也就是异步处理的实质了，将耗时的外部请求放在异步代码中，这样就不会影响主流程的执行，用户体验也会得到提升。

github在线demo地址 ：https://github.com/DQing/promise-demo