ESLint规则中的JavaScript知识

时间  2019-11-09
标签 eslint 规则 javascript 知识 栏目 JavaScript 繁體版
原文   原文链接

网上关于ESLint的介绍，安装，配置和使用等文章已经有不少了，写的都很全面，还不清楚的同窗能够先去简单了解一下，本文就不做介绍了。javascript

本文的主要内容是经过ESLint的规则（Rules），从中学到 JavaScript 的基础知识。同时，提早了解这些规则的含义与理由，有助于在之后的开发中提早规避风险，提升代码质量。java

如下是从官网的 Rules 列表中摘取的部分规则，欢迎你们补充，共同窗习。程序员

Possible Errors

getter-return：强制在 getter 属性中出现一个 return 语句。每一个 getter 都指望有返回值。正则表达式

no-compare-neg-zero：禁止与 -0 进行比较。像 x === -0 的代码对于 +0 和 -0 都有效。你可使用 Object.is(x, -0)。例：编程

// incorrect
if (x === -0) {
    // doSomething()...
}

// correct
if (x === 0) {
    // doSomething()...
}
if (Object.is(x, -0)) {
    // doSomething()...
}
复制代码

no-cond-assign: 禁止在条件语句中出现赋值操做符。在条件语句中，很容易将一个比较运算符（像 ==）错写成赋值运算符（如 =）。在条件语句中，使用赋值操做符是有效的。然而，很难判断某个特定的赋值是不是有意为之。该规则有两个可选值：数组

  • except-parens：默认值，容许条件语句中出现赋值操做符，前提是它们被圆括号括起来。
  • always: 禁止条件语句中出现赋值语句。

no-console：禁止调用 console 对象的方法。console 这样的消息被认为是用于调试的，生产环境中不该该有关于console 的语句。同时，被console.log的变量是不会被垃圾回收的，一旦多起来会致使内存泄漏。该规则有可配置选项allow，它的值是个字符串数组，包含容许使用的console对象的方法。例如: allow: ["warn", "error"]容许使用console对象上的warn，error方法。promise

no-constant-condition：禁止在条件中使用常量表达式。浏览器

no-dupe-args: 禁止在 function 定义中出现重复的参数。安全

no-dupe-keys: 禁止在对象字面量中出现重复的键。app

no-duplicate-case: 禁止在 switch 语句中的 case 子句中出现重复的测试表达式。

no-empty: 禁止空语句块出现，该规则会忽略包含一个注释的语句块。例如，在 try 语句中，一个空的 catch 或 finally 语句块意味着程序应该继续执行，不管是否出现错误。该规则有个可配置的选项 allowEmptyCatch: true 容许出现空的 catch 子句。

no-ex-assign：禁止对 catch 子句中的异常从新赋值。若是意外地（或故意地）给异常参数赋值，是不可能引用那个位置的错误的。因为没有 arguments 对象提供额外的方式访问这个异常，对它进行赋值绝对是毁灭性的。

no-func-assign：禁止对 function 声明从新赋值。例如：

// incorrect
function foo() {}
foo = bar;

function foo() {
 foo = bar;
}
复制代码

JavaScript 函数有两种形式：函数声明 function foo() { ... } 或者函数表达式 var foo = function() { ... } 。虽然 JavaScript 解释器能够容忍对函数声明进行覆盖或从新赋值，但一般这是个错误，应该避免。

no-inner-declarations：禁止在嵌套的块中出现变量声明或 function 声明。可选值(string)：functions(默认)，both（禁止 function 和 var 声明出如今嵌套的语句块中）。这只适用于函数声明，命名的或匿名的函数表达式是能够出如今任何容许的地方。在 ES6 以前的 JavaScript 中，函数声明只能在程序或另外一个函数体的顶层。因为变量声明提高，把声明放在程序或函数体的顶部会使代码更清晰，在任何地方随意声明变量的作法一般是不可取的。由于在ES6中的 let 和 const 不会被提高，所以它们不受此规则影响。

no-irregular-whitespace：禁止在字符串和注释以外不规则的空白。无效的或不规则的空白会致使 ECMAScript 5 解析问题，也会使代码难以调试（相似于混合 tab 和空格的状况）。 引发的问题以及禁止出现的不正常字符

