两个独立的 JavaScript 脚本可以共享变量吗？

Question

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

例子：

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

那会写“Hello World！”吗？这似乎是糟糕的编码约定我怎么能以适当的形式实现这样的东西。

原文由 Bobby S 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您的示例中的变量 title 被声明为全局变量，因此它可用于加载到同一页面的任何和所有脚本。更何况，如果同一个页面上已经有一个名为 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_vars.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 都在同一范围内。

原文由 dgvid 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

title 在 Global 范围内，对于在网络浏览器中运行的 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>

原文由 gilly3 发布，翻译遵循 CC BY-SA 3.0 许可协议