使用 JSLint 并遵循它是不是有意义？ [关闭]

Posted 2023-02-22

【中文标题】使用 JSLint 并遵循它是不是有意义？ [关闭]

【英文标题】：Does it make any sense to use JSLint and follow it? [closed]使用 JSLint 并遵循它是否有意义？ [关闭]

【发布时间】：2011-04-14 08:27:10

【问题描述】：

最近我一直在使用 jQuery 和 javascript 编写一些 JS 代码，我想我会尝试 JSLint。让我说代码包含各种函数和 jQuery 用法，它在 IE8 和最新的 Firefox 中运行良好（没有任何错误）。 该代码还验证为 Xhtml 1.0 Transitional（也是 Strict，但我主要希望它是 Transitional 有效的）。

但是，使用 JSLint 就好像一切都错了。虽然我读过它非常严格，但即使我只打开“The Good Parts”，在典型的 HTML 页面中仍然会出现 70 多个错误。

从这个开始（为什么我要删除类型以使我的文档 XHTML 无效？？）

Problem at line 5 character 67: type is unnecessary.

<script src="/Scripts/jquery-1.4.2.min.js" type="text/javascript"></script>

并继续出现像

这样的深奥错误

Problem at line 41 character 41: Use the array literal notation [].

var rows = new Array();

Problem at line 42 character 30: Too many var statements.

for (var i = 0; i < data.length; i++) 

Problem at line 42 character 55: Unexpected use of '++'.

for (var i = 0; i < data.length; i++) 

Problem at line 64 character 50: ['PrettyId'] is better written in dot notation.

var item = $("#item_" + data["PrettyId"]);

如果有人可以为我提供这些错误的答案，尤其是如何让 JSLint 了解 jQuery 并理解它，我将不胜感激。

如果没有，请说明您是否使用它以及您是否建议使用它。

更新：

如果有更多答案，我将再等一天，然后我会接受投票最多的答案。

【问题讨论】：

还有 jshint（从 jslint 派生出来的），它可以更轻松地进行配置以满足您的需求。谷歌有 gjslint，它强制执行谷歌 JavaScript 样式指南。我发现 jshint 比 jslint 更有用。

【参考方案1】：

使用 JSLint 时要记住的一点是，它建立在人们认为“好的部分”的观点之上。

我认为这是一个很棒的工具，但有些规则我不同意。

关于type属性，你可以找到更多关于作者here的意见，他说这个属性是“必需的和非必需的”，但是如果你验证你的文件你显然需要它。

使用 Array 文字符号 [] 与 Array 构造函数，我同意，存在可以使两种语法表现不同的差异，例如：

 [5]; // one-element array
 ["5"]; // one-element array

 new Array(5); // empty array but its length is initialized with 5
 new Array("5"); // one-element array

因此，为了保持一致性和简洁性，文字表示法更好。

关于“Too many var statements”，JavaScript 没有块作用域，作用域是函数或全局级别，所有var 语句在代码执行之前进行评估 - 也称为提升 - 并使用 @ 初始化987654327@，而分配是在运行时进行的。

例如：

var x = 0;
if (true) 
  var x = 1; // useless var, x already declared

x; // 1

而变量声明的“提升”可以看这个例子：

var x = 5;  // global
(function () 
  alert(x); // alerts `undefined`, x declared but unassigned in this scope
  alert(y); // ReferenceError, y is undeclared

  var x = 10;
)();

您可以看到x 持有undefined，因为它是在实际代码执行之前声明的，var 语句被提升到其封闭范围的顶部：

var x = 5;  // global
(function () 
  var x;
  alert(x); // alerts `undefined`, x declared but unassigned
  alert(y); // ReferenceError, y is undeclared

  x = 10; // assignment is made
)();

因此，该规则实际上希望使代码类似于将要发生的情况，首先是所有 var 语句。

关于“意外使用'++'”，这是另一个我不太喜欢的规则，作者认为“那些通过鼓励过度的诡计而导致糟糕的代码”。

当我在某些表达式中使用它们时，我尝试将运算符的用法提取到单独的语句中，例如：

array[++id] = x;

收件人：

id+=1;
array[id] = x;

哪个更清楚，但无论如何在 for 声明 IMO 的情况下，它根本不会引起任何混淆......

关于最后一个“['PrettyId'] 最好用点表示法来写。”，JSLint 期望括号表示法的使用是“动态的”，它期望在那里看到一个表达式，而不是包含有效标识符名称的字符串文字，仅当您要访问名称与保留字冲突的属性时才应使用方括号表示法，例如：

