前言

本文主要給大家介紹的是關(guān)于使用Object.defineProperty巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置的相關(guān)內(nèi)容，分享出來(lái)供大家參考學(xué)習(xí)，下面話不多說(shuō)了，來(lái)一起看看詳細(xì)的介紹吧

語(yǔ)法

Object.defineProperty(obj, prop, descriptor)

參數(shù)

• obj 需要定義屬性的對(duì)象。
• prop 需被定義或修改的屬性名。
• descripter 需被定義或修改的屬性的描述符。

發(fā)現(xiàn)問(wèn)題

最近的工作又遇到一個(gè)難題。前端UI右下角這個(gè)按鈕被設(shè)置為"禁用(disabled)"狀態(tài)。

這個(gè)按鈕的可用狀態(tài)由屬性enabled控制。我通過(guò)調(diào)試發(fā)現(xiàn)，一旦下圖第88行代碼執(zhí)行完畢之后，這個(gè)按鈕的屬性mProperties里就多出一個(gè)enabled:false的屬性。

而88行執(zhí)行之前，還沒(méi)有這個(gè)enabled:false的屬性。正是這個(gè)屬性讓按鈕進(jìn)入了禁用狀態(tài)。

我單步調(diào)試setModel函數(shù)，花了半個(gè)小時(shí)的時(shí)間也沒(méi)能找到這個(gè)enabled屬性到底是在哪一行代碼加進(jìn)去的。

解決方法

于是我只有尋求其他辦法。我想到了Object.defineProperty這個(gè)方法：

我在Chrome開(kāi)發(fā)者工具里執(zhí)行如下代碼，首先根據(jù)button的ID用ui.byId方法找到這個(gè)被禁用按鈕的實(shí)例，然后用Object.defineProperty給按鈕實(shí)例的屬性集合mProperties注入一個(gè)get方法，實(shí)現(xiàn)體只有一個(gè)debugger語(yǔ)句。如此一來(lái)，每次button的mProperties被訪問(wèn)時(shí)，都會(huì)自動(dòng)觸發(fā)一個(gè)斷點(diǎn)。而mProperties屬性發(fā)生變化時(shí)，必定會(huì)先產(chǎn)生讀取動(dòng)作，因此斷點(diǎn)停下來(lái)時(shí)，我通過(guò)觀察調(diào)用棧的上下文就能夠找到是哪一行代碼修改了mProperties。

var ui = sap.ui.getCore();

var button = ui.byId("button97DXvDVKUawkYgK3YQVram_64");

Object.defineProperty(button, "mProperties", { get: function(){ debugger;}});

現(xiàn)在就來(lái)試試。果然斷點(diǎn)自動(dòng)觸發(fā)了。我成功找到了我在尋找的給mProperties添加了enabled = false的代碼位置。

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，如果有疑問(wèn)大家可以留言交流，謝謝大家對(duì)腳本之家的支持。