问题缘起
看的是别人的项目,希望了解它的某一处的数据在哪里组装出来的。
它数据组装的触发时机是在子节点变化的时候,于是我通过Break on→subtree modifications进入了断点。
现在问题是:这些方法都可能多次在其他处调用,我不可能直接在此处打断点(那会组装的数据不是我想要的,我只能顺着这个堆栈调用找上去)
举个例子,断点在c函数里面,沿着往上找进入b,但是b沿着网上找就进入a了,可是!!!我需要的data属于这个堆栈中间调用过程,这个怎么能最快定位到这个过程中foo进入堆栈的状态(因为那是我要追踪的数据来源)?
问题分析
chrome的断点看到的函数调用堆栈,它的搜索线只能看到调用的当前状态的,而实际中间两个状态之间可能还有很多进栈出栈的过程。这些过程不能立即体现出来。
利用Restart Frame进入中间堆栈状态
When at a breakpoint inside debugger mode, you can conveniently restart the current stack frame by right clicking the call stack and selecting Restart Frame
. This can be useful to inspect the current frame without reloading the page with a new breakpoint.
这样就可以进一步追溯两个堆栈之间的调用之间的堆栈过程了。
怎么能知道一个对象的属性什么时候添加进来?
最后发现数据来源于一个this.data,如何知道这个this.data是什么时候设置上去的呢?
在某个堆栈中,我对它某个对象上某个属性foo在哪里set的特别感兴趣,我怎么才能追踪到这个属性在哪里设置的呢?
只能全局搜索.foo
或["foo"]
或者,"foo",
(万一这个foo的命名比较常见得搜到什么时候,要是chrome调试支持监听对象属性就厉害了)