善用Object.defineProperty巧妙找到修改某个变量的准确代码位置
我今天的工作又遇到一個難題。前端UI右下角這個按鈕被設(shè)置為"禁用(disabled)"狀態(tài)。
這個按鈕的可用狀態(tài)由屬性enabled控制。我通過調(diào)試發(fā)現(xiàn),一旦下圖第88行代碼執(zhí)行完畢之后,這個按鈕的屬性mProperties里就多出一個enabled:false的屬性。
而88行執(zhí)行之前,還沒有這個enabled:false的屬性。正是這個屬性讓按鈕進(jìn)入了禁用狀態(tài)。
我單步調(diào)試setModel函數(shù),花了半個小時的時間也沒能找到這個enabled屬性到底是在哪一行代碼加進(jìn)去的。
于是我只有尋求其他辦法。我想到了Object.defineProperty這個方法:
我在Chrome開發(fā)者工具里執(zhí)行如下代碼,首先根據(jù)button的ID用ui.byId方法找到這個被禁用按鈕的實(shí)例,然后用Object.defineProperty給按鈕實(shí)例的屬性集合mProperties注入一個get方法,實(shí)現(xiàn)體只有一個debugger語句。如此一來,每次button的mProperties被訪問時,都會自動觸發(fā)一個斷點(diǎn)。而mProperties屬性發(fā)生變化時,必定會先產(chǎn)生讀取動作,因此斷點(diǎn)停下來時,我通過觀察調(diào)用棧的上下文就能夠找到是哪一行代碼修改了mProperties。
var ui = sap.ui.getCore();var button = ui.byId("button97DXvDVKUawkYgK3YQVram_64");Object.defineProperty(button, "mProperties", { get: function(){ debugger;}});現(xiàn)在就來試試。果然斷點(diǎn)自動觸發(fā)了。我成功找到了我在尋找的給mProperties添加了enabled = false的代碼位置。
要獲取更多Jerry的原創(chuàng)技術(shù)文章,請關(guān)注公眾號"汪子熙"或者掃描下面二維碼:
總結(jié)
以上是生活随笔為你收集整理的善用Object.defineProperty巧妙找到修改某个变量的准确代码位置的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 比亚迪云辇系统重要信息提前透露:为智能车
- 下一篇: SAP CRM和Cloud for Cu