一.策论模式（计算年终奖案例）

var countTotal = {
    S: function (salary) {
      return salary * 4;
    },
    A: function (salary) {
      return salary * 3;
    },
    B: function (salary) {
      return salary * 2;
    },
    C: function (salary) {
      return salary * 1;
    },
  };
  const aa = 'S';
  console.log(countTotal[aa](500));

二.发布订阅（观察者模式）

1.首先要定义一个发布订阅的类 里面包含一个定义的数组 和发布的方法和订阅的方法

const login = {
  list: {},
  //发布的方法
  publish(key) {
    console.log(key); //代表的是发布的类型
    this.list[key].map((dt) => {
      dt();
    });
  },

  //订阅的方法
  order(key, val) {
  //里面的两个参数分别是类型和对应的函数
    if (!this.list[key]) {
      this.list[key] = [];
    }
    this.list[key].push(val);
  },
};

第一个人写自己的业务定义一个函数自己的逻辑然后调用，调用发布订阅的类里面的订阅函数

function one() {
  function aa() {
    console.log('我是aa业务');
  }
  function bb() {
    console.log('我是bb业务');
  }
  // 订阅
  login.order('普通', aa);
  login.order('普通', bb);
}
one();

第二个人写自己的业务定义一个函数自己的逻辑然后调用 调用发布订阅的类里面的订阅函数

function two() {
  function cc() {
    console.log('我是vipcc业务');
  }
  //进行订阅
  login.order('vip', cc);
}
two();

不影响登录的情况下设置一个按钮设置点击事件 ，在点击事件里面调用发布订阅类的发布方法

export default function index() {
  const onClick = () => {
    // 发布
    login.publish('普通');
    login.publish('vip');
  };
  return (
    <div>
      <Button onClick={onClick}>测试发布订阅</Button>
    </div>
  );
}

订阅和发布的对应