未使用的函数参数校验

2019 年 1 月，TypeScirpt 官方决定全面采用 ESLint 作为代码检查的工具。
tsc提供类型检查，ESLint提供代码规范检查，两者结合，可以提供更好的ts开发体验和代码规范。

此处主要讲一些开发中可能会遇到的问题的解决。

未使用的函数参数校验

前面观看Vue Router模块时，大家可能会发现，导航守卫的三个参数 to、from、next 有时我会在其中一两个参数的前面加一个下划线 _ 。那么这是为了什么呢？
通常情况下，如果我们声明的函数中，有参数没有使用，ts会提出告警：

// 已声明“userId”，但从未读取其值。ts(6133)
function getName(userId) {
  return '韩梅梅'
}

但是我们也会经常遇到这样一种情况：
一个函数有多个参数，我们必须使用其中几个，但有些不使用的参数排在必须使用的参数的前面，未经处理时，ts还是会给出报错。就比如导航守卫：

// .vue组件内
import { Component, Vue } from 'vue-property-decorator'
import { Route, NavigationGuardNext } from 'vue-router'
@Component
export default class App extends Vue {
  private beforeRouteLeave(to: Route, _from: Route, next: NavigationGuardNext) {
    if (to.name === 'user') {
      next()
    }
  }
}

在上述的例子中，我们需要判断 to.meta 的值是否符合要求，符合要求我们才允许路由跳转。
在该例子中，我们必须使用 to、next 两个参数，不使用 from。但由于这个守卫方法是vue定义好的，我们不能更改它的使用，必须按照顺序保持三个参数的声明。
而为了应对这种特殊情况，ts提供了一个规则，在不用的参数前面加一个下划线 _ ，就不会报错了。
下划线的作用在于告诉ts这个参数我不会使用它，让他不对这个参数做参数未使用的校验。

但如果你未使用的参数排在最后面（在要使用的参数后面），例如以下几种情况时，即使你加了下划线ts也会抛出错误，这种情况还是删掉没用的参数吧：

export default class About extends Vue {
  // 参数只有一个且未使用
  public getName(_userId: string) {
    // '_userId' is defined but never used.eslint@typescript-eslint/no-unused-vars
    return '韩梅梅'
  }
  // 未使用的参数排在最后面
    public getUserInfo(id: string, _name: string, _age: number): string {
    // '_name','_age' is defined but never used.eslint@typescript-eslint/no-unused-vars
    return id + '123'
  }
}

代码检查 - Troubleshootings

未使用的函数参数校验