no-obj-calls：禁止把全局对象做为函数调用，如 Math、JSON 和 Reflect等。

no-sparse-arrays：禁用稀疏数组，也就是逗号以前没有任何元素的数组。该规则不适用于紧随最后一个元素的拖尾逗号的状况。例如：

// incorrect
var arr = [,,];
var colors = [ "red",, "blue" ];

// correct
var arr = [];
var arr = new Array(23);
var colors = [ "red", "blue", ];
复制代码

no-unexpected-multiline：禁止使用使人困惑的多行表达式。在 JavaScript 中，分号一般是可选的，由于会自动插入分号（ASI)。换行不结束语句，书写错误遗漏了分号，这些异常会致使两个不相干的连续的行被解释为一个表达式。特别是对于一个没有分号的代码风格，读者可能会忽略这些错误。尽管语法上是正确的，代码执行时可能会抛出异常。

no-unreachable：禁止在 return、throw、continue 和 break 语句后出现不可达代码。由于这些语句无条件地退出代码块，其以后的任何语句都不会被执行。

use-isnan：禁止与 NaN 的比较，要求调用 isNaN()检查 NaN。在 JavaScript 中，NaN 是 Number 类型的一个特殊值。它被用来表示非数值(Not A Number)，这里的数值是指在 IEEE 浮点数算术标准中定义的双精度64位格式的值。

console.log(typeof NaN); // "number"
复制代码

由于在 JavaScript 中 NaN 独特之处在于它不等于任何值，包括它自己，与 NaN 进行比较的结果也使人困惑：

console.log(NaN !== NaN); // true
console.log(NaN === NaN); // false
复制代码

所以，使用 Number.isNaN() 或 全局的 isNaN() 函数来测试一个值是不是 NaN。

valid-typeof：强制 typeof 表达式与有效的字符串进行比较。对于绝大多数用例而言，typeof 操做符的结果是如下字符串字面量中的一个："undefined"、"object"、"boolean"、"number"、"string"、"function" 和 "symbol"。把 typeof 操做符的结果与其它字符串进行比较，一般是个书写错误。例：

// incorrect
typeof foo === "strnig"
typeof foo == "undefimed"
typeof bar != "nunber"
typeof bar !== "function"

// correct
typeof foo === "string"
typeof bar == "undefined"
typeof foo === baz
typeof bar === typeof qux
复制代码

Best Practices

accessor-pairs：强制getter/setter成对出如今对象中。该规则强制一种编码风格：对于每一个属性，若是定义了setter，也必须定义相应的 getter。没有 getter ，你不能读取这个属性，该属性也就不会被用到。

array-callback-return：强制数组某些方法的回调函数中有 return 语句。 Array 有一些方法用来过滤、映射和折叠。若是你忘记了在它们的回调函数中写 return 语句，这种状况多是个错误。须要 return 语句的方法有：

  • Array.from
  • Array.prototype.every
  • Array.prototype.filter
  • Array.prototype.find
  • Array.prototype.findIndex
  • Array.prototype.map
  • Array.prototype.reduce
  • Array.prototype.reduceRight
  • Array.prototype.some
  • Array.prototype.sort

default-case：要求 wwitch 语句中有 default 分支，即便默认分支中没有任何代码。开发人员可能忘记定义默认分支而致使程序发生错误，因此明确规定定义默认分支是很好的选择。或者也能够在最后一个 case 分支下，使用 // no default 来代表此处不须要 default 分支。

eqeqeq：要求使用 === 和 !== 代替 == 和 != 操做符。缘由是 == 和 != 在比较时会做强制转型，有时会产生反作用甚至异常。 有两个可选值：

  • always : 强制在任何状况下都使用 === 和 !==
  • smart： 除了如下这些状况外，强制使用 === 和 !== ：
    • 比较两个字面量的值
    • 比较 typeof 的值
    • 与 null 进行比较

no-alert：禁用 alert、confirm 和 prompt。JavaScript 的 alert、confirm 和 prompt 被普遍认为是突兀的 UI 元素，应该被一个更合适的自定义的 UI 界面代替。此外, alert 常常被用于调试代码，部署到生产环境以前应该删除。所以，当遇到 alert、prompt 和 confirm 时，该规则将发出警告。

