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

  • 相关阅读:
    bwapp之xss(blog)
    渗透测试平台bwapp简单介绍及安装
    用glob()函数返回目录下的子文件以及子目录
    常见编码解码脚本
    生成以指定字符为开头的md5值(6位数字)
    从1到n的阶乘的和(python)
    python循环解码base64
    BASE64编码原理分析脚本实现及逆向案例
    史上最完整的MySQL注入
    初探APT攻击
  • 原文地址:https://www.cnblogs.com/fanyegong/p/5150586.html
Copyright © 2011-2022 走看看