ts：简单实现 mobx 的观察者模式 observable

mobx 状态管理器

• 订阅者：管理 变化后 回调的函数列表
• 观察者：将传入的数据监听起来，并且在有变化时，执行订阅者管理的函数列表

// 订阅者的函数列表，set结构，内部是 function
const list: Set<Function> = new Set()
// 订阅者,管理函数列表
const autoRun = (fn: Function) => {
  if (!list.has(fn)) {
    list.add(fn)
  }
}

// 观察者
const observable = <T extends object> (params: T) => {
  return new Proxy(params, {
    set (target, key, value, receiver) {
      const result = Reflect.set(target, key, value, receiver)
  
      // 可以自定义一些内容
      // 这里需要执行订阅者的回调函数，即 list 中所有函数
      list.forEach(fn => fn())
  
      return result
    }
  })
}

// 通过观察者创建数据
const proxyObservable = observable({
  name: '笑笑',
  attr: '真好看哈哈哈'
})
console.log('-----', proxyObservable.attr)

// 订阅者中新增一个函数
autoRun(() => {
  console.log('有变化了哈哈哈')
})

// 更新数据
proxyObservable.attr = '今天又好看了一点' // 有变化了哈哈哈
proxyObservable.name = 'blue' // 有变化了哈哈哈