码迷,mamicode.com
首页 > 编程语言 > 详细

读书——javascript异步编程

时间:2016-01-29 21:11:43      阅读:298      评论:0      收藏:0      [点我收藏+]

标签:

两种基本的设计模式。

1.PubSub 模式是一种将回调赋值给已命名事件的回调组织方式

2.Promise 对象是一种表示一次性事件的直观对象。

还有Async.js的工作流控制,Async utilities for node and the browser

https://github.com/caolan/async

还有Tim Caswell 的Step①是一个轻量级的JavaScript 库。

https://github.com/creationix/step

 

1.PubSub(Publish/Subscribe,意为“发布/订阅”)模式来分发事件。沿着这个思路,我们会看到PubSub 模式的一些具体表现:

Node 的EventEmitter 对象、Backbone 的事件化模型和jQuery 的自定义事件。在这些工具的帮助下,我们能解嵌套那些嵌套式回调,

减少重复冗余,最终编写出易于理解的事件驱动型代码。

 

(1)emitter.on(‘evacuate‘, function(message) {
console.log(message);
});

emitter.emit(‘evacuate‘);

 

(2)$.Callbacks  http://api.jquery.com/jQuery.Callbacks/

(3)jQuery 的名称空间化事件:如果绑定了名称为"click.tbb" 和"hover.tbb" 的两个事件, 则简单地调用unbind(".tbb")就可以同时解绑定它们。

Backbone.js 允许向"all"事件类型绑定事件处理器,这样不管发生什么事,都会导致这些事件处理器的触发。

jQuery 和Backbone.js 都支持用空格隔开多个事件来同时绑定或触发多种事件类型,譬如"keypress mousemove"。

 (4)同步性

尽管PubSub 模式是一项处理异步事件的重要技术,但它内在跟异步没有任何关系

$(‘input[type=submit]‘)
.on(‘click‘, function() { console.log(‘foo‘); })
.trigger(‘click‘);
console.log(‘bar‘);
这段代码的输出为:

foo
bar

这证明了click 事件的处理器因trigger 方法而立即被激活。事实
上,只要触发了jQuery 事件,就会不被中断地按顺序执行其所有事
件处理器。

(5) 事件化模型

模型事件的传播 

事件循环与嵌套式变化

(6)jQuery自定义事件

trigger(会冒泡) 或 triggerHandler(不冒泡)

原生自定义事件:https://developer.mozilla.org/zh-CN/docs/Web/Guide/Events/Creating_and_triggering_events

var event = new Event(‘build‘);
// Listen for the event.
elem.addEventListener(‘build‘, function (e) { ... }, false);
// Dispatch the event.
elem.dispatchEvent(event);

IE下:https://msdn.microsoft.com/en-us/library/ms536390(v=vs.85).aspx

document.createEventObject 

2.promise

(1)jQuery的deferred对象详解 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html

(2)补充:

var errorPromise = $(‘.error‘).fadeIn().promise();
errorPromise.done(afterErrorShown);

以下3 行代码现在是等效的。
$(onReady);
$(document).ready(onReady);
$.ready.promise().done(onReady);

(3)进度通知

progress notify

对处于挂起状态的Deferred 对象调用
notify 时,运行的是progress 回调。

(4)管道链接未来

pipe

var getPromise = $.get(‘/query‘);
var postPromise = getPromise.pipe(function(data) {
  return $.post(‘/search‘, data);
});

pipe 最多能接受3个参数,它们对应着Promise 对象的3 种回调类型:done、fail 和progress

var pipedPromise = originalPromise.pipe(successCallback);

var pipedPromise = originalPromise.pipe(null, failCallback);

 

var promise2 = promise1.pipe(null, null, function(progress) {
  return Math.floor(progress * 100) + ‘% complete‘;
});

 

var step1 = $.post(‘/step1‘, data1);
var step2 = step1.pipe(function() {
  return $.post(‘/step2‘, data2);
});
var lastStep = step2.pipe(function() {
  return $.post(‘/step3‘, data3);
});

 

var posting = $.post(‘/step1‘, data1)
  .pipe(function() {
    return $.post(‘/step2‘, data2);
  })
  .pipe(function() {
    return $.post(‘/step3‘, data3);
  });

 

var posting = $.post(‘/step1‘, data1)
  .pipe(function() {
    return $.post(‘/step2‘, data2)
      .pipe(function() {
        return $.post(‘/step3‘, data3);
      });
  });

(4)jQuery 与Promises/A 的对比

从功能上看,jQuery 的Promise 与CommonJS 的Promises/A 几乎完全
一样。

Q.js 库是最流行的Promises/A 实现,其提供的方法甚至能与
jQuery 的Promise 和谐共存。这两者的区别只是形式上的,即用相同
的词语表示不同的含义。

而Q.js 可以轻松“消化”jQuery 的Promise 对象。
var qPromise = Q.when(jqPromise);
只要这两套标准仍然存在差异,这就是让它们融洽相处的最好方法。

 

读书——javascript异步编程

标签:

原文地址:http://www.cnblogs.com/fanyegong/p/5150586.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!