原生js實現檢測物件變化。
通過把屬性轉換為訪問器屬性,實現監聽。
物件屬性的更改通過設定 get, set。
陣列型別元素的更改通過在prototype過載運算元據的方法:slice、push、shift……
const op =object.prototype;const types =
const oam = ['push', 'pop', 'shift', 'unshift', 'short', 'reverse', 'splice']
class jsonob
this._callback =cb;
this
.observe(obj);
}observe(obj, path)
object.keys(obj).foreach((key)=>
else
object.defineproperty(obj, key, ,
set: (
function
(newval)
this
._callback(newval, oldval, patharray)
oldval =newval}}
).bind(
this
) })
if (op.tostring.call(obj[key]) === types.obj || op.tostring.call(obj[key]) ===types.array) },
this
) }
overridearrayproto(array, path) })}
);//最後 讓該陣列例項的 __proto__ 屬性指向 假的原型 overrideproto
array.__proto__ =overrideproto;
}}var data =
}}var cb = (...val)=>
var rreess = new
jsonob(data,cb);
data.level1.level2.d = 50data.a = 998data.level1.c.unshift(0)
js 監聽URL的hash變化
專案中使用antdui元件 react 裡面使用了menu元件管理目錄結構,不同目錄元件頁面之中有點選按鈕進行不同目錄的跳轉,因為是各種元件的關係,點選各元件後準確跳轉到目標頁面沒有問題,但是左側目錄結構不能進行有效的收縮和展開的動作,故使用js來監聽url的hash變化的方式進行接下來的邏輯行為 ...
JS監聽DOM結構變化
在做乙個微博的接入,需要判斷微博是否被關注,要檢查微博標籤的div是否有 已關注 的字元,但這個div的內容是微博jssdk動態生成。id html 是獲取不到我想要的內容。原因是當我們獲取的時候內容還沒有改變,所以獲取不到,如果就想到監聽這個div內容變化後,再來獲取就個時候就能獲取到了。於是產生...
JS監聽DOM結構變化
在做乙個微博的接入,需要判斷微博是否被關注,要檢查微博標籤的div是否有 已關注 的字元,但這個div的內容是微博jssdk動態生成。id html 是獲取不到我想要的內容。原因是當我們獲取的時候內容還沒有改變,所以獲取不到,如果就想到監聽這個div內容變化後,再來獲取就個時候就能獲取到了。於是產生...