zoukankan      html  css  js  c++  java
  • (四)JS学习笔记

    理解观察者模式

    简单的讲,一个对象作为特定任务或是另一对象的活动的观察者,并且在这个任务或活动发生时,利用事件的形式通知观察者。

    观察者的使用场合

    当一个对象的改变需要同时改变其它对象,并且它不知道具体有多少对象需要改变的时候,就应该考虑使用观察者模式。

    例如,用户A,B,C分别订阅某服务,当服务有更新是可设定更新、下载等操作。

    模拟实现

    定义Observable对象,其内部包含了2个方法:add(订阅)与fire(发布)方法

    // 观察者
    var Observable = {
      callbacks: [],
      add: function(fn) {
        this.callbacks.push(fn);
      },
      fire: function() {
        this.callbacks.forEach(function(fn) {
          fn();
        })
      }
    }

    订阅

    1 Observable.add(function() {
    2     console.log(1);
    3 })
    4 Observable.add(function() {
    5     console.log(2);
    6 })

    发布

    Observable.fire();     // 1, 2

    实际应用

    实际业务中,如请求某个ajax后需要执行多个方法,数据处理、渲染页面、其他业务等,可以使用观察者

     1 Observable.add(function() {
     2   //pocessData
     3 })
     4 
     5 Observable.add(function() {
     6   $('test').html(data.a)
     7   $('test2').html(data.b)
     8   $('test3').html(data.c)
     9 })
    10 
    11 Observable.add(function() {
    12   //pocessOther
    13 })
    14 
    15 $.ajax({
    16   url: "test.html",
    17   context: document.body
    18 }).done(function(data) {
    19   Observable.fire(data)
    20 })
  • 相关阅读:
    HashMap数据结构分析(jdk8)
    ConcurrentHashMap数据结构(jdk8)
    TOJ1373_多项式规律
    Windows程序基础——Windows应用程序的基本概念
    Why to learn MFC?
    TOJ1062
    TOJ1369
    TOJ1003
    vue 生命周期~~
    如何跨域访问的两种方法~
  • 原文地址:https://www.cnblogs.com/huair_12/p/4175549.html
Copyright © 2011-2022 走看看