JSLint：在三元变量设置中超出作用域使用

Question

我有一个像这样的代码块：

/*global MYAPP: true*/
var MYAPP = MYAPP || {};

JSLint在等号后面突出显示“MYAPP”，并显示“MYAPP在范围外使用”的消息。

这有什么问题吗？

- Kirby

---

var MYAPP = window.MYAPP || {};，否则表达式总是将'MYAPP'留为空对象{}，因为由于变量提升，'MYAPP'将为undefined。 - dandavis

实际上它是有效的，但JSLint会报错。 - Kirby

但在node.js中我们会用什么呢？没有 window。 - Kirby

我找到了另一种方法： var MYAPP; MYAPP = MYAPP || {}; - Kirby

嗯，我猜你需要一个不同名称的临时变量，我之前没有意识到这一点... - dandavis

Answer 1

如果使用 var，则声明的是局部变量。 如果使用 MYAPP || {}，通常是为了为全局变量或先前声明的变量设置默认值。 MYAPP 的作用域应该是什么？如果是全局的，那么可以使用类似以下的代码：

MYAPP = window.MYAPP || {}; 

window.可以防止出现未定义的情况。

如果它不是全局变量，而是之前声明的，则

MYAPP = MYAPP || {};

如果这是一个新的变量，它只在该行所在的函数中有效。

var MYAPP = {};

如果您在脚本的顶层定义了一个变量（即不在函数中），那么它是全局变量。如果您在两个不同的脚本标签（或javascript文件）中使用相同名称的全局变量，则它们是同一个变量。

如果您希望隐藏一个变量，不让其他脚本标签（或javascript文件）访问到它，可以考虑使用IIFE（立即调用的函数表达式）。例如：

(function() {
    var MYAPP = {};
    //code that uses MYAPP;
})();
//MYAPP is not visible out here, or in other script tags/files.

- Nicholas Daley-Okoye

---

谢谢你的回答！但是你对 var MYAPP; MYAPP = MYAPP || {}; 有什么看法？ - Kirby

MYAPP || 这部分并不是必需的，因为如果你这么写 var MYAPP，就已经声明了一个名叫 MYAPP 的新变量。那么，如果你还有其他的名为 MYAPP 的变量，因为你使用了 var，所以它将是个不同的变量。在最终结果上，“var MYAPP; MYAPP = MYAPP || {};” 和 “var MYAPP = {};" 没有任何区别。 - Nicholas Daley-Okoye

是的，我也和你想得一样。 :) 但请尝试进行测试：`<script> var MY = MY || {aa:'aa'}; </script><script> var MY; MY = MY || {aa:'bb'}; console.log(MY.aa); </script>` - Kirby

发生的情况是它们都在同一作用域中，因此只有一个变量。JavaScript 中的顶级变量（即不在函数内部）是全局变量，并且可能会相互冲突。因此，即使它们位于单独的脚本标记中，它们仍然是相同的全局变量。如果您想使它们仅对包含它们的脚本标记可见，则考虑使用 IIFE，例如： <script>(function() {var MY = MY || {aa:'aa'}; /*other code*/})();</script> - Nicholas Daley-Okoye

Answer 2

对于jshint、jslint、sonarqube等工具，如果没有使用var（let或const）明确声明变量，则不能使用任何变量。

如果您想将它们设置为全局变量，必须首先定义当前全局关键字是什么，因为在浏览器中，它是window，但在其他上下文中，可能不是这样！

因此，请参见以下如何避免警告（JSDoc注释不是解决方案的一部分，但解释了为什么有用）。

/**
 * @fileOverview Starting point for Front-end [Your Project Name]'s JavaScript.
 * @author {@link http://www.lesieur.name/|Bruno Lesieur}
 * @version 1.0.0
 * @module Common
 * @requires {@link external:jQuery}
 */

var window = this,

    /**
     * Container for all function of website.
     * @namespace website
     * @global
     * @type {Object}
     */
    website = window.website || {},

    /**
     * Write less, Do more.
     * @external jQuery
     * @global
     * @see {@link https://jquery.com/|jQuery}
     */
    $ = window.$,

    /**
     * Shortcut for $(window).
     * @global
     * @type {jQuery}
     */
    $window = window.$window || $(window);

/**
 * All components (modules) avaiable on all pages.
 * @namespace components
 * @alias components
 * @type {Object}
 * @memberOf website.
 */
website.components = website.components || {};

所以在你的例子中，简单的方法是：

var window = this,
    MYAPP = window.MYAPP || {};

或者

var global = this,
    MYAPP = global.MYAPP || {};

或者

var MYAPP = this.MYAPP || {};

- Bruno J. S. Lesieur