no-caller：禁用 arguments.caller 或 arguments.callee。它们的使用使一些代码优化变得不可能。在 JavaScript 的新版本中它们已被弃用，同时在 ECMAScript 5 的严格模式下，它们也是被禁用的。

no-case-declarations：禁止词法声明 (let、const、function 和 class) 出如今 case 或 default 子句中。词法声明在整个 switch 语句块中是可见的，可是它只有在运行到它定义的 case 语句时，才会进行初始化操做。 为了保证词法声明语句只在当前 case 语句中有效，将你子句包裹在块中。例：

// incorrect
switch (foo) {
    case 1:
        let x = 1;
        break;
    case 2:
        const y = 2;
        break;
    case 3:
        function f() {}
        break;
    default:
        class C {}
}

// correct
switch (foo) {
    // 下面的 case 子句使用括号包裹在了块中
    case 1: {
        let x = 1;
        break;
    }
    case 2: {
        const y = 2;
        break;
    }
    case 3: {
        function f() {}
        break;
    }
    case 4:
        // 由于函数做用域提高，使用 var 声明而不使用括号包裹是合法的。
        var z = 4;
        break;
    default: {
        class C {}
    }
}
复制代码

no-else-return：禁止 if 语句中 return 语句以后有 else 块。若是 if 块中包含了一个 return 语句，else 块就成了多余的了。能够将其内容移至块外。例：

// incorrect
function foo() {
    if (x) {
        return y;
    } else {
        return z;
    }
}

// correct
function foo() {
    if (x) {
        return y;
    }

    return z;
}
复制代码

no-empty-function：禁止出现空函数。空函数能下降代码的可读性，若是一个函数包含了一条注释，它将不会被认为有问题。该规则有一个选项，配置所容许的空函数列表，默认为空数组。

no-empty-pattern：禁止使用空解构模式。当使用解构赋值时，可能建立了一个不起做用的模式。把空的花括号放在嵌入的对象的解构模式右边时，就会产生这种状况。例：

// incorrect
var {} = foo;
var [] = foo;
var {a: {}} = foo;
var {a: []} = foo;
function foo({}) {}
function foo([]) {}
function foo({a: {}}) {}
function foo({a: []}) {}

// correct
var {a = {}} = foo;
var {a = []} = foo;
function foo({a = {}}) {}
function foo({a = []}) {}
复制代码

no-eq-null：禁止使用 == 和 != 操做符与 null 进行比较。当你进行比较时可能得意想不到的的结果，由于 null 和 null 与 undefined 的比较结果都为 true。

no-eval：禁用 eval()。JavaScript 中的 eval() 函数是有潜在危险的，并且常常被误用。eval() 在大多数状况下能够被更好的解决问题的方法代替。

no-global-assign：禁止对原生对象或只读的全局对象进行赋值。JavaScript 环境包含不少内置的全局变量，好比浏览器环境的 window 和 Node.js 中的 process。在几乎全部状况下，你都不该该给全局变量赋值，由于这样作可能会到致使没法访问到重要的功能。

no-implicit-globals：禁止在全局范围下使用 var 和命名的 function 声明。由于这样，会做为 window 对象的一个属性或方法存在。全局变量应该显式地赋值给 window 或 self。不然，局部变量应该包裹在 IIFE 中。该规则不适用于 ES 和 CommonJS 的模块，由于它们有本身的模块做用域。

no-invalid-this：禁止 this 关键字在类或类对象以外出现。该规则 只 在严格模式下生效，在严格模式下，类或者类对象以外的 this 关键字多是 undefined 而且引起 TypeError。

no-iterator：禁用 __iterator__ 属性。这个属性如今废弃了，因此不该再使用它。如今，应该使用 ES6 迭代器和生成器。

no-lone-blocks：禁用没必要要的嵌套块。在 ES6 以前，由花括号分隔开的独立代码块不会建立新的做用域，也就不起什么做用，代码块是多余的。例：

{ // 该括号对 foo 不起任何做用
    var foo = bar();
}
复制代码

