javascript - Javascript 中带有全局变量的有趣作用域问题

Question

我有一个包含许多模块的大型 JS 应用程序，最终将与 browersify 捆绑在一起。 但由于我不想让我的整个团队安装 Node.js 并在每次更改字符时重建，所以我希望模块在开发时全局注册。我一直在使用模块的标准注册，如下所示:

// if browserify
if (typeof module === "object" && module.exports) {
    module.exports = myModule;
} else { window.myModule = myModule; }

这就是它变得有趣的地方:当需要主 app.js 文件中的依赖项时，我这样做:

if (typeof module === "object" && module.exports) {
    var myModule = require("./js/myModule");
} // otherwise it's assumed to be globe, which console.log(window) confirms
console.log(myModule);

此控制台日志返回为未定义，因此我需要一条 else 行，其中显示: } 别的 { myModule = window.myModule; }

这是一个更简单的 jsFiddle作为概念证明:

if (false) {
    var test = "Hello World";
} else {
  window.test = "Hello Globe";
}

document.getElementById("console").innerHTML = test;

test 在此场景中未定义。

令我困惑的是，从未运行的 if 语句的内容似乎仍然将 test 注册为局部变量。是这样吗？或者我只是不明白全局变量是如何工作的？我认为注册到 window 的任何内容都可以通过它自己的名称来调用，就像我们不必每次都编写 window.jQuery 一样。

Answer 1

Javascript 提升 var 声明，并且由于您在 if 语句内声明这不是一个新范围，因此基本上具有以下内容:

if (false) {
    var test = "Hello World";
} else {
  window.test = "Hello Globe";
}

这和拥有这个是一样的:

var test;
if (false) {
  test = "Hello World";
} else {
  window.test = "Hello Globe";
}

这就是为什么在作用域的开头声明变量是一个很好的做法，请检查此示例:

var test = "Hello World From outside";
function(){
  console.log(test);
  if (false) {
    var test = "Hello World From inside"
  }
}

此示例将输出:“undefined” var 测试被提升到作用域的顶部，在本例中，函数的顶部覆盖了外部变量声明，尽管我们永远不会进入该 if