定义全局变量x时,Firebug会中断

时间:2022-11-05 20:09:32

We have a very large JavaScript application, where after many months of coding there have inevitably sprung a couple scope slip ups where a variable is defined without using the var keyword in the following fashion:

我们有一个非常大的JavaScript应用程序,经过几个月的编码后,不可避免地会产生一些范围滑动,其中定义变量而不使用以下方式的var关键字:

function() {  
  x = 5; ...  
}

instead of:

function() {  
  var x = 5; ...  
}

This is happening somewhere - we're not sure where - and searching for the variable name in question is difficult, since it's a common word that appears 1000s of times in our source.

这发生在某个地方 - 我们不确定在哪里 - 并且搜索有问题的变量名称很困难,因为它是我们源代码中出现1000次的常用词。

Is there a way to ask Firebug to break on the line that first creates a given global variable? To clarify, I would like to break at exactly the instant when window.x switches from undefined to a defined value, and to break statement.

有没有办法让Firebug在首先创建给定全局变量的行上中断?为了澄清,我想在window.x从undefined切换到定义值,以及break语句的那一刻完全中断。

I've tried creating a watch expression and hoped I could turn it into a breakpoint, but I can't seem to create watch expressions without some kind of context or scope.

我已经尝试创建一个监视表达式,并希望我可以把它变成一个断点,但我似乎无法在没有某种上下文或范围的情况下创建监视表达式。

If this isn't possible with Firebug, I'd be interested in anything that can accomplish this in Firefox in general.

如果使用Firebug无法做到这一点,我会对能在Firefox中实现这一目标的任何事情感兴趣。

5 个解决方案

#1


Provided a few things

提供了一些东西

  1. You know the name of the variable
  2. 您知道变量的名称

  3. You don't have a variable with that name in the global scope (declared outside functions), but only inside functions.
  4. 在全局范围(在函数外部声明)中没有具有该名称的变量,但仅在内部函数中。

  5. There are calls to the function that declares the variable.
  6. 有函数调用声明变量。

this little script would do the trick:

这个小脚本可以解决这个问题:

<script type="text/javascript">
window.__defineSetter__("x", function(value) { console.trace(); });
x = 1;
</script>

You'll get a trace of the executed code before that assignment.

在分配之前,您将获得执行代码的跟踪。

It may fail to report some situations, so take a look at JSLint. Load all your JS files right there and lint them.

它可能无法报告某些情况,因此请查看JSLint。将所有JS文件加载到那里并将它们拖放。

#2


Here's another solution that only works in Firefox because it uses the Firefox-specific watch method.

这是另一种仅适用于Firefox的解决方案,因为它使用特定于Firefox的监视方法。

Put this piece of Javascript at the very top of your html page, just after the <head> tag:

将这段Javascript放在html页面的顶部,就在标记之后:

<script>
window.watch('x', function() { debugger });
</script>

Note that watch works on any Javascript object (window is the global Javascript object).

请注意,watch适用于任何Javascript对象(窗口是全局Javascript对象)。

#3


Here's the solution I ended up using by modifying Ionut G. Stan's solution:

这是我通过修改Ionut G. Stan的解决方案最终使用的解决方案:

window.__defineSetter__("name", function(value) {
  if (value=="div") {
    debugger;
  }
});

I used debugger instead of console.trace(), so I could stop and look at it mid-execution. With console.trace() I got a bazillion trace statements due to this line executing many times.

我使用调试器而不是console.trace(),所以我可以停止并在执行中查看它。使用console.trace()我得到了一个bazillion跟踪语句,因为这行执行了很多次。

The leaky scope turned out to be buried in Dojo, where Dojo is setting that variable to the name of a processed element.

泄漏的范围被证明是埋藏在Dojo中,Dojo将该变量设置为已处理元素的名称。

#4


View your web page on the SeaMonkey browser (I use version 1.1.16) and look at the error console, you will see a message of this type for each assignment to an undeclared variable :

在SeaMonkey浏览器上查看您的网页(我使用的是版本1.1.16)并查看错误控制台,您将看到针对未声明变量的每个分配的此类消息:

Warning: assignment to undeclared variable x
Source File: http://....js
Line: ##

#5


In addition to debugging, I would advise to check your code with JSLint, which reports unexpected assignments in the global scope as errors.

除了调试之外,我还建议使用JSLint检查您的代码,JSLint将全局范围内的意外分配报告为错误。

There are several command-line bundles of jslint, such as jslint4java which can be used cross-platform in Ant build scripts.

有几个jslint的命令行包,例如jslint4java,它可以在Ant构建脚本中跨平台使用。

#1


Provided a few things

提供了一些东西

  1. You know the name of the variable
  2. 您知道变量的名称

  3. You don't have a variable with that name in the global scope (declared outside functions), but only inside functions.
  4. 在全局范围(在函数外部声明)中没有具有该名称的变量,但仅在内部函数中。

  5. There are calls to the function that declares the variable.
  6. 有函数调用声明变量。

this little script would do the trick:

这个小脚本可以解决这个问题:

<script type="text/javascript">
window.__defineSetter__("x", function(value) { console.trace(); });
x = 1;
</script>

You'll get a trace of the executed code before that assignment.

在分配之前,您将获得执行代码的跟踪。

It may fail to report some situations, so take a look at JSLint. Load all your JS files right there and lint them.

它可能无法报告某些情况,因此请查看JSLint。将所有JS文件加载到那里并将它们拖放。

#2


Here's another solution that only works in Firefox because it uses the Firefox-specific watch method.

这是另一种仅适用于Firefox的解决方案,因为它使用特定于Firefox的监视方法。

Put this piece of Javascript at the very top of your html page, just after the <head> tag:

将这段Javascript放在html页面的顶部,就在标记之后:

<script>
window.watch('x', function() { debugger });
</script>

Note that watch works on any Javascript object (window is the global Javascript object).

请注意,watch适用于任何Javascript对象(窗口是全局Javascript对象)。

#3


Here's the solution I ended up using by modifying Ionut G. Stan's solution:

这是我通过修改Ionut G. Stan的解决方案最终使用的解决方案:

window.__defineSetter__("name", function(value) {
  if (value=="div") {
    debugger;
  }
});

I used debugger instead of console.trace(), so I could stop and look at it mid-execution. With console.trace() I got a bazillion trace statements due to this line executing many times.

我使用调试器而不是console.trace(),所以我可以停止并在执行中查看它。使用console.trace()我得到了一个bazillion跟踪语句,因为这行执行了很多次。

The leaky scope turned out to be buried in Dojo, where Dojo is setting that variable to the name of a processed element.

泄漏的范围被证明是埋藏在Dojo中,Dojo将该变量设置为已处理元素的名称。

#4


View your web page on the SeaMonkey browser (I use version 1.1.16) and look at the error console, you will see a message of this type for each assignment to an undeclared variable :

在SeaMonkey浏览器上查看您的网页(我使用的是版本1.1.16)并查看错误控制台,您将看到针对未声明变量的每个分配的此类消息:

Warning: assignment to undeclared variable x
Source File: http://....js
Line: ##

#5


In addition to debugging, I would advise to check your code with JSLint, which reports unexpected assignments in the global scope as errors.

除了调试之外,我还建议使用JSLint检查您的代码,JSLint将全局范围内的意外分配报告为错误。

There are several command-line bundles of jslint, such as jslint4java which can be used cross-platform in Ant build scripts.

有几个jslint的命令行包,例如jslint4java,它可以在Ant构建脚本中跨平台使用。