dynamic-object 只對外暴露了三個 api:observable
observe
Action
,分別是 動態化物件、 變化監聽 與 懶追蹤輔助函式。
下面以開發角度描述實現思路,同時作為反思,如果有更優的思路,我會隨時更新。
1. 術語解釋
本庫包含許多抽象概念,為了簡化描述,使用固定單詞指代,約定如下:
單詞 | 含義 |
---|---|
observable | dynamic-object 提供的最重要功能,將物件動態化的函式 |
observe | 監聽其回撥函式中當前訪問到的 observable 化的物件的修改,並在值變化時重新出發執行 |
observer | 指代 observe 中的回撥函式 |
2. 總體思路
如果單純的實現 observable
,使用 proxy 很簡單,可以完全監聽物件的變化,難點在於如何在 observe
中執行依賴追蹤,並當 observable
物件觸發 set
時,觸發對應 observe
中的 observer
。
每個 observable
物件觸發 get
時,都將當前所在的 object
+ key
與當前 observer
對應關係儲存起來,當其被 set
時,拿到對應的 observer
執行即可。
我們必須依賴持久化變數才能做到這一點,因為 observable
的 set
過程,與 observer
的 get
的過程是分開的。
3. 定義持久化變數
變數名 | 型別 | 含義 |
---|---|---|
proxies | WeakMap | 所有代理物件都儲存於此,當重複執行 observable 或訪問物件子屬性時,如果已經是 proxy 就從 proxies 中取出返回 |
observers | WeakMap<object, map<propertykey,=”” set<observer=””>>> |