编者注:本文是我们的代码优化系列的一部分,我们在其中探讨如何优化编码以提高效率,以期成为更好的编码人员。

在计算机编程掉毛静态分析代码的过程中找到类似错误的语法,以及代码前途未卜的使用问题 用于起绒的工具称为皮棉短绒 今天可用于JavaScript的短毛绒之一是JSHint。

JSHint可用于多个平台。 我们大多数人都熟悉的在线Web工具位于jshint.com 还有通过Node.js命令行工具JavaScript API多个文本编辑器和 JSHint的IDE插件 您可以在JSHint网站的下载和安装页面上查看适用于不同环境的JSHint工具的完整列表。

根据其网站,使用JSHint工具的两种最常见的方式是用作命令行工具API 让我们看一下如何下载使用的工具,以及工具提供的其他优化工具。

通过命令行工具

步骤1

如果您尚未在计算机中安装Node.js,则必须访问其网站并首先下载并安装它。 要检查Node.js是否已成功安装,可以在命令行界面 (CLI)中运行命令npm -version ,它会向您显示计算机中Node.js的版本(或者您可以运行命令npm ,看看会发生什么。

阅读更多: Node.js入门指南

第2步

要安装JSHint工具, npm install jshint在CLI中运行命令npm install jshint 如果要检查是否已成功安装jshint -version ,请运行命令jshint -version以查看其版本。 完成此步骤后,安装完成。

第三步

要运行该工具,请转到CLI中JavaScript文件(例如test.js )所在的目录,然后运行命令jshint test.js 该工具对您JavaScript代码进行分析的结果将显示出来(类似这样):

使用JSHint整理JavaScript的指南

通过JavaScript API

步骤1

从此GitHub链接下载压缩文件,并将其解压缩。 dist文件夹中,您将找到jshint JS文件(API库)。

第2步

要使用该API,请将jshint JS文件添加到您的项目中并将其链接到您的页面。 可以使用称为JSHINT的函数/对象以JavaScript代码访问API。 下面是一个示例HTML代码,其中JSHintJavaScript API用于分析source数组中存在JavaScript代码并在页面上显示分析结果。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<script src="jshint.js"> </script>
<script>  /* Array containing the JavaScript code to be analysed */
    var source = [
      'var obj = {}',
      'foo();'
    ];
    /* Linting options (optional) */
    var options = {
      undef: true,
      unused: true
    };
    /* API is invoked */
    JSHINT(source);
    /* The tool's analysis output is written on the page after the JSON object -> String conversion */
    document.write(JSON.stringify(JSHINT.data())); </script>
</body>
</html>
第三步

我们将包含要分析JavaScript源代码的source数组和包含linting选项的options对象(稍后将介绍选项 )作为JSHINT函数的参数传递。 分析结果(一个JSON对象)是从JSHINTdata属性data

第四步

JSON.stringify在这里仅用于显示,以字符串形式在页面上显示从data函数返回的结果。 美化的 JSON字符串如下所示。 突出显示的部分是JSHint用简单的句子措辞发现的错误。

使用JSHint整理JavaScript的指南

棉绒选项

整理选项使我们可以配置整理过程。 我们可以指定需要纠正的错误类型或错误类型,而不需要的类型。 在前面的示例中,使用了两种棉绒选项,即undefunused

undef选项标记未声明的变量, unused将标记已声明但从未使用过的变量。 像这些一样,您可以在此页面中看到许多其他选项,如果要搜索选项,则右上角提供了搜索栏。

如果通过Node.js使用CLI工具,则可以在同一目录中的属性jshintConfig下的package.json文件中写入linting选项。 您还可以在JavaScript代码中将选项作为指令添加。

// -- test.js --
/* jshint undef: true, unused: true  */
foo();
a = 7;
使用JSHint整理JavaScript的指南

根据您使用的工具,有更多方法可以在项目中配置棉绒选项。 在此处检查不同的配置方式。

翻译自: https://www.hongkiat.com/blog/code-optimisation-linting-jshint/

相关文章: