举例详解JavaScript中Promise的使用

213 阅读 0 评论 141 点赞

我是靠谱客的博主俏皮太阳，最近开发中收集的这篇文章主要介绍举例详解JavaScript中Promise的使用，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

摘录 – Parse JavaScript SDK现在提供了支持大多数异步方法的兼容jquery的Promises模式，那么这意味着什么呢，读完下文你就了解了。

“Promises” 代表着在javascript程序里下一个伟大的范式，但是理解他们为什么如此伟大不是件简单的事。它的核心就是一个promise代表一个任务结果，这个任务有可能完成有可能没完成。Promise模式唯一需要的一个接口是调用then方法，它可以用来注册当promise完成或者失败时调用的回调函数，这在CommonJS Promises/A proposal.大体讲到了。比如，我想保存一个Prase.Object对象，这是个异步操作，在旧的回调范式中，你的代码可能这样写:

object.save({ key: value }, {
 success:function(object) {
  // the object was saved.
 },
 error:function(object, error) {
  // saving the object failed.
 }
});
在新的Promise范式中，同样的代码你可以这样写:
 
object.save({ key: value }).then(
 function(object) {
  // the object was saved.
 },
 function(error) {
  // saving the object failed.
 });

没有多大的区别？那么有啥大不了的地方呢？好吧，promises的真正强大之处在于多重的链接，当调用promise.then(func)时返回一个新的promise，它不会执行直到上一个完成。但是这里有一种特殊的情况，如果我的回调通过then返回一个新的promise，那么通过then返回的promise将不会执行，直到回调执行完成。详细细节请参考 Promises/A+，这是个复杂的规则，通过例子我们能更清楚的认识下.

假设你写了段登陆的代码，查找对象然后更新它。在旧的回调范式中，你可以使用金字塔式的代码完成:

Parse.User.logIn("user","pass", {
 success:function(user) {
  query.find({
   success:function(results) {
    results[0].save({ key: value }, {
     success:function(result) {
      // the object was saved.
     }
    });
   }
  });
 }
});

这看起来已经很可笑，更可笑的是甚至没有任何错误处理。但是promise链式的结构，使代码看起来更舒服了:

Parse.User.logIn("user","pass").then(function(user) {
 returnquery.find();
}).then(function(results) {
 returnresults[0].save({ key: value });
}).then(function(result) {
 // the object was saved.
});

哇!好多啦！

错误处理

上面的代码简单期间没有添加错误处理，但是添加了后你会发现在旧的回调代码中一团糟:

Parse.User.logIn("user","pass", {
 success:function(user) {
  query.find({
   success:function(results) {
    results[0].save({ key: value }, {
     success:function(result) {
      // the object was saved.
     },
     error:function(result, error) {
      // An error occurred.
     }
    });
   },
   error:function(error) {
    // An error occurred.
   }
  });
 },
 error:function(user, error) {
  // An error occurred.
 }
});

由于promises知道处理是否完成，它可以传递错误，不执行任何回调直到遇到错误。比如，上面的代码可以简写为:

Parse.User.logIn("user","pass").then(function(user) {
 returnquery.find();
}).then(function(results) {
 returnresults[0].save({ key: value });
}).then(function(result) {
 // the object was saved.
},function(error) {
 // there was some error.
});

通常，开发者认为一个异步的promise失败等同于抛出一个异常。事实上，如果一个回调抛出一个错误，promise将返回失败信息。把错误传递到下一个可用的错误处理器等同于抛出一次异常直到捕获处理。

jQuery, Backbone, 和 Parse

有很多实现了promises的库供开发者可用。像jQuery的 Deferred, 微软的 WinJS.Promise, when.js, q, 和dojo.Deferred.

然而，有个有趣的地方需要了解。你可以在这里读到 long and fascinating jQuery pull request discussion, jQuery的实现没有完全按照Promises/A的规则来，很多地方用了其他实现方式，实验时，我发现只有一个地方不太一样。如果一个错误处理器返回一些其他的信息，而不单纯返回一个promise，大多数实现会考虑处理这个错误，不做错误传递。然而，jquery不认为在此处处理这个错误，而是把它向前传递。虽然，来自不同系统的promise应该能无缝的混合使用，但是你还是应当注意些。一个潜在的问题是会在错误处理器中返回promises（替换原始数值），因为它们会被同等对待。

doFailingAsync().then(function() {
 // doFailingAsync doesn't succeed.
},function(error) {
 // Try to handle the error.
 return"It's all good.";
}).then(function(result) {
 // Non-jQuery implementations will reach this with result === "It's all good.".
},function(error) {
 // jQuery will reach this with error === "It's all good.".
});

在 Backbone 0.9.10最新版本中，异步方法现在返回一个 jqXHR，这是jquery promise的一种类型。Parse JavaScript SDK的一个目标是尽可能的和Backbone兼容，我们不能返回一个jqXHR，因为它在 Cloud Code上不能很好地工作，因此，我们不都添加一个 Parse.Promise类，它遵照jQuery Deferred的标准。 Parse JavaScript SDK最新版本已经更新了所有的异步方法来支持这些新的对象，旧的回调方法仍然可用。但是基于上面列出的例子，我相信你更喜欢新的方式。所以试试promises吧！