在 ES6 中，若是出现一个块级绑定 (let 和 const)，类声明或函数声明（在严格模式下），代码块就会建立一个新的做用域。在这些状况下，代码块不会被认为是多余的。

no-multi-spaces：禁止在逻辑表达式、条件表达式、声明、数组元素、对象属性、序列和函数参数周围使用多个空格。

no-new：禁止使用 new 关键字调用构造函数但却不将结果赋值给一个变量。好比 new Thing() 建立的对象会被销毁由于它的引用没有被存储在任何地方。

no-new-func：禁止对 Function 对象使用 new 操做符。JavaScript 中可使用 Function 构造函数建立一个函数，如 var x = new Function("a", "b", "return a + b");，把一个字符串传给 Function 构造函数，你须要引擎解析该字符串，这一点同调用 eval 函数同样，应该避免这样使用。

no-new-wrappers：禁止对 String，Number 和 Boolean 使用 new 操做符。在 JavaScript 中有3种原始类型包装对象：字符串，数字和布尔值。它们所表明的构造器分别为 String、Number 和 Boolean。 下面的例子使用 new 操做符后使用 typeof 将返回 "object"，而不是 "string", "number" 和 “boolean”，这意味着可能与预期不符。

var stringObject = new String("Hello world");
var numberObject = new Number(33);
var booleanObject = new Boolean(false);
复制代码

并且，每一个对象的判断都是真，这意味着每一个 Boolean 的实例都会返回 true，即便它们实际的值是 false。因此，应该避免使用 new 来使用原始包装类型。通常状况下，下面这样使用便可。

var text = String(someValue);
var num = Number(someValue);
var bol = Boolean(someValue);
复制代码

no-param-reassign：禁止对 function 的参数进行从新赋值。好比：function f(arg) { arg = 1; } 或 function f(obj) { obj.num = 1; }。对函数参数中的变量进行赋值可能会误导读者，致使混乱，也会改变 arguments 对象。若是参数是引用类型，好比对象，修改对象的属性会影响到传入函数的那个原始对象。若是须要修改能够复制一份数据再改。

no-proto：禁用 __proto__ 属性。__proto__ 属性在 ECMAScript 3.1 中已经被弃用，而且不该该在代码中使用。应该使用 getPrototypeOf 方法替代 __proto__。getPrototypeOf是获取原型的首选方法。

no-redeclare：禁止屡次声明同一变量。这会使变量实际声明和定义的位置混乱不堪。

no-return-assign：禁止在 return 语句中使用赋值语句。由于很难判定 return 语句的意图。多是赋值，但赋值的意图也可能不明确，也多是比较。

no-self-assign：禁止自身赋值。自身赋值不起任何做用。

no-self-compare：禁止自身比较。几乎没有场景须要你比较变量自己。

no-unmodified-loop-condition：禁用一成不变的循环条件。循环条件中的变量在循环中是要常常改变的。若是不是这样，那么多是个错误。

no-useless-call：禁止没必要要的 .call() 和 .apply()。例以下面的代码与 foo(1, 2, 3)效果相同：

foo.call(undefined, 1, 2, 3);
foo.apply(undefined, [1, 2, 3]);
foo.call(null, 1, 2, 3);
foo.apply(null, [1, 2, 3]);
复制代码

函数的调用能够写成 Function.prototype.call() 和 Function.prototype.apply()，可是 Function.prototype.call() 和 Function.prototype.apply() 比正常的函数调用效率低。

no-useless-concat：禁止没必要要的字符串字面量或模板字面量的链接。把两个字符拼接在一块儿是没有必要的，好比： var foo = "a" + "b"; 直接写做 var foo = "ab"; 便可。

no-useless-escape：禁用没必要要的转义字符。对字符串、模板字面量和正则表达式中的常规字符进行转义，不会对结果产生任何影响，但它是多余的。

// 没必要要使用转义符
"\'";
'\"';
"\#";
"\e";
`\"`;
`\"${foo}\"`;
`\#{foo}`;
/\!/;
/\@/;

// 须要使用转义符
"\"";
'\'';
"\x12";
"\u00a9";
"\371";
"xs\u2111";
`\``;
`\${${foo}}`;
`$\{${foo}}`;
/\\/g;
/\t/g;
/\w\$\*\^\./;
复制代码

prefer-promise-reject-errors：要求使用 Error 对象做为 Promise 拒绝的缘由。Error 对象会自动存储堆栈跟踪，在调试时，经过它能够用来肯定错误是从哪里来的。若是 Promise 使用了非 Error 的值做为拒绝缘由，那么就很难肯定 reject 在哪里产生。

require-await：禁止使用不带 await 表达式的 async 函数。async 函数不包含 await 函数可能不是重构想要的结果。

vars-on-top：要求全部的 var 声明出如今它们所在的做用域顶部。默认的，JavaScript 的解析器会隐式的将变量的声明移到它们所在做用域的顶部（"变量提高"）。这个规则迫使程序员经过手动移动变量声明到其做用域的顶部来实现这个行为，有助于提升可维护性。

wrap-iife：要求 IIFE 使用括号括起来。你能够当即调用函数表达式，而不是函数声明。建立一个当即执行函数 (IIFE) 的一个通用技术是用括号包裹一个函数声明。括号内的函数被解析为一个表达式，而不是一个声明。

Variable Declarations

no-delete-var：禁止删除变量。delete 的目的是删除对象的属性。使用 delete 操做删除一个变量可能会致使意外状况发生。

no-label-var：不容许标签与变量同名。

no-shadow：禁止变量声明与外层做用域的变量同名。例：

var a = 3;
function b() {
    var a = 10;
}
复制代码

b() 做用域中的 a 覆盖了全局环境中的 a。这会混淆读者而且在 b 中不能获取全局变量。

no-shadow-restricted-names：禁止重定义遮蔽关键字。全局对象的属性值 (NaN、Infinity、undefined)和严格模式下被限定的标识符 eval、arguments 也被认为是关键字。重定义关键字会产生意想不到的后果且易迷惑其余读者。

no-undef-init：禁止将变量初始化为 undefined。在 JavaScript 中，声明一个变量但未初始化，变量会自动得到 undefined 做为初始值，所以，初始化变量值为 undefined 是多余的。

no-unused-vars：禁止出现未使用过的变量。已声明的变量在代码里未被使用过，就像是因为不完整的重构而致使的遗漏错误。这样的变量增长了代码量，而且混淆读者。

no-use-before-define：禁止在变量定义以前使用它们。在 ES6 标准以前的 JavaScript 中，某个做用域中变量和函数的声明会被提早到做用域顶部（"变量提高"），因此可能存在这种状况：此变量在声明前被使用。这会扰乱读者。在 ES6 中，块级绑定 (let 和 const) 引入"暂时性死区"，当企图使用未声明的变量会抛出 ReferenceError。

Node.js and CommonJS

global-require：要求 require() 出如今顶层模块做用域中。在 Node.js 中，使用 require() 函数引入依赖的模块，它在模块顶层被调用，这样更容易识别依赖关系。当它们在深层次嵌套在函数和其它语句时，就很难识别依赖。由于 require() 是同步加载的，在其它地方使用时，会致使性能问题。此外，ES6 模块要求 import 和 export 语句只能放在模块顶部。

handle-callback-err：要求回调函数中有容错处理。在 Node.js 中，最广泛的处理异步行为是回调模式。这个模式指望一个 Error 对象或 null 做为回调的第一个参数。若是忘记处理这些错误会致使你的应用程序出现一些很是奇怪的行为。

no-buffer-constructor：禁用 Buffer() 构造函数。在 Node.js 中，Buffer 构造函数的行为取决于其参数的类型。将用户输入的参数传递给 Buffer()，而不验证其类型，会致使安全漏洞，好比远程内存泄漏和拒绝服务。所以，Buffer 构造函数已经被弃用，不该该再使用。使用 Buffer.from、Buffer.alloc 和 Buffer.allocUnsafe 生成器方法代替。

no-new-require：禁止调用 require 时使用 new 操做符。require 方法被用来引入不一样文件中模块。某些模块可能返回一个构造函数，会出现 var app = new (require(moduleName)); 的状况，这样可能会引发潜在的混乱，应该避免这样的状况，分红多行写会使你的代码更清晰。

Stylistic Issues