data.function;    // SyntaxError in ECMAScript 3 based implementations
data["function"]; // Ok

或者当属性包含不是有效标识符的字符时，例如：

data.foo-bar;    // it access the property `foo` minus a `bar` variable
data["foo-bar"]; // Ok

data.foo bar;    // SyntaxError, unexpected `bar` identifier
data["foo bar"]; // Ok

【讨论】：

+1 - 很好的解释。关于点符号，您会认为 JSLint 会将字符串与当前/未来的保留字进行比较。请注意，在您使用alert(x) 的第二个示例中，我认为您忘记更新后续代码注释。当前为// alerts undefined, x declared but unassigned。不想改变它，以防我误解了你的观点。 :o)

@patrick，谢谢，这是一个复制粘贴错误，var 语句和赋值应该被拆分以显示行为，所以评论保留;)

请在回答如何让 JSLint 知道 jQuery 的美元符号时添加以下内容：/*global DOMAssistant, $, $$ */

@Art，我看到了你的例子，它提醒1 因为x 变量没有在本地范围内声明-函数的范围-，提升 当在该函数的任何位置声明名为 x 的变量时，您的示例中的行为将出现 - 它会 遮蔽 外部 x 变量 - 即使在您发出警报后，请检查 this 修改后的版本你的例子。

@Art，是的，你明白了......你可以认为警报应该显示1，因为var 语句是之后，但是不会发生，提升 ;)

【参考方案2】：

我在 .js 文件上使用 jslint 并找到选项和修复的组合以使其满意。我发现它提高了我的代码质量。我建议运行它，即使您只使用它来隔离省略的“var”声明。

我通过不针对 html 文件运行来避免脚本标记警告。我在 .js 文件上系统地使用 jslint，但不是在 html 上。我发现声明所有在包含脚本中定义但对 jslint 不可见的全局标识符太麻烦了。

Crockford 的书 'Javascript: The Good Parts' 解释了许多（如果不是全部）jslint 警告，其中一些是基于感知到的错误倾向。 'new Array()' vs ' []' 警告是基于 Doug 对 'new' 运算符的厌恶。为各种构造函数省略“new”通常是有效的代码，但不是正确的代码，使用替代语法可以避免这种风险。

'too many vars' 错误意味着，在给定函数中有大量 'var' 声明：Crockford 认可的风格是使用一个或很少的 'var' 声明，都在函数的顶部.您可以在一个 var 语句中声明多个变量，方法是用逗号分隔它们。

“++”警告是另一个基于错误倾向的警告；使用 '+=1' 意味着同样的事情，Doug 认为它更不容易出错。

jslint 因此是一个混合包。一些功能（本地与全局）非常宝贵，一些（脚本类型）只是令人讨厌，而且许多功能可疑但无害。

jQuery 本身通过 jslint 检查，如下所述： http://docs.jquery.com/JQuery_Core_Style_Guidelines#JSLint

【参考方案3】：

有一个关于吸烟的程序员的老笑话。一位朋友说：“你真是个聪明人，难道你看不到包装上的警告，说香烟会杀死你吗？”来了回复：“我是程序员。我们只关注错误，不关注警告。”

有时 JSLint 会告诉你一些重要的事情，有时它只是唠叨。你可能会为了让它快乐而迷失方向，但如果没有它，你可能会迷失。像任何其他工具一样，它的输入应该是一粒盐。我更喜欢把它想象成 MS Word 中的拼写检查器或语法检查器。有时是对的，有时是错的，有时我根本不在乎它告诉我什么。

【讨论】：

JSLint 是一个很棒的工具，但正如 Robusto 所说，输出结果应该有所保留。这是因为它不是真正的验证器，它是一个强制执行 JavaScript 的“好的部分”（由 Douglas Crockford 定义）的工具。它几乎没有上下文概念，因此它认为“错误”的某些事情实际上可能适合您的特定情况。

说得好！我同意忍受唠叨是值得的，因为指出难以发现的错别字和错误确实是物有所值。 （但你必须愿意忽略唠叨）。

【参考方案4】：

当你开始在旧代码上使用它时会很痛苦。

但它会为您节省大量时间。JSLint 可以检测到许多问题，这些问题只有在刷新页面时才会看到，或者更糟的是，当您的用户这样做时。现在当我不得不使用时，我感到很痛苦没有 JSLint 的编辑器

另一个优势是当您开始压缩您的 javascript 时。如果你通过了 JSLint 检查，你几乎可以肯定压缩没有问题。

话虽如此，jquery 有 23 个警告，其中大部分是关于正则表达式的，但被广泛使用，没有任何问题。

【参考方案5】：

