JavaScript刺激工具的比较

JavaScript代码风格检查工具对比：JSLint、JSHint、JSCS和ESLint

本文将对比分析四款流行的JavaScript代码风格检查工具：JSLint、JSHint、JSCS和ESLint，帮助您选择最适合项目的工具。这些工具通过遵循编码规范并识别潜在错误来帮助避免编码错误。

关键点:

• JSLint、JSHint、JSCS和ESLint等JavaScript代码风格检查工具有助于通过遵守编码标准和识别潜在错误来避免编码错误。每种工具都有其自身的优缺点，工具的选择取决于项目的具体需求。
• JSLint是最古老的工具，旨在强制执行JavaScript的良好部分。它不可配置且不可扩展，并且缺乏文档。JSHint是JSLint的一个分支，它更易于配置，在大型项目中易于使用，但需要一些设置才能使其发挥作用。
• JSCS是一个代码风格检查器，专注于代码格式，而不是潜在的错误。它有超过90个不同的规则，并支持自定义插件。然而，它不如其他工具灵活，并且是四种工具中最慢的。
• ESLint是最新的、可扩展的工具，具有大量自定义规则。它检查代码中的错误和其他问题，因此是作者推荐的选择。它支持ES6特性和JSX。但是，其文档可能令人困惑，并且需要一些配置。

多年编程经验，仍然会犯一些低级错误，例如变量名拼写错误、语法错误以及忘记正确处理错误。一个好的代码风格检查工具可以在浪费时间（或者更糟的是，浪费客户时间）之前就发现这些问题。它还可以帮助项目遵守编码规范。

市面上有很多JavaScript代码风格检查工具，如何选择呢？让我们来看看四款流行的替代方案：JSLint、JSHint、JSCS和ESLint的功能及其优缺点。

概述

这四种工具的工作方式基本相同。它们有一套规则，用于分析和报告JavaScript文件中的问题。它们可以通过npm安装，可以通过传递文件从命令行使用，也可以作为Grunt等工具的插件使用，或者集成到编辑器中。它们都支持使用注释进行配置。

但相似之处到此为止。每种工具都有其自身的优缺点——只是有些工具的优点多于缺点。

JSLint

JSLint是这四种工具中最古老的。Douglas Crockford在2002年创建它，目的是强制执行他认为的JavaScript的良好部分。如果您同意这些良好部分，JSLint可能是一个不错的工具——安装它即可使用。

缺点是JSLint不可配置或不可扩展。您根本无法禁用许多功能，并且其中一些功能缺乏文档。官方网站不是很有用，例如，它缺乏关于如何将其与您的编辑器集成的任何信息。

优点：

• 配置完毕即可使用（如果您同意它强制执行的规则）。

缺点：

• JSLint没有配置文件，如果您需要更改设置，这可能会成为问题。
• 配置选项数量有限，许多规则无法禁用。
• 您无法添加自定义规则。
• 功能未记录。
• 难以知道哪个规则导致哪个错误。

JSHint

JSHint是作为JSLint（它是JSLint的一个分支）的更易于配置的版本创建的。您可以配置每个规则，并将它们放入配置文件中，这使得JSHint易于在大型项目中使用。JSHint还为每个规则提供了良好的文档，因此您确切地知道它们的作用。将其集成到编辑器中也很简单。

JSHint的一个小缺点是它带有宽松的默认配置。这意味着您需要进行一些设置才能使其发挥作用。与ESLint相比，也很难知道需要更改哪些规则才能启用或禁用某些错误消息。

优点：

• 大多数设置都可以配置。
• 支持配置文件，使其更易于在大型项目中使用。
• 开箱即用地支持许多库，例如jQuery、QUnit、NodeJS、Mocha等。
• 基本的ES6支持。

缺点：

• 难以知道哪个规则导致错误。
• 具有两种类型的选项：强制和放宽（可用于使JSHint更严格或抑制其警告）。这可能会使配置略微令人困惑。
• 不支持自定义规则。

JSCS

JSCS与其他工具的不同之处在于，除非您提供配置文件或告诉它使用预设，否则它不会执行任何操作。您可以从其网站下载配置，所以这不是一个大问题，它有很多预设，例如jQuery编码风格预设和Google预设。

它有超过90个不同的规则，您可以使用插件创建自定义规则。JSCS还支持自定义报告程序，这使得它更容易与需要以特定格式输入的工具集成。

JSCS是一个代码风格检查器。这意味着它只捕获与代码格式相关的问题，而不是潜在的错误。因此，它不如其他工具灵活，但是如果您需要强制执行特定的编码风格，JSCS可以很好地完成这项工作。

优点：

• 支持自定义报告程序，这可以使其更容易与其他工具集成。
• 预设和现成的配置文件可以使您更容易设置，如果您遵循可用的编码风格之一。
• 有一个标志可以在报告中包含规则名称，因此很容易找出哪个规则导致哪个错误。
• 可以使用自定义插件进行扩展。

缺点：

• 只检测代码风格冲突。JSCS不会检测潜在的错误，例如未使用的变量或意外的全局变量等。
• 四种工具中最慢的，但这在典型使用中不是问题。

ESLint

ESLint是这四种工具中最新的。它旨在易于扩展，带有大量自定义规则，并且易于安装更多插件形式的规则。它提供简洁的输出，但默认情况下包含规则名称，因此您始终知道哪些规则导致错误消息。

ESLint文档可能有点参差不齐。规则列表易于理解，并被分组到逻辑类别中，但配置说明在某些地方有点令人困惑。但是，它确实在一个位置提供了指向编辑器集成、插件和示例的链接。

优点：

• 灵活：任何规则都可以切换，并且许多规则都有可以调整的额外设置。
• 非常可扩展，并且有许多可用的插件。
• 易于理解的输出。
• 包含其他代码风格检查工具中没有的许多规则，使ESLint在检测问题方面更有用。
• 最好的ES6支持，也是唯一支持JSX的工具。
• 支持自定义报告程序。

缺点：

• 需要一些配置。
• 速度慢，但这并不妨碍使用。

推荐

这四种工具中，我选择ESLint。JSLint严格且不可配置，而JSHint缺乏扩展机制。如果您只想检查代码风格，JSCS是一个不错的选择，但是ESLint可以做到这一点，并且它还可以检查您的代码是否存在错误和其他问题。

如果您想使用ES6（或ES2015，因为他们现在似乎这样称呼它），ESLint也是显而易见的选择。在所有提到的工具中，它对ES6特性的支持最广泛。

如果您想尝试ESLint，我已经通过创建5步快速入门指南为您简化了操作。您可以从我的网站下载ESLint 5步快速入门指南。

JSHint是强大的第二选择。如果您不需要ESLint的高级功能，JSHint在正确配置后可以捕获大量问题。JSCS拥有大量可用的规则，如果您只需要代码风格检查（缩进、大括号等），它是一个不错的选择。

我犹豫是否推荐JSLint。其他工具执行相同的操作，但不强加任何特定规则给用户。唯一的例外是，如果您碰巧同意它强制执行的所有规则，在这种情况下，它可能值得研究。

代码风格检查工具是发现问题的好方法，但它只能发现其规则允许的错误。为了更可靠地自动捕获错误，我建议使用单元测试。代码审查也可以为此目的提供帮助。

您和您的团队如何确保代码的质量？

关于JavaScript代码风格检查工具的常见问题解答

(此处省略了FAQ部分，因为篇幅过长，且与伪原创目标不符。FAQ部分内容可以根据需要自行添加或修改。)

以上是JavaScript刺激工具的比较的详细内容。更多信息请关注PHP中文网其他相关文章！