关于空格，换行，声明，标点符号等风格规则，很是主观，依据我的或团队编码风格自定义，这里不做介绍。

ECMAScript 6

这些规则只与 ES6 有关，即一般所说的 ES2015

arrow-body-style：要求箭头函数体使用大括号。为了规避箭头函数语法可能带来的错误，当函数体只有一行的时候，若不加大括号，会默认把这行代码的返回结果给隐式 return。当函数体有多行的时候，必须使用大括号，而且须要本身写 return 语句。可选值有：

  • always--强制始终用大括号
  • as-needed--当大括号是能够省略的，强制不使用它们
  • never--禁止在函数体周围出现大括号

arrow-parens：要求箭头函数的参数使用圆括号。箭头函数体只有一个参数时，能够省略圆括号。其它任何状况，参数都应被圆括号括起来。该规则强制箭头函数中圆括号的使用的一致性。可选值有：

  • always--要求在全部状况下使用圆括号将参数括起来。
  • as-needed--当只有一个参数时容许省略圆括号。

constructor-super：要求在构造函数中有 super() 的调用。派生类中的构造函数必须调用 super()。非派生类的构造函数不能调用 super(), 不然 JavaScript 引擎将引起一个运行时错误。

no-class-assign：禁止修改类声明的变量。大多数状况下，class A {}; A = 0;这样的修改是个错误。

no-const-assign：禁止修改 const 声明的变量。

no-dupe-class-members：禁止类成员中出现重复的名称。若是类成员中有同名的声明，最后一个声明将会默默地覆盖其它声明，它可能致使意外的行为。

no-duplicate-imports：禁止重复模块导入。为每一个模块使用单一的 import 语句会是代码更加清新，由于你会看到从该模块导入的全部内容都在同一行。import { A } from 'module'; import { B } from 'module'; 应该合并为 import { A, B } from 'module'; 会使导入列表更加简洁。

no-new-symbol：禁止 Symbol 和 new 一块儿使用。Symbol 应该做为函数调用。

no-this-before-super：禁止在构造函数中，在调用 super() 以前使用 this 或 super。在派生类的构造函数中，若是在调用 super() 以前使用 this 或 super，它将会引起一个引用错误。

no-useless-rename：禁止在 import 和 export 和解构赋值时将引用重命名为相同的名字。ES2015 容许在 import ，export 和解构赋值时对引用进行重命名。引用有可能被重命名成相同的名字。import { foo as foo } from "bar"; 这和没有重命名是等价的，所以这种操做彻底冗余。

no-var：要求使用 let 或 const 而不是 var。块级做用域在不少其余编程语言中很广泛，能帮助程序员避免错误。

object-shorthand：要求或禁止对象字面量中方法和属性使用简写语法。ECMAScript 6 提供了简写的形式去定义对象中的方法和属性。你能够配置该规则来要求或禁止简写。

// 属性
var foo = {
    x: x,
    y: y,
    z: z,
};
// 等效于
var foo = { x, y, z }

// 方法
var foo = {
    a: function() {},
    b: function() {}
};

//等效于
var foo = {
    a() {},
    b() {}
}
复制代码

prefer-const：要求使用 const 声明那些声明后再也不被修改的变量。若是一个变量不会被从新赋值，最好使用 const 进行声明。从而减小认知负荷，提升可维护性。

prefer-rest-params：要求使用剩余参数而不是 arguments。剩余参数获得的是真正的数组，而 arguments是类数组，没有 Array.prototype 方法，有时候还须要再转化一步。剩余参数的语义更明确，即声明的形参以外的实参会被归进数组。

prefer-spread：要求使用扩展运算符而非 .apply()。在 ES2015 以前，必须使用 Function.prototype.apply() 调用可变参数函数。如 var args = [1, 2, 3, 4]; Math.max.apply(Math, args);，在 ES2015 中，可使用扩展运算符调用可变参数函数。var args = [1, 2, 3, 4]; Math.max(...args);

prefer-template：要求使用模板字面量而非字符串链接。

require-yield：要求 generator 函数内有 yield。

import/no-mutable-exports：禁止 export 暴露可更改的数据。也就是说 export 出的必须用 const 定义，如：const name = 'a'; export default name;

未完待续 欢迎你们补充……

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程