善用Object.defineProperty巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置

Turbo 發(fā)布于2019-08-26 12:22 / 3416人閱讀

摘要：我今天的工作又遇到一個(gè)難題。前端右下角這個(gè)按鈕被設(shè)置為禁用狀態(tài)。這個(gè)按鈕的可用狀態(tài)由屬性控制。而行執(zhí)行之前，還沒有這個(gè)的屬性。我成功找到了我在尋找的給添加了的代碼位置。

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

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

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

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

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

我在Chrome開發(fā)者工具里執(zhí)行如下代碼，首先根據(jù)button的ID用ui.byId方法找到這個(gè)被禁用按鈕的實(shí)例，然后用Object.defineProperty給按鈕實(shí)例的屬性集合mProperties注入一個(gè)get方法，實(shí)現(xiàn)體只有一個(gè)debugger語句。如此一來，每次button的mProperties被訪問時(shí)，都會(huì)自動(dòng)觸發(fā)一個(gè)斷點(diǎn)。而mProperties屬性發(fā)生變化時(shí)，必定會(huì)先產(chǎn)生讀取動(dòng)作，因此斷點(diǎn)停下來時(shí)，我通過觀察調(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)自動(dòng)觸發(fā)了。我成功找到了我在尋找的給mProperties添加了enabled = false的代碼位置。

要獲取更多Jerry的原創(chuàng)技術(shù)文章，請(qǐng)關(guān)注公眾號(hào)"汪子熙"或者掃描下面二維碼:

GPU云服務(wù)器云服務(wù)器 js移除某個(gè)變量的值 js中變量的存儲(chǔ)位置一段巧妙的css 變量存儲(chǔ)位置

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/108559.html

相關(guān)文章

善用Object.defineProperty巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置

摘要：我今天的工作又遇到一個(gè)難題。前端右下角這個(gè)按鈕被設(shè)置為禁用狀態(tài)。這個(gè)按鈕的可用狀態(tài)由屬性控制。而行執(zhí)行之前，還沒有這個(gè)的屬性。我成功找到了我在尋找的給添加了的代碼位置。我今天的工作又遇到一個(gè)難題。前端UI右下角這個(gè)按鈕被設(shè)置為禁用(disabled)狀態(tài)。 showImg(https://segmentfault.com/img/remote/1460000016811187); 這...

happyhuangjinjin 2019-08-23 12:33 評(píng)論0 收藏0
JS進(jìn)階篇--JS apply的巧妙用法以及擴(kuò)展到Object.defineProperty的使用

摘要：的使用對(duì)象是由多個(gè)名值對(duì)組成的無序的集合。目標(biāo)屬性所擁有的特性返回值傳入函數(shù)的對(duì)象。是一種獲得屬性值的方法是一種設(shè)置屬性值的方法。參考相關(guān)閱讀鏈接基礎(chǔ)篇中的可枚舉屬性與不可枚舉屬性以及擴(kuò)展 Math.max 實(shí)現(xiàn)得到數(shù)組中最大的一項(xiàng) var array = [1,2,3,4,5]; var max = Math.max.apply(null, array); console.log(m...

jasperyang 2019-08-21 11:42 評(píng)論0 收藏0
編寫簡(jiǎn)單i18n庫(kù)

摘要：因?yàn)閮纱蔚拈_發(fā)維護(hù)體驗(yàn)產(chǎn)生了對(duì)比，使我產(chǎn)生了不小的興趣假設(shè)一個(gè)簡(jiǎn)單的頁面需要多語言。兩個(gè)簡(jiǎn)單的區(qū)別就是和替換的區(qū)別。樣式模式其實(shí)就是簡(jiǎn)單的切換。當(dāng)修改的某個(gè)值時(shí)，會(huì)觸發(fā)對(duì)應(yīng)的，并發(fā)射信號(hào)通知節(jié)點(diǎn)去更新。 i18n是什么？i18n（其來源是英文單詞internationalization的首末字符i和n，18為中間的字符數(shù)）是國(guó)際化的簡(jiǎn)稱。前言第一次接觸多語言是用野生javascri...

txgcwm 2019-08-26 11:46 評(píng)論0 收藏0
編寫簡(jiǎn)單i18n庫(kù)

摘要：因?yàn)閮纱蔚拈_發(fā)維護(hù)體驗(yàn)產(chǎn)生了對(duì)比，使我產(chǎn)生了不小的興趣假設(shè)一個(gè)簡(jiǎn)單的頁面需要多語言。兩個(gè)簡(jiǎn)單的區(qū)別就是和替換的區(qū)別。樣式模式其實(shí)就是簡(jiǎn)單的切換。當(dāng)修改的某個(gè)值時(shí)，會(huì)觸發(fā)對(duì)應(yīng)的，并發(fā)射信號(hào)通知節(jié)點(diǎn)去更新。 i18n是什么？i18n（其來源是英文單詞internationalization的首末字符i和n，18為中間的字符數(shù)）是國(guó)際化的簡(jiǎn)稱。前言第一次接觸多語言是用野生javascri...

DevWiki 2019-08-01 18:35 評(píng)論0 收藏0
js中對(duì)象屬性的整理

摘要：不管函數(shù)還是數(shù)據(jù)，都可以稱為某某對(duì)象的屬性。一些細(xì)節(jié)輸出結(jié)果如下可以看出，函數(shù)是有的數(shù)據(jù)屬性是創(chuàng)建對(duì)象時(shí)定義的，所有屬性特性都是是用定義的，默認(rèn)為數(shù)據(jù)屬性，所有屬性特性默認(rèn)為。訪問器屬性暫時(shí)想到的，就是通過改變?cè)搶傩愿淖儍?nèi)部多個(gè)屬性。都知道js是面向?qū)ο蟮模瑒?chuàng)建了對(duì)象后，對(duì)象中保存的就是一組組名值對(duì)，值可以是數(shù)據(jù)類型或函數(shù)。不管函數(shù)還是數(shù)據(jù)，都可以稱為某某對(duì)象的屬性。再細(xì)分，屬性可以...

lavor 2019-08-22 15:03 評(píng)論0 收藏0