JSLint 不喜欢 var答案

【问题标题】：JSLint doesn't like varJSLint 不喜欢 var
【发布时间】：2015-03-17 12:56:43
【问题描述】：

我正在使用 JSLint 探测我的代码中的错误，到目前为止，我设法修复了所有错误，但我的全局应用程序变量未定义时的问题除外。

我在运行正常的 JSlint 之前使用了这段代码：

var APP = APP || (function {
    return {
        init: function () {

        }
    };
}(window.document));

然后我会打电话

APP.init();

初始化。但是 JSlint 不喜欢全局变量，所以我将代码更改为：

(function (global){
    var APP = {
        init: function () {

        }
    };
    return APP;
}(window.document));

这段代码毫无问题地通过了 JSLint 测试，但是随后当我调用 APP.init();它说在定义之前使用了APP，这是真的。你会推荐什么，以便我不使用全局变量但仍然创建我的应用程序对象，而我的代码通过 JSlint 测试？

【问题讨论】：

在您重写的版本中，APP 是一个局部变量。如果您尝试在该函数之外使用它，则会收到错误消息。
然后当我调用 APP.init(); - 你没有在你共享的代码中调用那个函数，所以很难说出 JSLint 抱怨什么关于。
如果您要避免使用全局变量，则所有内容都必须在 function(global) 函数内，包括 APP.init()。

标签： javascript jslint

【解决方案1】：

第一个代码

在您的原始代码中，您会得到的实际错误是

 #1 'APP' used out of scope.
    var APP = APP || (function() { // Line 1, Pos 11

这不是因为 JSLint 讨厌全局变量，而是因为 它不喜欢分配给它的变量在同一个 var 语句中定义。

更改代码以使用不同的变量名可以解决此问题

var app = APP || (function() {...}(..));

但是，人们会期望APP 已经在当前范围内定义。否则你会得到

 #1 'APP' was used before it was defined.

第二个代码

它不起作用，因为APP 仅在您创建的函数对象内可见。它在它之外的任何地方都不可见。既然你想在全局范围内定义APP，你只需要把它附加到window对象上，像这样

(function(global) {
    global.APP = {
        init: function() {

        }
    };
}(window));

然后

APP.init()

会正常工作。

您可以像这样直接定义APP，而不是经历所有这些

window.APP = {
    init: function () {
        "use strict";
        ...
    }
};

【讨论】：

这个想法站得住脚，因为 JSLint 仍然抱怨在未定义之前使用了 APP。 :) 我用新脚本尝试了我的应用程序，是的，它可以工作。
@Vlad 您使用了哪个建议的更改？
第二个，带global.APP = { };
@Vlad 嗯，你试过window.APP 方法吗？这对我来说似乎非常简单和整洁
@Vlad 对不起，我的意思是我在答案中建议的最后一种方法。

【解决方案2】：

    (function (global){
    var APP = {
        init: function () {

        }
    };
    return APP;
}(window.document));

上面创建了一个作用域/闭包，因此只有匿名函数内的代码才能访问 APP 变量。 JSHint 具有设置，因此您可以设置可接受的全局变量（例如 jquery 等），我会在其中添加 APP，如果其余通过，您知道您只有一个变量/模块作为全局变量/模块。如果您正在使用任何 3rd 方库，那么您可能已经有多个全局变量了

【讨论】：

是的，我的意图是我只使用一个全局变量而不使用其他第三方库，所以是的，我拥有的代码是从头开始编写的纯 JS 代码。我会试试 JSHint，谢谢。

【解决方案3】：

在give up on JSLint 之前，要知道它根本不介意全局变量；它只是希望您以特殊格式声明它们，以便其他阅读您的代码的人确切地知道发生了什么。

这里唯一的“技巧”是，如果您的全局 APP 可能尚未初始化，并且您确实需要检查其“真实性”，就像您对 APP = APP || (function... 所做的那样。然后你确实需要使用window（或者任何你的全局对象——例如，如果你使用Node就不同了）前缀技巧。

方法如下：

/*jslint white:true, sloppy:true, browser:true */
/*global APP */

window.APP = window.APP || (function () {
    return {
        init: function () {
            window.alert('JSLint doesn\'t like empty blocks');
        }
    };
}(window.document));


APP.init();

JSLint 很高兴！

理论上我并不反对 JSHint，但允许您设置各种额外设置的相同灵活性也倾向于削弱一致性，这在很大程度上是我认为代码 linter 的最大好处。让两者都跑得好，扎实，看看你最喜欢哪一个！

【讨论】：