用 eslint-plugin-unicorn 的 consistent-class-member-order 规则强制类成员统一排序
用 eslint-plugin-unicorn 的 consistent-class-member-order 规则强制类成员统一排序【免费下载链接】eslint-plugin-unicornMore than 300 powerful ESLint rules项目地址: https://gitcode.com/GitHub_Trending/es/eslint-plugin-unicorn本文聚焦 eslint-plugin-unicorn 规则consistent-class-member-order讲解它强制执行的类成员分组顺序、order配置项、为何不做自动修复而提供手动 suggestion并结合规则源码与测试快照说明其在 JS / TS 类、静态块、私有字段等场景下的真实行为与边界。读完本文你可以直接在自己的 ESLint 配置中启用或定制该规则并理解它的取舍。规则概览与启用方式consistent-class-member-order的目标是强制类成员按可预测的分组顺序排列让静态成员、实例成员、字段与方法保持相对聚集从而让类结构更快地被扫描——需要读字段时集中在同一区域需要看方法时也在同一区域。该规则具备以下特性✅ 在recommended配置中默认启用即随 configs 中的推荐配置一起开启☑️ 在unopinionated无观点配置中默认禁用 通过编辑器建议editor suggestions方式手动修复而非自动修复autofix。强制执行的成员顺序规则按以下 8 个分组强制顺序越靠前越应写在类的上方序号分组说明1static-field静态字段含static #privateField2static-block静态初始化块static {}3static-method静态方法含static #privateMethod4private-field私有实例字段#field5public-field公共实例字段6constructor构造函数7private-method私有实例方法#method8public-method公共实例方法两个关键设计点静态优先于可见性静态成员按static分组静态与私有可以组合即static #foo与其它静态字段或静态方法归为一组static-field而不是归入实例私有字段组。这一点从源码 getMemberGroup 可看出先判断member.static再判断是否私有。TypeScriptprotected与 public 同组在 TypeScript 语法下protected成员与public成员遵循相同的分组顺序。源码中 isPrivateMember 只把accessibility private视为私有protected不会命中因而归入 public 组。为什么不做自动修复规则不会自动修复原因有二见 规则文档字段与静态块的执行顺序敏感实例字段初始化、静态字段初始化以及static {}静态块都是按声明顺序执行的随意重排会改变运行时行为方法顺序可被反射观察到方法顺序通过属性反射如Object.getOwnPropertyNames等可被观察重排方法会改变反射结果。因此仅对满足以下条件的简单类体提供手动 suggestion见源码 getSuggestion类体非空类体内没有注释sourceCode.getCommentsInside(classBody)为空每个成员都位于其所在行的行首前面只有空白没有计算键computed key、装饰器decorator或规则无法识别的成员见 getReorderedMembers 中member.computed与member.decorators?.length 0的退出条件。suggestion 的提示信息为Reorder class members by group.见 messages该建议会一次性把整个类体的成员按目标顺序重排并以空行分隔各组。Optionsorder 配置项规则接受一个对象参数仅有一个配置项order类型string[]默认值[ static-field, static-block, static-method, private-field, public-field, constructor, private-method, public-method, ]约束由 schema 强制执行数组中必须且只能包含上述 8 个分组各一次minItems与maxItems均为8且uniqueItems: true元素必须是 8 个分组名之一enum校验不允许其它额外属性additionalProperties: false。测试文件 test/consistent-class-member-order.js 专门验证了这一约束缺少分组、重复分组、传入未知分组名如unknown-group都会抛出配置校验错误。运行方式为 AVA 单测例如npx ava test/consistent-class-member-order.js。自定义 order 示例如果你想采用私有在前、静态靠后的风格可配置export default [ { rules: { unicorn/consistent-class-member-order: [ error, { order: [ private-field, public-field, static-field, constructor, private-method, public-method, static-method, static-block, ], }, ], }, }, ];测试中即以该自定义顺序验证了反向场景默认顺序下合法static-field在前的类在自定义顺序下会被报告为public-field应先于static-field见快照 test/snapshots/consistent-class-member-order.js.md。示例对比以下为规则文档 docs/rules/consistent-class-member-order.md 中的原始示例// ❌ 构造函数出现在字段之前 class Foo { constructor() {} #privateField 1; publicField 1; }// ✅ 字段在前构造函数在后 class Foo { static staticField 1; #privateField 1; publicField 1; constructor() {} }// ❌ 公共方法出现在私有方法之前 class Foo { publicMethod() {} #privateMethod() {} }// ✅ 私有方法在前公共方法在后静态方法更靠前 class Foo { static staticMethod() {} #privateMethod() {} publicMethod() {} }源码实现与成员分类从源码结构看规则基于 ESLint 的ClassBody节点进行遍历见 create 函数实现要点如下成员分组判定getMemberGroupStaticBlock直接归入static-blockkind constructor的方法定义归入constructor字段类节点PropertyDefinition、AccessorProperty、TypeScript 的TSAbstractPropertyDefinition/TSAbstractAccessorProperty按static与私有性归入四个字段组之一方法类节点MethodDefinition、TSAbstractMethodDefinition同理归入方法组getter / setter 也按方法处理。成员命名getMemberName私有成员显示为#name字符串字面量键如static create()和数字字面量键如static 1_000()可解析出名称动态计算键如static [getName()]()无法取名时报告消息中只显示分组标签。快照 invalid(2)-(4) 分别展示了这三种命名行为。只报告第一个乱序成员遍历时记录已出现的最高分组下标遇到分组下标回退的成员才报告避免对整个乱序类体的每个后续成员重复报警suggestion 则负责整体重排源码注释见 rules/consistent-class-member-order.js。TypeScript 支持抽象字段 / 抽象方法abstract与accessor字段均被识别并纳入排序见测试中 TS 场景。报告消息形如Expected static method getInstance to come before public method onePublicMethod.见快照 invalid(1)。边界情况与设计取舍规则刻意保持简单只强制分组顺序不提供组内排序、空行处理或更细的成员分类等选项。若需要组内按字母排序等能力应使用专门的排序规则如perfectionist等与它配合。类体内若存在计算键成员或装饰器成员规则会跳过 suggestion只报告错误不提供重排建议原因是有这类成员时重排风险较高。规则仅支持 JS 语言languages: [js/js]见 metaCSS 等其它语言不受影响。总结consistent-class-member-order是一个按分组排序的轻量规则它把静态字段、静态块、静态方法、私有/公共实例字段、构造函数、私有/公共实例方法划分为 8 个组强制其相对顺序同时刻意不做自动修复以免破坏字段/静态块的声明序执行语义仅对简单类体提供整体重排的手动 suggestion。其order选项支持自定义 8 个组的排列但要求每个组恰好出现一次。对该规则实现细节与行为边界的验证可继续阅读 rules/consistent-class-member-order.js 及其测试 test/consistent-class-member-order.js。【免费下载链接】eslint-plugin-unicornMore than 300 powerful ESLint rules项目地址: https://gitcode.com/GitHub_Trending/es/eslint-plugin-unicorn创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考