开发工具【免费下载链接】justA library of dependency-free JavaScript utilities that do just one thing.项目地址https://gitcode.com/gh_mirrors/jus/just点击查看免费下载just-kebab-case是 Just 库中负责字符串 kebab-case 转换的独立 npm 模块它只做一件事把任意大小写、空格、标点混杂的字符串规范化为lower-case-with-hyphens形式。阅读本文后你将掌握该工具的完整 API、安装与双模块ESM/CJS引入方式、源码级转换原理含连续大写、Unicode 字符等边界规则、测试用例验证方法以及它相对 Lodash 同类工具的取舍依据。一、工具定位一个只做一件事的零依赖模块just-kebab-case隶属于 Just 库官方包名just-kebab-case仓库内路径为 packages/string-kebab-case是项目 Strings 字符串工具族中的一员与just-camel-case、just-snake-case、just-pascal-case并列。它的核心承诺来自 Just 库的整体理念零依赖zero-dependency、只做一件事do just one thing。该模块不依赖任何第三方包package.json 的keywords中明确标注了no-dependencies。在仓库根目录的 TRADEOFFS.md 中作者给出了一个量化的取舍依据just-kebab-case压缩后约149b而 Lodash 的kebabCase约为1720b——如果你关心 JavaScript 体积尤其是移动端与 PWA 场景且不依赖 Lodash 的参数强转能力那么 Just 是更轻量的选择。二、安装与快速上手官方推荐通过 npm 或 yarn 安装详见 packages/string-kebab-case/README.mdnpm install just-kebab-caseyarn add just-kebab-case安装后即可在项目中引入并使用import kebabCase from just-kebab-case; kebabCase(the quick brown fox); // the-quick-brown-fox kebabCase(the-quick-brown-fox); // the-quick-brown-fox kebabCase(the_quick_brown_fox); // the-quick-brown-fox kebabCase(theQuickBrownFox); // the-quick-brown-fox kebabCase(theQuickBrown Fox); // the-quick-brown-fox kebabCase(thequickbrownfox); // thequickbrownfox kebabCase(the - quick * brown# fox); // the-quick-brown-fox kebabCase(theQUICKBrownFox); // the-q-u-i-c-k-brown-fox注意最后一个示例theQUICKBrownFox转换后是the-q-u-i-c-k-brown-fox——连续大写字母会被逐字拆开这正是 kebab-case 工具区别于简单toLowerCase().replace(/\s/g, -)的关键行为后文会结合源码详细解释。三、API 与类型定义该模块对外只暴露一个默认导出函数签名如下见 index.d.tsdeclare function kebabCase(value: string): string; export default kebabCase;入参一个字符串value返回值kebab-case 规范化后的字符串。类型层面做了严格约束模块自带 TypeScript 声明与类型测试 index.tests.ts其中通过// ts-expect-error标注了非法调用例如import kebabCase from ./index // OK kebabCase(myString); // Not OK —— 传入非字符串会触发类型错误 // ts-expect-error kebabCase(); // ts-expect-error kebabCase(0); // ts-expect-error kebabCase([]); // ts-expect-error kebabCase({}); // ts-expect-error kebabCase(/nope/); // ts-expect-error kebabCase(false);从源码结构看kebabCase对非法参数没有任何运行时保护会直接调用str.replace而抛错这与 TRADEOFFS.md 中 a. Just expects correct argument type, Lodash coerces arguments to expected type 的描述一致Just 期望调用者传入正确类型不做参数强转。这一点既是设计选择也是与 Lodash 的关键差异。四、转换原理源码逐段拆解实现位于 index.cjsESM 版本 index.mjs 内容与之完全一致全部逻辑只有约 20 行、三个正则、一个函数无任何依赖。4.1 三个核心正则// 任意组合的空格与标点字符 var wordSeparators /[\s\u2000-\u206F\u2E00-\u2E7F\\!#$%()*,\-.\/:;?\[\]^_{|}~]/; var capital_plus_lower /[A-ZÀ-Ý\u00C0-\u00D6\u00D9-\u00DD][a-zà-ÿ]/g; var capitals /[A-ZÀ-Ý\u00C0-\u00D6\u00D9-\u00DD]/g;wordSeparators定义词分隔符。除了常见空白符\s和标点还覆盖了两个 Unicode 区块\u2000-\u206F一般标点区General Punctuation与\u2E00-\u2E7F补充标点区Supplemental Punctuation确保西文标点体系中的破折号、引号等也能被正确识别。该正则在代码注释中注明参考自 Stack Overflowa/25575009并被just-camel-case、just-snake-case、just-pascal-case等兄弟模块复用。capital_plus_lower匹配一个大写字母紧跟一个小写字母用于识别camelCase 的词边界例如Quick中的Q同时支持带变音符的拉丁大写字母À-Ý、\u00C0-\u00D6、\u00D9-\u00DD与对应小写a-zà-ÿ。capitals匹配连续大写字母串如QUICK、FOX用于识别全大写词或缩写。4.2 两阶段分词function kebabCase(str) { // 阶段1把大写小写的词首替换为空格 小写形式 str str.replace(capital_plus_lower, function(match) { return (match[0].toLowerCase() || match[0]) match[1]; }); // 阶段2把剩余的连续大写整体替换为空格 小写形式 str str.replace(capitals, function(match) { return match.toLowerCase(); }); return str .trim() .split(wordSeparators) .join(-) .replace(/^-/, ) .replace(/-\s*$/, ); }处理流程如下大写边界分词第一步把theQuickBrownFox变为the Quick Brown Fox每个大写词首前插入空格并转小写第二步把仍残留的大写串如FOX、QUICK整体拆分并转小写theQUICKBrownFox因此变成the QUICK Brown Fox随后逐字母小写化得到the q u i c k brown fox——这就是连续大写逐字拆开现象的来源。规范化拼接trim()去掉首尾空白后用split(wordSeparators)按任意长度组合的分隔符切词再用join(-)以连字符连接。首尾连字符清理最后两步replace(/^-/, )与replace(/-\s*$/, )分别删除开头的连字符和结尾的连字符及其前的空白保证输出不以-开头或结尾。这正是 CHANGELOG 中4.0.2 No leading or trailing hyphens修复所对应的实现详见第六节。五、边界行为验证测试用例怎么说仓库为每个包维护独立的 tape 测试运行框架封装见 test/util/test.js为每个模块名自动加[module]前缀。just-kebab-case的测试位于 test/string-kebab-case/index.cjs覆盖了五类典型场景1. 空格分隔string with spacest.equal(kebabCase(the quick brown fox), the-quick-brown-fox); t.equal(kebabCase(the quick brownfox), the-quick-brownfox);多个连续空格会被压缩为一个连字符无大小写信息的纯小写串brownfox不会被强行拆分。2. 标点分隔string with punctuationt.equal(kebabCase(the_quick_brown_fox), the-quick-brown-fox); t.equal(kebabCase(the*quick-brown_fox), the-quick-brown-fox); t.equal(kebabCase(the****quick-_-brown_:fox), the-quick-brown-fox);下划线、星号、连字符混用时任意组合的标点都被视为同一分隔符输出完全一致。3. 空格与标点混合string with mixed spaces and punctuationt.equal(kebabCase(the_quick_brown_ fox), the-quick-brown-fox); t.equal(kebabCase(the** **quick-_-brown_:fox), the-quick-brown-fox);4. 首尾标点string with leading or trailing punctuation——对应 4.0.2 修复t.equal(kebabCase(*Rank Ordinal*), rank-ordinal); t.equal(kebabCase(Rank (Ordinal)), rank-ordinal);首尾的*、括号等标点会被完整剔除不会在输出两端留下裸连字符。5. 大小写组合与 Unicodestring with capitalizationt.equal(kebabCase(theQuickBrownFox), the-quick-brown-fox); t.equal(kebabCase(The quick brown FOX), the-quick-brown-fox); t.equal(kebabCase(MapGLBeta), map-gl-beta); t.equal(kebabCase(MapGL-_-Beta), map-gl-beta); t.equal(kebabCase(ABCHaček Kroužek), abc-haček-kroužek); t.equal(kebabCase(Bonjour XYZÉtienne-Louis Boullée), bonjour-xyz-étienne-louis-boullée);最后两个用例验证了带变音符的拉丁字符处理Hačekč、Kroužekž、ÉtienneÉ、Boulléeé都能被正确识别并保留变音MapGLBeta正确产出map-gl-betaGL连写缩写被整体小写后作为一个词。这正是capital_plus_lower与capitals两个正则协同工作的结果。六、版本演进从 4.0.2 到 4.2.0 的工程化历程关联文档 packages/string-kebab-case/CHANGELOG.md 记录了该包近期的全部发布历史这些变更揭示了一个函数逻辑稳定、工程形态持续演进的过程版本变更类型内容4.2.0Minor ChangesRename node module.js-.cjs4.1.1Patch Changesfix: reorder exports to set default last #4884.1.0Minor Changespackage.json updates to fix #467 and #4834.0.3Patch ChangesKeep ESMs in sync with commonJS modules4.0.2Patch ChangesNo leading or trailing hyphens逐条解读其工程含义4.0.2功能修复修复了首尾出现多余连字符的问题对应 index.cjs 中最后的两个replace(/^-/, )与replace(/-\s*$/, )以及测试中*Rank Ordinal*、Rank (Ordinal)两个用例。4.0.3双模块同步保证 ESM 与 CJS 两份产物逻辑一致。仓库通过 Rollup 构建生成 ESM每个包目录下的 rollup.config.js 调用共享配置 config/createRollupConfig.js后者以index.cjs为输入、rollup/plugin-commonjs为插件、输出index.mjsESM 格式。因此 index.mjs 与 index.cjs 内容严格一致——Keep ESMs in sync with commonJS modules。4.1.0package.json 元数据修复修复 issue #467、#483 相关的包元数据问题exports 字段、types 指向等。当前 package.json 中可见最终形态type: moduleexports按types→requireindex.cjs→importindex.mjs的顺序声明同时保留main/types顶层字段以兼容旧工具链。4.1.1导出顺序修复issue #488调整 exports 顺序把default导出放到最后。结合 4.1.0 的 exports 声明顺序最终require与import都能正确命中各自格式的入口文件。4.2.0CJS 扩展名规范化将 CommonJS 入口从.js重命名为.cjs。在此之前仓库根目录 package.json 的main: index.cjs说明这是全局一致的规范动作——所有 Just 包统一采用index.cjsCJSindex.mjsESMindex.d.ts类型声明三件套从而无需转译即可同时支持 Node 的require与浏览器/打包器的import参见根 README.md-的说明。值得说明的是所有变更日志由 Changesets 工作流驱动配置见 .changeset/config.json仓库采用 lerna.json 中的independent独立版本模式因此每个包的版本各自演进CHANGELOG 按 minor/patch 分类记录。七、与同族字符串工具的关系just-kebab-case不是孤立的Just 库的 Strings 家族包含 string-camel-case、string-snake-case、string-pascal-case 等模块它们共享同一份wordSeparators分隔符正则但词边界策略各有差异camelCasestring-camel-case/index.mjs按分隔符切词后从第二个词开始首字母大写并内置basicCamelRegEx、fourOrMoreConsecutiveCapsRegEx、allCapsRegEx三个正则处理已有 camelCase 输入与连续大写snakeCasestring-snake-case/index.mjs仅用一个capitals正则把每个大写字母含变音区\u00C0-\u00D6、\u00D9-\u00DD替换为空格小写再以_连接pascalCasestring-pascal-case/index.mjs直接按分隔符切词并逐词首字母大写kebabCase本文主角采用capital_plus_lower先处理词首、capitals再处理连续大写的两阶段策略最后用-连接。对于同一输入theQUICKBrownFox四者的产出分别是theQUICKBrownFoxcamelCase 会尽量保持原有 camel 形态以外的处理逻辑不同、the_q_u_i_c_k_brown_foxsnakeCase 逐字母拆、theQUICKBrownFoxpascalCase 不拆连续大写与the-q-u-i-c-k-brown-foxkebabCase 逐字母拆。如果你需要_连接的风格直接选用 string-snake-case 即可二者体积相当TRADEOFFS.md 显示均约 149b。八、总结just-kebab-case以约 20 行零依赖代码实现了对空格、标点、camelCase 边界、连续大写缩写与 Unicode 变音字符的完整 kebab-case 规范化并通过独立的 tape 测试test/string-kebab-case/index.cjs与 TypeScript 类型测试index.tests.ts双重保障质量。其 CHANGELOGpackages/string-kebab-case/CHANGELOG.md记录了一次功能修复4.0.2 首尾连字符与多次工程形态演进4.0.3 ESM 同步、4.1.x 包元数据与导出顺序、4.2.0 CJS 扩展名规范化体现了函数稳定、工程打磨的发布哲学。适用建议当你的项目对包体积敏感如 PWA、移动端、需要 ESM/CJS 双格式免转译引入、且接受调用者自行保证传入字符串的类型约定时just-kebab-case是理想的轻量选择若需要 Lodash 式的参数强转或更多内置边界处理则可按 TRADEOFFS.md 的对照表自行权衡。赞分享开发工具【免费下载链接】justA library of dependency-free JavaScript utilities that do just one thing.项目地址https://gitcode.com/gh_mirrors/jus/just点击查看免费下载相关推荐just-camel-case 使用指南零依赖的字符串转驼峰命名工具just camel case 使用指南零依赖的字符串转驼峰命名工具 导读 just camel case 是 just 工具库中专注于字符串转换的独立 np开发工具go-strcase 字符串命名转换指南CamelCase、snake_case 与 kebab-case 的源码级解析与 KubeSphere 实战go strcase 字符串命名转换指南CamelCase、snake_case 与 kebab case 的源码级解析与 KubeSphere 实战 导读后端云原生容器编排微服务JavaScript 数组方法实战用 split·map·join 实现 camelize将 Kebab-case 转换为 camelCaseJavaScript 数组方法实战用 split·map·join 实现 camelize将 Kebab case 转换为 camelCase 本篇文章围绕文档教程上一篇Simplefolio无障碍屏幕阅读器兼容性终极指南下一篇深入理解 nvim-treesitter-context 插件代码上下文可视化利器创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考