zoukankan      html  css  js  c++  java
  • 读书——javascript异步编程

    两种基本的设计模式。

    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);
    只要这两套标准仍然存在差异,这就是让它们融洽相处的最好方法。

  • 相关阅读:
    OleDbCommand 的用法
    递归求阶乘
    C#重写窗体的方法
    HDU 5229 ZCC loves strings 博弈
    HDU 5228 ZCC loves straight flush 暴力
    POJ 1330 Nearest Common Ancestors LCA
    HDU 5234 Happy birthday 01背包
    HDU 5233 Gunner II 离散化
    fast-IO
    HDU 5265 pog loves szh II 二分
  • 原文地址:https://www.cnblogs.com/fanyegong/p/5150586.html
Copyright © 2011-2022 走看看