从eslint规则学点JavaScript知识
在知识星球陆续发了些eslint小知识,意在通过eslint知识去了解规则内部的原理,汇总在此:
prefer-const
含义:始终用const定义你从不修改的变量,如果会被修改则使用let,永不使用var。
理由:让你写代码的时候更明确哪些变量是会被修改的,哪些是不会修改的。帮你理清逻辑,减少bug
no-array-constructor
含义: 不要使用Array构造器去创建数组,总是使用字面量。
理由: 当给Array构造器传一个参数时可能造成混淆,比如 new Array(3),它表示什么呢?
1) [undefined, undefined, undefined];
2)[3],
你可能在这两种结果中犹豫 另外一个理由就是,Array构造器可能被改写,有不可预知的风险。
no-prototype-builtins
含义: 禁止直接调用Object原型上的方法,如foo.hasOwnProperty('name'). 应该换用Object.prototype.hasOwnProperty.call(foo, 'name')
理由:Object.create方法允许给新创建的对象指定原型,意味着对象的原型可能是不明确的。如果用Object.create(null)创建了无原型的对象,再调用Object原型上的方法就报错
func-style
含义:用于指定定义函数的方式,有两个值:expression--表达式,declaration--函数声明
理由:用函数声名的方式定义的函数,会进行变量提升,有可能给人带来理解上的困惑,而表达式定义的不会。为了统一代码风格,最好确定一种函数定义风格。
prefer-rest-params
含义: 建议用剩余参数语法function f(a, b, ...args)来动态获取函数参数,而不是使用arguments
理由:
1. 剩余参数得到的是真正的数组,而arguments是类数组,有时候还需要再转化一步。
2. 剩余参数的语义更明确,即声明的形参之外的实参会被归进数组
no-useless-escape
含义:不使用多余的转义符,官方列出了一些没必要使用转义符的情况: "\'"; '\"'; "\#"; "\e"; `\"`; `\"${foo}\"`; `\#{foo}`; /\!/; /\@/; 以及需要使用转义符的地方: "\""; '\''; "\x12"; "\u00a9"; "\371"; "xs\u2111"; `\``; `\${${foo}}`; `$\{${foo}}`; /\\/g; /\t/g; /\w\$\*\^\./;
no-param-reassign
含义: 不要给函数的参数重新赋值。比如:function f(arg) { arg = 1; }或function f(obj) { obj.num = 1; }
理由:
1. 给函数的参数重新赋值会改变arguments对象,给后面的代码带来风险
2. 如果参数是引用类型,比如对象,修改对象的属性会影响到传入函数的那个原始对象
3. 影响V8引擎的性能
4. 改动传入的参数本身也是不明智的逻辑,如果需要可以复制一份数据再改。
arrow-body-style
含义: 箭头函数的内容是否用大括号包起来,取值有:always--始终用大括号,as-needed--需要的时候使用,never--从不使用
理由: 为了规避箭头函数语法区别可能带来的错误:函数体只有一行的时候,若不加大括号,会默认把这行代码的返回结果给return。函数体有多行的时候,必须使用大括号,并且需要自己写return语句。
import/no-mutable-exports
含义:用export暴露模块内容时,不应暴露可更改的数据。也就是说export出的必须用const定义,如:const name = 'a'; export default name;
理由:模块暴露的数据、函数等不应被更改。
no-multi-assign
含义: 禁止连续赋值,例如:let a = b = c = 1;
理由:
1. b和c会变成全局变量,造成意外风险
2. 阅读起来不清晰,debug困难
no-case-declarations
含义: 不要在switch语句的case中定义变量,包括使用let/const/function/class
理由:
1. switch语句是一个块级作用域,case下的let看起来是在整个作用域下可见的,但其实是在执行到当前case的时候才被初始化。容易使人迷惑。
2. 避免了在多个case中创建同名变量
推荐写法:
1. 在switch语句外部定义变量
2. 在case中使用大括号创建新的作用域,如: switch(name){ case 'a': { let xx = 1; break; } }
欢迎博主的加入知识星球~