JSLint 是一个代码质量工具。它不像 W3C 验证器。将其视为公司的每周代码审查。编码约定各不相同，JSLint 只是其中之一。可能有一些你不同意的观点，但如果你在一个团队中工作并且你需要管理一个更大的代码库，JSLint 可以成为救命稻草。为什么？因为它会警告您有关令人困惑或容易出错的事情。

使用 JSLint 的最佳方法是：阅读它所说的所有内容，如果您不确定关于某些正确，请按照建议（似乎是这样）在这里）。

原因是 JSLint 旨在避免混淆，如果您使用的东西可能会导致错误并且您不知道为什么，那么最好选择一个明确的替代方案。

如果您想了解这些建议背后的原因，请观看 Douglas Crockford 的 Javascript 视频。

最后，您可以关闭您认为无用的过滤器。

【参考方案6】：

你应该使用它。它适用于一个浏览器这一事实并不意味着它适用于所有浏览器。有些人比其他人更宽容。例如，数组中的尾随逗号将在 IE 中中断，但在 FF 中有效。

请注意，有时您会遇到大量错误，但您会删除第一个和十几个错误，例如编译代码。

你可以的

var rows = [];

对于第一个错误。

【讨论】：

是的，但第一个是“类型是不必要的”..如何删除它？

@mare，你把 type='text/javascript' 拿出来。 JSLint 并不完美，但它会帮助你捕捉东西。一段时间后，您就会知道要寻找什么。

您的短语“它在一个浏览器中工作的事实并不意味着它可以在所有浏览器中工作”让我有点担心。这似乎暗示 JSLint 是一个验证器，并且不包含 JSLint 错误的代码将在每个浏览器中工作。但是，情况不一定如此。 JSLint不是验证器。它只是指出代码中可能的问题区域 - 可能容易被误解的部分，不考虑基于函数的范围，或可能带来困难的部分-to-debug 错误。

甚至对于那些难以调试的错误，我认为这只是一种吓跑人们的方式，例如“如果你不这样做 JSLint 方式（阅读，我的方式）你会最终陷入麻烦”......对于这个 Crockfor 家伙来说，这是一次自我之旅......;）

说句公道话，克罗克福德知道他的东西。而且，在阅读了 JavaScript: The Good Parts 之后，我明白他的大部分内容来自哪里。类型强制、真值/假值、undefined、null 和NaN 的性质以及parseInt 会带来一些奇怪的问题。遵循 JSLint 指南可以帮助您避免这些情况。

【参考方案7】：

这是我能给出的最佳答案。也许有人可以填补一些空白。不过，这些似乎都与 jQuery 无关。

另外，请参阅this document 以获得一些解释。

Problem at line 5 character 67: type is unnecessary.

<script src="/Scripts/jquery-1.4.2.min.js" type="text/javascript"></script>
and goes on with esoteric errors like

我相信对于现代浏览器，链接到外部 js 文件时不需要text/javascript。

---

Problem at line 41 character 41: Use the array literal notation [].

var rows = new Array();

建议在创建对象或数组时不要调用构造函数。老实说，我不确定为什么。有人吗？

---

Problem at line 42 character 30: Too many var statements.

for (var i = 0; i < data.length; i++) 

我想您在同一范围内的其他地方声明了 i 变量。 javascript 块不会创建范围，因此如果您有另一个使用for 循环（例如）使用i，它使用相同的变量。无需再次声明。

---

Problem at line 42 character 55: Unexpected use of '++'.

for (var i = 0; i < data.length; i++) 

不确定这个，除非我没记错的话，Crockford 不喜欢++ 和--。

---

Problem at line 64 character 50: ['PrettyId'] is better written in dot notation.

var item = $("#item_" + data["PrettyId"]);

我相信. 表示法是首选，因为它更短更快（无论如何在某些浏览器中）。所以改为data.PrettyID。

据我所知，这里似乎没有明显错误。大多数只是从 JSLint 创建者的角度提出的最佳实践建议。

【讨论】：

关于“类型”错误...大多数现代浏览器确实在没有类型的情况下处理它，但 W3C 验证器明确表示如果缺少类型，则代码无效。我希望我的 HTML 是 xHTML 有效的，并且我比 Mr.Crockford 更信任一组 W3C 权威..

@mare - 有效点。我不同意。事实上，我会忽略其中一些错误。我喜欢++，为了清晰/安全，我不介意使用多余的var，而且和你一样，我总是包含type/javascript。

在 HTML5 中，type 属性现在是可选的，如果缺少 type/javascript，则默认为：w3.org/TR/html5/scripting-1.html#script