设计模式学习与应用【玩转前端】

/**
 * 用户-基础信息
 */
const _userBaseInfo = () => {
  const obj = {
    name: '张三',
    phone: '123456',
    sex: '男',
  };
  return obj;
};

/**
 * 用户-收货地址信息
 */
const _userAddressInfo = () => {
  const obj = {
    province: '北京市',
    city: '北京市',
    region: '昌平',
  };
  return obj;
};

/**
 * 用户-订单信息
 */
const _userOrderInfo = () => {
  const obj = {
    orderNo: '123',
    price: '129',
    goodName: '帽子',
  };
  return obj;
};

/**
 * 用户-购物信息
 */
const getUserInfo = () => {
  const baseInfo = _userBaseInfo();
  const addressInfo = _userAddressInfo();
  const orderInfo = _userOrderInfo();
  const obj = {
    ...baseInfo,
    ...addressInfo,
    ...orderInfo,
  };
  return obj;
};

const userInfo = getUserInfo();
console.log({ userInfo }); 
// 打印结果
// {
//   userInfo: {
//     name: '张三',
//     phone: '123456',
//     sex: '男',
//     province: '北京市',
//     city: '北京市',
//     region: '昌平',
//     orderNo: '123',
//     price: '129',
//     goodName: '帽子'
//   }
// }

/**
 * 二手书网站 提供购买和出售两种交易方式
 */
class BookTrading {
  // 购买图书
  buyBook(props) {
    props = props ? props : {};
    let res = '购买了' + props.amount + '本' + props.name;
    console.log(res);
  }
  // 出售图书
  recoveryBook(props) {
    props = props ? props : {};
    let res = '出售了' + props.amount + '本' + props.name;
    console.log(res);
  }
}

/**
 * 多抓鱼二手书交易平台
 */
class Duozhuayu extends BookTrading {
  constructor() {
    super();
  }
  buy(props) {
    // 购买图书
    this.buyBook(props);
  }
  buyDelivery(props) {
    // 购买图书
    console.log('顺丰一日送达:');
    this.buyBook(props);
  }
  recovery(props) {
    // 出售图书
    this.buyBook(props);
  }
  recoveryPickUp(props) {
    console.log('顺丰上门取件:');
    this.recoveryBook(props);
  }
}

const duozhuayu = new Duozhuayu();
duozhuayu.buy({ name: '书店日记', amount: 2 });
duozhuayu.buyDelivery({ name: '中国地理杂志', amount: 5 });
duozhuayu.recovery({ name: '乌合之众', amount: 1 });
duozhuayu.recoveryPickUp({ name: '局外人', amount: 1 });
// 打印结果
// 购买了2本书店日记
// 顺丰一日送达:
// 购买了5本中国地理杂志
// 购买了1本乌合之众
// 顺丰上门取件:
// 出售了1本局外人

// 观察者
class Observer {
  constructor(name) {
    this.name = name;
  }
  update(info) {
    // 只有添加到货通知权限的才进行到货提醒
    if (info.notifyType === 'add') {
      this.remindArrival(info.goodName);
    } else if (info.notifyType === 'cancel') {
      console.log(`${this.name}取消到货提醒，不会接受到系统提醒。`);
    } else {
      console.log(`${this.name}没有添加到货提醒`);
    }
  }
  // 到货提醒
  remindArrival(info) {
    console.log(`亲爱的${this.name}，您关注的宝贝${info}已到货！`);
  }
}

class Subject {
  constructor() {
    this.observerList = [];
  }
  // 订阅
  subscribe(observer) {
    observer.notifyType = 'add';
    this.observerList.push(observer);
  }
  // 取消订阅
  unsubscribe(observerRemove) {
    observerRemove.notifyType = 'cancel';
    this.observerList.push(observerRemove);
  }
  // 到货提醒
  notice(good) {
    this.observerList.forEach(observer => {
      let obj = {
        ...good,
        ...observer,
      };
      observer.update(obj);
    });
  }
}

const subject = new Subject();
const obsA = new Observer('消费者A');
const obsB = new Observer('消费者B');
const obsC = new Observer('消费者C');

// obsA obsB 添加了到货提醒
subject.subscribe(obsA);
subject.subscribe(obsB);
// obsC 取消到货提醒
subject.unsubscribe(obsC);

// 商品外套已到货
const goodCoat = {
  goodName: '外套',
};

// 通知添加到货提醒的消费者
subject.notice(goodCoat);