跳至主要内容

class-literal-property-style

强制类上的字面量以一致的风格暴露。

🎨

在 "plugin:@typescript-eslint/stylistic" 中扩展 ESLint 配置 将启用此规则。

💡

此规则报告的一些问题可以通过编辑器 建议 手动修复。

一些 TypeScript 应用程序使用带有 `readonly` 修饰符的字段在类上存储字面量值，以防止它们被重新赋值。然而，在编写可能被 JavaScript 用户使用的 TypeScript 库时，通常更安全的是使用 `getter` 来公开这些字面量，因为 `readonly` 修饰符是在编译时强制执行的。

此规则旨在确保类公开的字面量以两种方式之一一致地完成，如上所述。默认情况下，此规则更喜欢 `fields` 样式，因为它意味着 JS 不必设置和拆卸函数闭包。

.eslintrc.cjs
module.exports = {
  "rules": {
    "@typescript-eslint/class-literal-property-style": "error"
  }
};

在游乐场中尝试此规则 ↗

选项​

此规则接受以下选项

type Options = ['fields' | 'getters'];

const defaultOptions: Options = ['fields'];
注意

此规则仅检查常量字面量值（字符串、模板字符串、数字、bigint、布尔值、正则表达式、null）。它不检查对象或数组，因为在这些情况下，只读字段的行为与 getter 不同。它也不检查函数，因为使用只读字段和箭头函数值作为自动绑定方法是一种常见模式。这是因为这些类型可以被修改，并且在使用方面具有更复杂的含义。

"fields"​

此样式检查任何返回字面量值的 getter 方法，并要求它们使用带有 `readonly` 修饰符的字段定义。

使用 `fields` 样式的代码示例

class Mx {
  public static get myField1() {
    return 1;
  }

  private get ['myField2']() {
    return 'hello world';
  }
}
在游乐场中打开

"getters"​

此样式检查任何被分配字面量值的 `readonly` 字段，并要求它们定义为 getter。此样式与 @typescript-eslint/prefer-readonly 规则配合使用效果很好，因为它将识别可以是 `readonly` 的字段，因此应该将其改为 getter。

使用 `getters` 样式的代码示例

class Mx {
  readonly myField1 = 1;
  readonly myField2 = `hello world`;
  private readonly myField3 = 'hello world';
}
在游乐场中打开

何时不使用它​

当您没有强烈的偏好，或者不希望强制执行特定样式来显示类公开的字面值时。

资源​