javascript设计模式:方法的链式调用

(function($) {

  $.fn.fetch = function(url) {
    var queue = new Queue;
    this.each(function() {
      var el = this;
      queue.add(function(resp) {
        $(el).html(resp);
      });
    });
    $.ajax({
      url: url,
      dataType: ''html'',
      success: function(html) {
        queue.flush(html);
      }
    });
    return this;
  };

})(jQuery);

这样，我们就可以异步的获取内容，并继续我们的链式调用。

$("<div/>")
  .fetch(''/server/navigation.html'')
  .addClass(''column'')
  .appendTo(''#side'');

查看demo页看看效果。

如果一个队列中有很多项等待对服务器端的响应进行操作，该如何处置？作者构建了这样一个方法，值得参考：

function fetchTweet(url) {
  this.queue = new Queue;
  this.tweet = "";
  var self = this;
  ajax(url, function(resp) {
    self.tweet = resp;
    self.queue.flush(this);
  });
}
fetchTweet.prototype = {
  linkify: function() {
    this.queue.add(function(self) {
      self.tweet = self.tweet.replace(/\b@(\w{1,20}\b/g, ''$1'');
    });
  return this;
  },
  filterBadWords: function() {
    this.queue.add(function(self) {
      self.tweet = self.tweet.replace(/\b(fuck|shit|piss)\b/g, "");
    });
  return this;
  },
  appendTo: function(selector) {
    this.queue.add(function(self) {
      $(self.tweet).appendTo(selector);
    });
  return this;
  }
};

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!