ARTICLE DETAIL

资讯详情

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

freeCodeCamp 每日编程挑战 15:toCamelCase 驼峰转换的题目拆解与源码级解析

freeCodeCamp 每日编程挑战 15:toCamelCase 驼峰转换的题目拆解与源码级解析 freeCodeCamp 每日编程挑战 15toCamelCase 驼峰转换的题目拆解与源码级解析【免费下载链接】freeCodeCampfreeCodeCamp.orgs open-source codebase and curriculum. Learn math, programming, and computer science for free.项目地址: https://gitcode.com/GitHub_Trending/fr/freeCodeCamp本文围绕 freeCodeCamp 课程库中 JavaScript 每日编程挑战Daily Coding Challenges的第 15 题——字符串驼峰命名转换camelCase展开完整继承原题目的规格说明与全部官方测试用例并基于课程块配置、挑战类型定义等仓库源码讲解该题在平台中的组织方式、官方解法的每一步原理以及实现时需要规避的典型陷阱。读完本文你将能够独立实现一个能处理连续分隔符、大小写混杂输入的toCamelCase函数并理解它在 freeCodeCamp 课程体系中的定位。题目背景这道题在课程体系中的位置该题位于课程块daily-coding-challenges-javascript中源文件为 Challenge 15: camelCase其 Front Matter 中的关键元数据为id: 6821ebd4237de8297eaee791 title: Challenge 15: camelCase challengeType: 28 dashedName: challenge-15challengeType: 28对应每日编程挑战中的 JavaScript 类型。这一点可以从共享包的挑战类型定义中得到印证在 challenge-types.ts 中dailyChallengeJs的编号正是 28dailyChallengePy为 29并由此派生了以下工具函数getIsDailyCodingChallenge(challengeType)判断某个挑战类型是否属于每日编程挑战仅dailyChallengeJs与dailyChallengePy两种getDailyCodingChallengeLanguage(challengeType)把挑战类型映射为语言标识本题即映射为javascript在「测试代码存放位置」的映射表中dailyChallengeJs指向tests即题目内置的断言测试就是判分依据。从课程块的结构文件 daily-coding-challenges-javascript.json 还可以看到该块的运行特征challengeOrder中 Challenge 15 恰好排在 Challenge 14: Character Battle 与 Challenge 16: Reverse Parenthesis 之间整块包含 200 道以上的挑战usesMultifileEditor: true编辑器支持多文件blockLayout: legacy-challenge-list以传统列表形式浏览题目helpCategory: JavaScript帮助分类归属 JavaScript。在平台的运行链路上这类题目由 tools/daily-challenges 提供的 seed 脚本从 Dev Playground 超块读取挑战并写入数据库的DailyCodingChallenges集合前端展示侧由 api/src/daily-coding-challenge 下的路由提供每日挑战的查询接口而挑战的提交判分仍走主 API。简言之本文的这道题是一道典型的「断言驱动」编程题通过仓库内嵌的assert测试即可完整验证你的实现。题目规格四条转换规则原题给出的任务描述是给定一个字符串按以下规则返回它的驼峰命名camel case版本单词之间的分隔符是空格、短横线-、下划线_三类字符连续的任意多个分隔符都视为一个单词边界Treat any sequence of these as a word break第一个单词整体转为小写其后每个单词首字母大写、其余字母小写所有空格和分隔符都要被移除。这四条规则里最容易被忽略的是第 1 条分隔符不是「单个字符」而是「一个序列」。比如输入peg__leg----and__、----各自只算一个边界不能把连续的-当作多个单词之间的额外空词处理——否则 join 之后会产生多余的字母或大小写异常。官方测试用例判分依据原题目共给出 5 组断言用例覆盖了从简单到复杂的典型输入这也是本仓库对该题判分的完整依据# --hints--段// 基础用例单个空格分隔 assert.equal(toCamelCase(hello world), helloWorld); // 大小写规整全大写输入需先统一小写再按规则转换 assert.equal(toCamelCase(HELLO WORLD), helloWorld); // 混合分隔符空格与短横线并存 assert.equal(toCamelCase(secret agent-X), secretAgentX); // 大小写混杂中间词部分小写 assert.equal(toCamelCase(FREE cODE cAMP), freeCodeCamp); // 压力用例连续分隔符__、-、----、_ _ 等混合出现 assert.equal( toCamelCase( ye old-_-sea faring_buccaneer_-_with a - peg__leg----and a_parrot_ _named- _squawk ), yeOldSeaFaringBuccaneerWithAPegLegAndAParrotNamedSquawk );最后一组是最关键的边界用例_ _下划线空格下划线这种「跨类型连续分隔符」必须折叠为一个边界a - peg__leg中间夹着空格的孤立-也要正确归位。若实现只对单一字符分隔如直接split( )或逐字符判断此用例必然失败。题目的种子代码# --seed--段是一个待实现的空壳function toCamelCase(s) { return s; }官方解法逐行解析原题目附带的参考实现# --solutions--段如下function toCamelCase(s) { const words s.replace(/[_\- ]/g, ).split( ); return words.map((word, i) { if (i 0) { return word.toLowerCase(); } else { const tempWord word.split(); return tempWord.shift().toUpperCase() tempWord.join().toLowerCase(); } }).join() }可以把它拆解为三个阶段阶段一分隔符归一化。s.replace(/[_\- ]/g, )用一个正则把「一个或多个空格/短横线/下划线」统一替换为单个空格。正则[_\- ]中字符类[_\- ]同时收录空格、-在字符类内\-\为防御性转义、_量词落实了题目第 1 条规则——任意长度的分隔符序列只算一个边界全局标志g保证整串所有边界都被替换而不是只处理第一个。归一化之后字符串里只剩下「单词 单个空格」两种成分split( )就能安全地切出单词数组。由于压力用例中没有前导/尾部分隔符words中不会出现空串元素。阶段二逐词大小写规整。words.map((word, i) ...)利用索引区分首词与其余词i 0时直接word.toLowerCase()对应规则 2其余词用word.split()拆成字符数组shift()取出首字符并toUpperCase()剩余字符join()后toLowerCase()再拼接——对应规则 3。这里shift()的妙处在于首字符不参与「其余转小写」的逻辑避免大小写处理重复或遗漏。阶段三拼接。join()以空字符串连接所有词分隔符在阶段一已经被替换掉因此天然满足规则 4。实现要点与常见错误结合仓库内的测试用例与解法实现时值得注意的要点有先归一化、再拆分。如果直接split单个字符例如split(/[_\- ]/)连续分隔符会产生空串元素首词判断i 0之后还会把空串当作「后续单词」处理导致输出多出一个被大写的空串或大小写错位。大小写处理要覆盖整词而非首字符之外的一小部分。FREE cODE cAMP这类输入中后续词的首字母可能本身已是小写cODE因此必须shift()后toUpperCase()而不能假设首字母已是小写。首词也要完整小写。HELLO WORLD中首词全大写仅处理首字母大写/小写都不够必须对整个首词调用toLowerCase()。等价写法也可以用s.match(/[^_\- ]/g)直接提取出「非分隔符」的单词序列跳过显式 replace但仓库给出的官方解法以 replace split 为主干语义上与题目「一个序列 一个边界」的表述逐字对应可读性更贴近题面规则。在仓库中复核本题如果你在本仓库中查看或复核这道题推荐的路径是阅读题目原文与全部用例curriculum/challenges/english/blocks/daily-coding-challenges-javascript/6821ebd4237de8297eaee791.md确认它在课程块中的排序与编辑器配置curriculum/structure/blocks/daily-coding-challenges-javascript.json确认challengeType: 28的语义每日 JavaScript 挑战、语言映射、测试位置packages/shared/src/config/challenge-types.ts了解每日挑战数据如何进入平台tools/daily-challenges 的 seed 脚本说明以及 api/src/daily-coding-challenge 中的查询路由说明。把本文的解法粘贴进任意 Node 环境运行题目中给出的 5 条assert.equal断言即可完整验证实现——这组断言同时也是该题在 freeCodeCamp 平台上的判分测试。【免费下载链接】freeCodeCampfreeCodeCamp.orgs open-source codebase and curriculum. Learn math, programming, and computer science for free.项目地址: https://gitcode.com/GitHub_Trending/fr/freeCodeCamp创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表