javascript - "var FOO = FOO || {}"(将变量或空对象分配给该变量)在 Javascript 中意味着什么？

Question

查看在线源代码时，我在几个源文件的顶部看到了这个。

var FOO = FOO || {};
FOO.Bar = …;

但我不知道||是什么{} 会。

我知道 {} 等于 new Object() 并且我认为 || 用于“如果它已经存在”之类的东西使用它的值，否则使用新对象。

为什么我会在源文件的顶部看到这个？

Answer 1

您对 || {} 意图的猜测非常接近。

在文件顶部看到的这种特殊模式用于创建一个命名空间，即一个命名对象，可以在该命名对象下创建函数和变量，而不会过度污染全局对象。

为什么使用它的原因是，如果您有两个(或更多)文件:

var MY_NAMESPACE = MY_NAMESPACE || {};
MY_NAMESPACE.func1 = {
}

和

var MY_NAMESPACE = MY_NAMESPACE || {};
MY_NAMESPACE.func2 = {
}

两者共享同一个命名空间，那么无论这两个文件的加载顺序如何，您仍然会得到 func1和 func2在 MY_NAMESPACE 中正确定义正确反对。

加载的第一个文件将创建初始MY_NAMESPACE对象，任何随后加载的文件都会增强该对象。

有用的是，这还允许异步 加载共享同一命名空间的脚本，从而缩短页面加载时间。如果<script>标签有 defer属性集您无法知道它们的解释顺序，因此如上所述，这也解决了该问题。