Backbone - 从触发器调用的 Chrome 调试函数答案

【问题标题】：Backbone - Chrome debug function called from triggerBackbone - 从触发器调用的 Chrome 调试函数
【发布时间】：2016-08-02 20:37:59
【问题描述】：

Backbone 允许您在其他类中触发函数 - 如果您正确使用 Backbone.Events。

a.js
MyApp.vent.on("some:trigger", function(){
 // ...
});

b.js
function test(){
    doSomething();       
    MyApp.vent.trigger("some:trigger");
}

你知道在调试 doSomething() 之后到达函数“some:trigger”的一些方法吗？（无需在代码中找到它并在其上放置断点）。

【问题讨论】：

【解决方案1】：

您可以blackbox Backbone 代码。然后当你进入MyApp.vent.trigger("some:trigger")时，Chrome 会跳过所有的 Backbone 代码，直接进入你的处理程序代码。

上面链接的文档有点过于复杂了。您所要做的就是在源代码查看器中右键单击 Backbone 文件并选择“Blackbox Script”。然后进入trigger 通话。

【讨论】：

【解决方案2】：

您可以使用Debugging JavaScript by Redefining Functions 的概念。这实质上就是覆盖原函数，注入debugger语句，然后调用原函数继续正常执行。

示例

我使用了命名函数而不是匿名函数，以便以后可以引用它。

MyApp.event.on("some:trigger", myFunc);

现在我可以存储原始函数的副本，以便在调试后调用。

var oldFunc = myFunc;

myFunc = function() {
    debugger; // or use console.log()
    return oldFunc.apply(this, arguments);
}

这可以在控制台或代码片段中调用，以便下次您运行代码时，它会中断（或在 console.log 语句的情况下记录输出）。

这样做的好处是，无论触发器处理程序在代码中执行多少个位置，或者它总是会中断多少次，都无关紧要。您不必使用调试器控件单步执行所有以前的代码。对于单个案例，单步执行就足够了。

【讨论】：

我有点害怕这个解决方案，因为它打开了生产空间：\
@GabrielSantosCarvalho 您不会在代码中进行这些更改。您只需在需要时在控制台/代码段中实时运行覆盖。当您在许多地方调用您的处理程序时，这很棒，因为您不需要一直单步执行。如果您只有一个对您的处理程序的引用，那么这是矫枉过正并且单步执行是有道理的。这取决于你的情况。