JavaScript 变量的范围(与 XUL 相关) [英] Scope of JavaScript variables (XUL-related)

问题描述

初学者的问题，可能是一个微不足道的问题.这是 XUL 代码片段:

A beginner's question, probably a trivial one. Here's the XUL code snippet:

<window
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

    <script type="application/javascript" src="chrome://.../main.js"/>

    <button label="Click me!" oncommand="clickhandler()"/>
</window>

JavaScript 代码:

The JavaScript code:

// main.js

var test = "Peanut butter";    // a global variable

function clickhandler() {
    alert(test);
}

解释器在读取主窗口的开始标记后立即处理 JavaScript 文件，然后继续处理其余的 XUL 代码.在我看来，test 变量应该在解释器完成处理 main.js 的那一刻超出范围.此外，clickhandler() 函数也应该超出范围，这意味着当按钮被点击时，什么都不应该发生.好吧，除非我将它们声明为 document.test 和 document.clickhandler()，例如.然而，一个简单的实验证明我错了.单击按钮时，函数和变量都存在.像这样声明的变量的实际寿命是多少?它们什么时候销毁?他们在应用程序退出之前一直存在吗?非常感谢任何最佳做法和参考资料.

The interpreter processes the JavaScript file just after reading the main window's opening tag and then proceeds with the rest of XUL code. In my opinion, the test variable should go out of scope in the very moment the interpreter finishes processing main.js. Moreover, the clickhandler() function should have gone out of scope too, which means, when the button is clicked, nothing should happen. Well, unless I declare them as document.test and document.clickhandler(), for instance. However, a simple experiment proved me wrong. Both the function and the variable exist when the button is clicked. What is the actual life span of variables declared like this? When are they destroyed? Are they around until the application exits? Any best practices and references are highly appreciated.

推荐答案

您希望它的行为与您习惯于使用块作用域的语言一样.我建议通读 Douglas Crockford 的书The Good Parts"，以更好地理解为什么一切都会这样运作.如果您从一开始就了解所有这些知识，那么您以后的道路就会轻松得多.

You are expecting it to behave like languages you are used to with block scope. I suggest reading through Douglas Crockford's book "The Good Parts" to get a better understanding of why everything works the way it does. If you learn all of this from the start you will have a much easier time down the road.

Javascript 是功能性范围的.在这个例子中，测试范围是 foo 的范围.

Javascript is functionally scoped.. in this example test is scoped inside of foo.

var foo = function() {
    var test = "Peanut Butter";
};

在此示例中，您可以看到该函数可以修改 test，因为它是一个全局范围的变量.

In this example, you can see that the function can modify test as it's a globally scoped variable.

var test = "peanut butter";
var foo = function() {
    test = "Apple sauce";
};

有三种方法可以定义全局范围的变量，我建议您避免使用所有这些方法(并非完全如此，这是不可能的).全局变量是必要的，但是它们可以被减轻.它们的生命周期与加载 javascript 的时间一样长.如果您在同一页面加载的不同 .js 文件中定义多个全局变量，则这些全局变量可以被两者访问，因此很容易意外覆盖来自不同文件的变量.

There are three ways to define globally scoped variables, all of which I would suggest you avoid (not entirely, that's impossible). Global variables are necessary, however they can be mitigated. Their lifetime is as long as the javascript is loaded. If you define multiple global variables in different .js files that are loaded by the same page, those global variables are accessible by both, making it quite easy to accidentally overwrite vars from different files.

1:在任何函数之外放置一个 var 语句，就像您所做的那样.

1: Place a var statement outside of any function, like you have done.

2:将其作为属性添加到全局对象中.

2: Add it as a property to the global object.

window.foo = value;

3.使用变量而不声明它，这是一个隐含的全局变量.真的要注意这些.您声明的函数实际上是一个隐含的全局变量，称为clickhandler".

3. use a variable without declaring it, this is an implied global. Really watch out for these. The function you declared is actually an implied global itself called "clickhandler".

foo = value;

尽量减少使用全局变量的常见做法称为全局减少，在其中定义应用程序特定的全局变量来保存其余的全局变量，以避免与其他库发生冲突.这是通过声明一个对象文字并使用创建全局变量的第二种方法来完成的.但是，仅当您需要全局变量时才使用它，并尽可能坚持使用功能范围.

A common practice to minimize the use of global variables is known as Global Abatement, in which you define an application specific global variable to hold the rest of your global variables, to avoid collision with other libraries. This is done by declaring an object literal and using the 2nd method of creating global variables. Only use this when you need global variables however, and try to stick to functional scope when possible.

var AWESOMENEWAPP = {};
AWESOMENEWAPP.test = "Peanut Butter";

当您更深入地了解 javascript 世界时，您将开始学习有用的东西，例如闭包等，以保持您的代码整洁有序.

When you get deeper in to the world of javascript, you'll start learning about useful things like closures and more to keep your code clean and organized.

不要指望 javascript 像典型的经典语言一样工作，您会发现它本身就是一种强大的语言，只是与众不同.

Just don't expect javascript to work like your typical classical languages and you'll find that it is a powerful language in its own right, just different.

在您的旅程中，我建议使用工具 JSLint 来测试您的代码是否遵循约定和错误没有看到，因为它没有被编译.

On your journey, I suggest using the tool JSLint to test your code for following conventions and errors you won't see because it isn't compiled.

这篇关于JavaScript 变量的范围(与 XUL 相关)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！