十年匠心定制 · 商业建站与技术教学双线并行 咨询热线:400-886-1026 service@lmnt.cn
ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

eslint-plugin-unicorn 之 prefer-single-object-destructuring:合并同一 const 来源的重复对象解构声明

eslint-plugin-unicorn 之 prefer-single-object-destructuring:合并同一 const 来源的重复对象解构声明 eslint-plugin-unicorn 之 prefer-single-object-destructuring合并同一 const 来源的重复对象解构声明【免费下载链接】eslint-plugin-unicornMore than 300 powerful ESLint rules项目地址: https://gitcode.com/GitHub_Trending/es/eslint-plugin-unicorn本篇指南围绕 eslint-plugin-unicorn 的prefer-single-object-destructuring规则展开说明它如何在相邻声明读取同一本地const来源时将多条对象解构合并为一条。读完本文你将掌握该规则的匹配条件、忽略边界、自动修复行为及其在 规则源码 中的实现原理并能直接在你的项目中落地使用。规则一句话概览prefer-single-object-destructuring的规则描述是Prefer a single object destructuring declaration per local const source.每个本地const来源只使用一条对象解构声明。它建议在连续的、从同一个本地const变量取值的对象解构声明中只保留一条合并后的声明以减少重复的声明样板、提升可读性。该规则在项目 readme.md 的规则清单中被标记为 ✅recommended配置默认启用与 可自动修复。快速上手在已安装并启用 eslint-plugin-unicorn 的项目中该规则随recommended配置自动开启若你使用独立配置可按常规方式启用// eslint.config.jsflat config 示意 import unicorn from eslint-plugin-unicorn; export default [ unicorn.configs.recommended, // 或单独启用 { plugins: {unicorn}, rules: { unicorn/prefer-single-object-destructuring: error, }, }, ];规则不接收任何配置项源码中schema: []因此启用后即可工作无需额外参数。核心行为什么样的代码会被报告规则只报告相邻、声明种类相同且标识符来源相同的声明例如// ❌ 会触发修复 const foo {}; const {bar} foo; const {baz} foo; // ✅ 修复后 const foo {}; const {bar, baz} foo;同时满足以下全部条件时才会报告相邻两条声明必须是语句列表中的前后邻居中间不能插入其他语句、注释或声明。声明种类相同两条声明的kindconst/let必须一致。来源标识符相同两条声明右侧的初始化表达式必须是同一个变量名。来源是本地const绑定该标识符必须解析到一个本地const变量可变的let/var或无法解析的来源都会被忽略。模式简单解构模式必须是简单对象模式复杂模式默认忽略。哪些情况会被忽略规则边界文档和 测试用例 共同确认了以下✅ 不报告的场景// ✅ 来源是 let不是 const let foo {}; const {bar} foo; const {baz} foo; // ✅ 来源是 import不是本地 const 绑定 import foo from foo; const {bar} foo; const {baz} foo; // ✅ 两条声明不相邻中间有语句 const {bar} foo; console.log(bar); const {baz} foo; // ✅ 来源不同 const {bar} foo; const {baz} other; // ✅ 声明种类不同 const {bar} foo; let {baz} foo; // ✅ 两个声明写在同一行declarations.length 不为 1 const {bar} foo, {baz} foo; // ✅ 来源不是纯标识符 const {bar} foo.bar; const {baz} foo.bar; const {bar} foo(); const {baz} foo(); // ✅ 复杂模式rest、嵌套、默认值、计算属性 const {bar, ...rest} foo; const {baz} foo; const {bar: {qux}} foo; const {baz} foo; const {bar 1} foo; const {baz} foo; const {[bar]: value} foo; const {baz} foo; // ✅ 声明内或声明间存在注释 const { // comment bar } foo; const {baz} foo;上述有效用例全部来自 test/prefer-single-object-destructuring.js 的valid数组可作为行为契约参考。源码级实现剖析该规则的完整实现位于 rules/prefer-single-object-destructuring.js核心逻辑可分为三个判定函数与一条修复路径。1.isSimpleObjectPattern模式白名单const isSimpleObjectPattern node node.properties.length 0 node.properties.every(property property.type Property !property.computed property.value.type Identifier);一个解构模式只有满足属性数大于 0、每个属性都是普通Property、无计算属性、属性值为标识符才被视作简单。这意味着{bar: renamed}重命名、{bar: {qux}}嵌套、{bar 1}默认值、{...rest}剩余元素、{[bar]: value}计算键都不会被合并——这也是上文忽略清单的来源。值得注意测试中const {bar: bar} foo反而是无效用例会被修复因为字符串字面量键在 AST 中不表现为计算属性。2.isConstVariableReference校验来源绑定const isConstVariableReference (sourceCode, node) { const variable findVariable(sourceCode.getScope(node), node); if (!variable || variable.defs.length ! 1) { return false; } // ... return definition.type Variable definition.node.type VariableDeclarator definition.parent.type VariableDeclaration !definition.parent.declare definition.parent.kind const; };该函数借助eslint-community/eslint-utils的findVariable做作用域解析变量必须恰好有一个定义且该定义是const声明的VariableDeclarator并排除declare声明TypeScript 环境。正因如此文档中的三条✅示例let来源、import来源、函数参数/未解析来源都不会被报告。3.getSupportedDeclaration声明级筛选它要求节点本身是VariableDeclaration、kind为const或letisSupportedDeclarationKind、非declare、只含一个声明declarations.length 1且模式为简单对象模式、初始化表达式为标识符且通过isConstVariableReference校验最后返回{node, declarator, source}元数据。4. 遍历与修复getProblemgetStatementListProblemsgetProblem对相邻两条声明做最终核对kind相同、source相同、两条声明内部无注释、两条声明之间无注释通过sourceCode.getTokensBetween检测注释 token。满足条件后它生成合并文本并替换从第一条声明开头到第二条声明结尾的整段范围const replacement ${first.node.kind} {${getPropertiesText(first.declarator.id)}, ${getPropertiesText(second.declarator.id)}} ${first.source};; // fixer.replaceTextRange([firstNodeStart, secondNodeEnd], replacement)getStatementListProblems以滑动窗口方式逐个检查语句对并作为生成器产出问题。create中通过context.on注册了四类语句列表的监听Program顶层、BlockStatement与StaticBlock块体、SwitchCase的 consequent因此除顶层外普通块、class静态块和switch分支内的相邻声明同样会被检测。自动修复行为与快照验证规则声明了fixable: code可用 ESLint 的--fix直接自动修复。以下修复输出均有 快照文件 作为逐字验证依据输入修复后const foo {}; const {bar} foo; const {baz} foo;const foo {}; const {bar, baz} foo;const foo {}; let {bar} foo; let {baz} foo;const foo {}; let {bar, baz} foo;const foo {}; const {bar: renamed} foo; const {baz} foo;const foo {}; const {bar: renamed, baz} foo;for (const foo of foos) { const {bar} foo; const {baz} foo; }for (const foo of foos) { const {bar, baz} foo; }switch (value) { case 1: const foo {}; const {bar} foo; const {baz} foo; }switch (value) { case 1: const foo {}; const {bar, baz} foo; }注意快照中的两个细节重命名属性会被保留{bar: renamed}与{baz}合并为{bar: renamed, baz}修复不是简单地丢弃属性名。多行声明会归一为单行多行书写的两条声明合并后压缩为一行const {bar, baz} foo;。跨场景覆盖块语句{ ... }、class Foo { static { ... } }静态块、for...of循环体和switch分支内的同构代码均会被检测并修复与上文create注册的监听节点一一对应。适用边界与设计权衡该规则刻意保持保守原因可从实现与测试中归纳可变来源不合并来源若是let/var中间可能发生重新赋值合并会改变取值时机与语义因此仅限const绑定test/prefer-single-object-destructuring.js 中let foo {}来源即视为有效。仅限相邻声明非相邻声明之间可能存在副作用或取值变化合并需移动代码风险不可控文档示例中插入console.log(bar)即不再报告。复杂模式一律跳过嵌套、默认值、rest、计算键等模式合并后语义复杂、可读性未必提升属于by design的忽略。注释不破坏合并的前提是无注释声明内部或两条声明之间的任何注释都会导致放弃报告避免修复时丢失注释信息。TypeScript 声明排除带类型注解的const {bar}: Foo foo;与declare声明均被valid用例覆盖使用typescriptparser不会被误报。小结prefer-single-object-destructuring是一个保守、零配置、可自动修复的风格规则它只对相邻、同 kind、同一本地const来源、简单对象模式的重复解构出手通过源码中的isSimpleObjectPattern、isConstVariableReference、getSupportedDeclaration三层过滤确保语义安全并由快照测试锁定精确的修复输出。将它纳入recommended配置可以在不引入行为风险的前提下让连续的对象解构声明保持精简统一。【免费下载链接】eslint-plugin-unicornMore than 300 powerful ESLint rules项目地址: https://gitcode.com/GitHub_Trending/es/eslint-plugin-unicorn创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表