Question

如果我在带有JavaScript的HTML页面中有两个单独的脚本，那么整个页面之间是否共享变量？或者只在他们自己的声明中？

示例：

<script> var title = "Hello World!"; </script>
// random HTML/PHP
<script> document.write(title); </script>

那会写“Hello World！”吗？这似乎是错误的编码约定，我怎么能用正确的形式实现这样的事情。

Answer 1

示例中的变量标题被声明为全局变量，因此它将可用于加载到同一页面的任何和所有脚本。更重要的是，如果在同一页面上已经存在名为title的全局变量，则在为其分配值“Hello World！”时，其值将被覆盖。

避免此类问题的通常做法是声明一个全局变量，然后将所有其他变量放入其中。例如：

var bobbyS_vars = {
    title: "Hello World!";
};

为单独的全局变量分配一个其他人无法选择的名称，例如您的姓名或雇主的名字，或者最重要的是，属于您或您的雇主的域名。

处理此问题的另一种更常见的方法是利用JavaScript处理函数内变量范围的方式。例如，创建一个匿名函数，在该函数内声明所有代码，然后在声明结尾处调用函数，并在声明结尾处调用（）。例如：

(function() {
    var title = "Hello World!";

    document.write(title);
})();

// title is not in scope here, so it is undefined,
// unless it were declared elsewhere.

如果您希望分享某些变量而不是其他变量，请让您的匿名函数使用多种方法：

var bobbyS_vars = {
    title: "Hello World!";
};

(function() {
    var employeeId = "E 298";
    var count = 7;

    document.write("<p>" + bobbyS_vars.title + "</p>");
    document.write("<p>" + employeeId + "</p>");
})();

// At this point, bobbyS_var.title is in scope and still has the 
// value "Hello World!". Variables employeeId and count are not
// in scope and effectively private to the code above.

最后一点说明。您的代码声明的所有函数也是有效的全局变量。因此，如果您创建一个名为printTitle的函数，它将1）可用于页面上的所有其他代码，2）可以覆盖或覆盖同一页面上名为printTitle的另一个函数。您可以像保护其他任何变量一样保护和/或公开您的功能：

var bobbyS_vars = { };

(function() {
    // Private functions
    var function = addOne(i) {
        return i + 1;
    };

    // Public vars
    bobbyS_vars.title: "Hello World!";

    // Public functions
    bobbyS_vars.printTitle = function() {
        document.write("<p>" + bobbyS_vars.title + "</p>");
        document.write("<p>" + addOne(41) + "</p>");
    };
})();

// At this point, function addOne is not directly accessible,
// but printTitle is.
bobbyS_vars.printTitle();

请注意，虽然函数addOne实际上是闭包内的私有函数，但它仍可通过printTitle函数间接访问，因为addOne和printTitle都在同一范围内。

Answer 2

title位于Global范围内，对于在Web浏览器中运行的JavaScript，它是window对象。当你在任何限制其范围的函数之外说var title = "Hello World!"时，它与说window.title = "Hello World!"相同。你的代码等同于：

<script>
    window.title = "Hello World!";
</script> 
<!-- random HTML/PHP -->
<script>
    document.write(title);
    // or document.write(window.title) works just as well
</script>

Answer 3

他们将根据范围规则等“共享”。除了包含所述文件的顺序外，单独的文件对此没有影响。

编辑：同样的规则也适用于内联脚本。

详细说明异常：

如果我有文件Foo，我声明如下：

var fooVar = barVar;

然后我在文件栏中声明了以下内容：

var barVar = 'bar';

我按顺序包括它们：

<script type="javascript/text" src="foo.js"></script>
<script type="javascript/text" src="bar.js"></script>

您将收到解释错误，因为barVar在声明之前就已使用。

Answer 4

window包含所有变量。所有脚本都在母window对象中。所以所有变量都在一个空间中。但是，它们可以本地化为功能等。

Answer 5

在这种情况下，title将是一个全局变量。您需要将变量封装在范围内。有各种方法可以做到这一点。我的偏好是一个自动执行的匿名函数，可以像这样完成：

    (function() {
       var title = "Hello world!";

       alert(title); // would pop up "Hello World!" since title is in scope
    });

    alert(title); // title doesn't exist, because it's outside the scope

JavaScript：两个独立的脚本 - 共享变量？

5 个答案: