从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原型上的方法就报错

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0Yv5tRsR-1587972741717)(https://upload-images.jianshu.io/upload_images/23124486-70b7975b6229efc6.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)]

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”; \``;${KaTeX parse error: Expected 'EOF', got '}' at position 6: {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; } }

服务推荐

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值