// 主題對象
class Subject {
  constructor() {
    this.observers = [];  // 觀察者列表
  }
  
  // 添加觀察者
  addObserver(observer) {
    this.observers.push(observer);
  }
  
  // 刪除觀察者
  removeObserver(observer) {
    const index = this.observers.indexOf(observer);
    if (index !== -1) {
      this.observers.splice(index, 1);
    }
  }
  
  // 通知所有觀察者狀態(tài)的變化
  notify() {
    for (const observer of this.observers) {
      observer.update(this);
    }
  }
  
  // 更改狀態(tài)，并通知所有觀察者
  setState(state) {
    this.state = state;
    this.notify();
  }
}

// 觀察者對象
class Observer {
  // 接收主題對象，并將自己添加到主題的觀察者列表中
  constructor(subject) {
    subject.addObserver(this);
  }
  
  // 接收通知并進行相應的處理
  update() {
    console.log('Observer update:', this);
  }
}

// 創(chuàng)建主題和觀察者對象
const subject = new Subject();
const observer1 = new Observer(subject);
const observer2 = new Observer(subject);

// 更改主題狀態(tài)，并通知所有觀察者
subject.setState('new state');

// 注冊事件監(jiān)聽
document.addEventListener('click', function() {
  console.log('click事件觸發(fā)了！');
});

// 定義對象屬性
let data = { name: '小明', age: 20 };

// 通過Object.defineProperty()方法添加get/set方法
Object.defineProperty(data, 'name', {
  get: function() {
    return this._name;
  },
  set: function(newName) {
    console.log(`修改name屬性為：${newName}`);
    this._name = newName;
  }
});

// 修改對象屬性
data.name = '小紅';

// 創(chuàng)建自定義事件對象
const event = new Event('myCustomEvent');

// 注冊事件監(jiān)聽
document.addEventListener('myCustomEvent', function(event) {
  console.log('自定義事件觸發(fā)了！');
});

// 觸發(fā)自定義事件
document.dispatchEvent(event);

// 創(chuàng)建promise對象
const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Promise執(zhí)行成功！');
  }, 1000);
});

// 注冊promise狀態(tài)變化的回調(diào)函數(shù)
promise.then(function(data) {
  console.log(data);
});

// 創(chuàng)建Pub/Sub對象
const pubsub = {
  subscribers: {},
  subscribe(eventName, handler) {
    // 添加事件訂閱者
    if (!this.subscribers[eventName]) {
      this.subscribers[eventName] = [];
    }
    this.subscribers[eventName].push(handler);
  },
  unsubscribe(eventName, handler) {
    // 取消事件訂閱者
    if (!this.subscribers[eventName]) {
      return;
    }
    const index = this.subscribers[eventName].indexOf(handler);
    this.subscribers[eventName].splice(index, 1);
  },
  publish(eventName, data) {
    // 發(fā)布事件
    if (!this.subscribers[eventName]) {
      return;
    }
    this.subscribers[eventName].forEach((handler) => {
      handler(data);
    });
  },
};

// 訂閱事件
pubsub.subscribe('myEvent', function(data) {
  console.log(`收到myEvent事件，數(shù)據(jù)為：${data}`);
});

// 發(fā)布事件
pubsub.publish('myEvent', 'Hello World!');