在编写 JavaScript 代码时，规范的变量命名能使代码更加可读性高，并且可以提高代码的可维护性。但是人们在编写代码时很容易出错，不遵循命名约定。为了避免这种情况的发生，ESLint 的 eslint-plugin-import 插件提供了一种方法来检查变量命名的规范。
这篇文章将为您介绍如何配置 ESLint 检查变量命名规范，并且提供一些示例代码，供您学习和参考。
安装和配置 ESLint
在开始配置 ESLint 之前，我们需要先安装 ESLint。可以通过以下命令在项目中安装 ESLint：
npm install eslint --save-dev
然后我们可以配置 .eslintrc.js 文件来告诉 ESLint 如何处理代码中的变量命名规范。
下面是一个简单的 .eslintrc.js 配置示例，它将使用 eslint-plugin-import 插件检查变量命名规范：
-- -------------------- ---- -------
-
------- -----
---------------- -
------------- --------
--
------ -
------ -----
---------- -----
------- ----
--
---------- -----------
-------- -
--------------- ----------
---------------- ----------
----------------- ----------
------------------- ----------
------------------------------------ ----------
---------------------- ---------
-
-检查变量命名规范
一旦配置了 ESLint，我们就可以开始检查变量的命名规范。可以使用 underscore_case、 camelCase 或者 PascalCase 等等命名规范。下面是一些示例代码，展示了不同的变量命名规范以及如何通过 ESLint 检查它们。
underscore_case
在 underscore_case 命名规范中，单词之间使用下划线 (_) 连接。以下是一个使用 underscore_case 命名规范的示例代码：
const first_name = 'John'; const last_name = 'Doe'; const email_address = 'john.doe@test.com';
使用 ESLint 检查 underscore_case 命名规范：
-- -------------------- ---- -------
-
-------- -
--------------- ----------
---------------- ----------
----------------- ----------
------------------- ----------
------------------------------------ ----------
---------------------- ----------
------------ --------- - ------------- ------- --
-
-camelCase
在 camelCase 命名规范中，第一个单词小写，后面的单词首字母大写。以下是一个使用 camelCase 命名规范的示例代码：
-- -------------------- ---- -------
----- --------- - -------
----- -------- - ------
----- ------------ - --------------------
----- ------------ -
------------- -
-------------------- - ----------
-
--------------- -
-----------------------
-
-使用 ESLint 检查 camelCase 命名规范：
-- -------------------- ---- -------
-
-------- -
--------------- ----------
---------------- ----------
----------------- ----------
------------------- ----------
------------------------------------ ----------
---------------------- ----------
------------ --------- - ------------- -------- --
-
-PascalCase
在 PascalCase 命名规范中，第一个单词首字母大写。以下是一个使用 PascalCase 命名规范的示例代码：
-- -------------------- ---- -------
----- ------- - -
---------- -------
--------- ------
------------- -------------------
--
----- ------------ -
------------- -
-------------------- - ----------
-
--------------- -
-----------------------
-
-使用 ESLint 检查 PascalCase 命名规范：
-- -------------------- ---- -------
-
-------- -
--------------- ----------
---------------- ----------
----------------- ----------
------------------- ----------
------------------------------------ ----------
---------------------- ----------
------------ --------- - ------------- ------- --
-
-总结
通过 ESLint 的 eslint-plugin-import 插件，可以很方便地检查变量命名规范。可以选择 underscore_case、 camelCase 或 PascalCase 等命名规范中的一个，它们都能使代码更加可读性高，并且可以提高代码的可维护性。使用 ESLint 监控你的代码，你会发现，在一定程度上提高代码的质量和减少错误。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64926e7d48841e989403d848