計字符串長度（Find the Length of a String 挑戰(zhàn)拆解）)
freeCodeCamp JavaScript 入門精講用 String.length 統(tǒng)計字符串長度Find the Length of a String 挑戰(zhàn)拆解【免費下載鏈接】freeCodeCampfreeCodeCamp.orgs open-source codebase and curriculum. Learn math, programming, and computer science for free.項目地址: https://gitcode.com/GitHub_Trending/fr/freeCodeCamp本篇圍繞 freeCodeCamp 開源課程 Basic JavaScript 課程塊中的一課——Find the Length of a String展開先講透 JavaScript 字符串長度屬性.length的語法與計數(shù)規(guī)則再逐段拆解這個挑戰(zhàn)文件Markdown 格式的 frontmatter、描述、測試斷言、種子代碼與參考答案讓你既掌握語言知識點也讀懂 freeCodeCamp 挑戰(zhàn)題目challenge的倉庫存儲與自動校驗機(jī)制。1. 這一課講什么、放在哪里Find the Length of a String是 freeCodeCamp 的 JavaScript 基礎(chǔ)課程basic-javascriptblock中的一課用于教會初學(xué)者讀取字符串的長度。挑戰(zhàn)的元數(shù)據(jù)定義在塊結(jié)構(gòu)中位于 curriculum/structure/blocks/basic-javascript.json 的challengeOrder列表里它的前后兩課分別是Appending Variables to Strings56533eb9ac21ba0edf2244ed和Use Bracket Notation to Find the First Character in a Stringbd7123c9c549eddfaeb5bdef。從排序可以看出課程設(shè)計意圖先掌握字符串的聲明、拼接再學(xué)習(xí)以.length獲得長度隨后緊接若干課使用下標(biāo)方括號配合.length定位單個字符由整串過渡到單個字符。該塊在倉庫中的helpCategory被標(biāo)記為JavaScript見塊 JSON 頂部而挑戰(zhàn)正文本體存儲在課程英文源文件中curriculum/challenges/english/blocks/basic-javascript/bd7123c9c448eddfaeb5bdef.md。2. 核心知識點在字符串變量或字符串字面量后寫.length2.1 語法與返回值在 JavaScript 中統(tǒng)計一個字符串包含多少個字符只需要在字符串變量或字符串字面量后面寫.lengthconsole.log(Alan Peter.length);控制臺會輸出數(shù)字10。這里揭示了兩個要點.length是一個屬性property無需調(diào)用括號它的返回值是數(shù)字number類型可以直接參與運算、比較或賦值。2.2 空格也計入長度原文檔特別強(qiáng)調(diào)Alan 與 Peter 之間的那個空格同樣被統(tǒng)計在內(nèi)因此Alan Peter的長度是10而非9。這是初學(xué)者最常踩的誤區(qū)之一——在視覺上一個空格看起來不算字但在字符串內(nèi)部它是實實在在的一個字符code point其 Unicode 碼點是U0020。同理Ada 這類不含空格的字符串const firstName Ada; console.log(firstName.length); // 3文檔中給出的示例是若聲明const firstName Ada則可用firstName.length得知字符串Ada的長度。2.3 為什么它能寫在原始值上字符串屬于 JavaScript 的基本數(shù)據(jù)類型primitive本身并不是對象。但從源碼與語言語義看當(dāng)你對字符串字面量或變量訪問屬性如.length時引擎會把它臨時包裝為String對象從而暴露該屬性——因此在兩種寫法下.length都可用hello.length; // 字符串字面量直接跟 .length → 5 const msg hi; // 賦值給變量后再訪問 msg.length; // 23. 任務(wù)指令instructions解讀--instructions--一節(jié)給出唯一要完成的任務(wù)Use the.lengthproperty to setlastNameLengthto the number of characters inlastName.即不修改變量聲明把lastNameLength賦值為lastName中字符的個數(shù)。本課中的lastName固定為字符串Lovelace——它有8個字符L-o-v-e-l-a-c-e因此最終lastNameLength 8。4. 種子代碼seed與參考答案4.1 初始代碼挑戰(zhàn)的起始狀態(tài)原文檔 的--seed-- / --seed-contents--區(qū)塊如下// Setup let lastNameLength 0; const lastName Lovelace; // Only change code below this line lastNameLength lastName;注意// Setup區(qū)段的兩行是不允許改動的lastNameLength先用let初始化為0lastName用const固定為字符串學(xué)習(xí)者的改動只允許發(fā)生在// Only change code below this line之后。4.2 參考答案let lastNameLength 0; const lastName Lovelace; lastNameLength lastName.length;把lastName換成lastName.length后右側(cè)求值結(jié)果是從8開始的數(shù)字賦給lastNameLength即完成任務(wù)。這里的賦值方向值得初學(xué)者注意等號左側(cè)是目標(biāo)變量右側(cè)是表達(dá)式lastName.length.length返回的字符個數(shù)替換掉了原本錯誤的字符串值。5. 三條測試斷言freeCodeCamp 如何判定通過--hints--區(qū)塊是自動評測的規(guī)則集合本課共有三條斷言見 原文檔逐條拆開可以精確理解判題邏輯斷言 1不允許修改// Setup區(qū)段的變量聲明assert( __helpers.removeJSComments(code).match(/let lastNameLength 0;/) __helpers.removeJSComments(code).match(/const lastName Lovelace;/) );它先用輔助函數(shù)__helpers.removeJSComments(code)把解答中的 JS 注釋剝離再分別用正則匹配let lastNameLength 0;與const lastName Lovelace;確保這兩個初始聲明原樣保留。先去掉注釋再匹配是為了防止學(xué)習(xí)者把被注釋掉的聲明濫竽充數(shù)。斷言 2結(jié)果值必須為 8assert(typeof lastNameLength ! undefined lastNameLength 8);這里同時做了兩道檢查變量必須已定義類型不是undefined且嚴(yán)格等于數(shù)字8。嚴(yán)格相等意味著字符串8之類都無法通過。斷言 3必須通過.length得出結(jié)果禁止硬編碼assert(__helpers.removeJSComments(code).match(/\s*lastName\.length/g) !__helpers.removeJSComments(code).match(/lastName\s*\s*8/));正則\s*lastName\.length要求代碼中出現(xiàn) lastName.length這樣的賦值形態(tài)同時反向匹配lastName\s*\s*8予以否定杜絕把lastName直接改成數(shù)字8的作弊式硬編碼。這正體現(xiàn)了挑戰(zhàn)的教學(xué)目標(biāo)——讓學(xué)習(xí)者真正調(diào)用.length屬性而不是背答案。結(jié)合前文對basic-javascript塊的課程排序本課之后緊接著Use Bracket Notation to Find the First Character等課程來看這一課的.length用法是為后續(xù)用下標(biāo)訪問單個字符、用length - 1取最后一個字符打基礎(chǔ)的。6. 挑戰(zhàn)文件的 frontmatter題目是如何被倉庫解析的每個挑戰(zhàn) markdown 頂部都有以---包裹的 YAML frontmatter用于唯一標(biāo)識與分類。本課的字段如下字段值說明idbd7123c9c448eddfaeb5bdef全倉庫唯一的挑戰(zhàn) ID也是文件名不帶.mdtitleFind the Length of a String面向?qū)W習(xí)者顯示的標(biāo)題challengeType1挑戰(zhàn)類型編號1對應(yīng)JavaScriptforumTopicId18182關(guān)聯(lián)的論壇討論主題編號dashedNamefind-the-length-of-a-stringURL 友好的連字符形式名稱這些字段在倉庫里都有真實的校驗邏輯作支撐例如 curriculum/schema/challenge-schema.js 中規(guī)定challengeType是取值0到33的必填數(shù)字、dashedName必須匹配 slug 正則challengeType: 1的數(shù)字含義定義在共享配置 packages/shared/src/config/challenge-types.ts其中const js 1;并在導(dǎo)出對象中作為challengeTypes.js使用。也就是說本課在評測與渲染體系中被歸入 JavaScript 類型的代碼挑戰(zhàn)。7. 文檔各區(qū)塊section在倉庫約定中的含義沿用 freeCodeCamp 挑戰(zhàn)文件約定本課 markdown 包含以下用# --xxx--標(biāo)記命名的區(qū)塊各區(qū)塊職責(zé)清晰--description--面向?qū)W習(xí)者的概念講解與示例本課介紹了.length的兩種用法并給出Alan Peter.length輸出10的例子--instructions--具體要完成的編碼任務(wù)--hints--評測用的assert規(guī)則見上文第 5 節(jié)--seed-- / --seed-contents--編輯器預(yù)置的起始代碼見上文第 4.1 節(jié)--solutions--參考答案供學(xué)習(xí)者查看解答時使用。8. 同一課程塊里的延伸從長度到第幾個字符理解了.length之后同屬basic-javascript塊的后續(xù)課程會引導(dǎo)你把它與下標(biāo)結(jié)合起來。例如以 Lovelace長度 8為例取第一個字符下標(biāo)從0開始lastName[0]得到L對應(yīng)挑戰(zhàn) bd7123c9c549eddfaeb5bdef.md取最后一個字符最后一個字符的下標(biāo)是length - 1即lastName[lastName.length - 1]得到e。由于長度8、首字符下標(biāo)0最后一個字符下標(biāo)必然是7這正對應(yīng)Use Bracket Notation to Find the Last Character in a String一課bd7123c9c451eddfaeb5bdef.md所演示的firstName[firstName.length - 1]寫法取任意第 N 個字符同樣借助0起始的下標(biāo)定位任意位置bd7123c9c450eddfaeb5bdef.md?？梢?length是字符串下標(biāo)導(dǎo)航的基礎(chǔ)設(shè)施——先知道整體有多長才能知道邊界在哪里。9. 易錯點與自測建議結(jié)合本課內(nèi)容與實際評測規(guī)則練習(xí)時建議自查以下幾點把空格當(dāng)字符 、標(biāo)點等都算一個字符別憑肉眼數(shù)不要把.length寫在錯誤對象上如lastNameLength.length是把數(shù)字當(dāng)字符串結(jié)果會是undefined數(shù)字沒有l(wèi)ength屬性區(qū)分屬性訪問與賦值本課要求的是賦值語句lastNameLength lastName.length;若寫成lastName lastName.length會同時違反不改動 Setup 聲明的約束自測邊界情況空字符串.length為0單個字符a.length為1帶空格的Alan Peter.length為10。想在本倉庫中繼續(xù)研究可對照閱讀挑戰(zhàn)源文件 bd7123c9c448eddfaeb5bdef.md、塊的完整題目排序 curriculum/structure/blocks/basic-javascript.json、frontmatter 與區(qū)塊的 schema 校驗規(guī)則 curriculum/schema/challenge-schema.js以及挑戰(zhàn)類型常量定義 packages/shared/src/config/challenge-types.ts從而把一個字符串知識點還原到課程內(nèi)容如何被組織、校驗與評測的完整鏈路中。【免費下載鏈接】freeCodeCampfreeCodeCamp.orgs open-source codebase and curriculum. Learn math, programming, and computer science for free.項目地址: https://gitcode.com/GitHub_Trending/fr/freeCodeCamp創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考 freeCodeCamp JavaScript 入門精講：用 String.length 統(tǒng)計字符串長度（Find the Length of a String 挑戰(zhàn)拆解）
freeCodeCamp JavaScript 入門精講用 String.length 統(tǒng)計字符串長度Find the Length of a String 挑戰(zhàn)拆解【免費下載鏈接】freeCodeCampfreeCodeCamp.orgs open-source codebase and curriculum. Learn math, programming, and computer science for free.項目地址: https://gitcode.com/GitHub_Trending/fr/freeCodeCamp本篇圍繞 freeCodeCamp 開源課程 Basic JavaScript 課程塊中的一課——Find the Length of a String展開先講透 JavaScript 字符串長度屬性.length的語法與計數(shù)規(guī)則再逐段拆解這個挑戰(zhàn)文件Markdown 格式的 frontmatter、描述、測試斷言、種子代碼與參考答案讓你既掌握語言知識點也讀懂 freeCodeCamp 挑戰(zhàn)題目challenge的倉庫存儲與自動校驗機(jī)制。1. 這一課講什么、放在哪里Find the Length of a String是 freeCodeCamp 的 JavaScript 基礎(chǔ)課程basic-javascriptblock中的一課用于教會初學(xué)者讀取字符串的長度。挑戰(zhàn)的元數(shù)據(jù)定義在塊結(jié)構(gòu)中位于 curriculum/structure/blocks/basic-javascript.json 的challengeOrder列表里它的前后兩課分別是Appending Variables to Strings56533eb9ac21ba0edf2244ed和Use Bracket Notation to Find the First Character in a Stringbd7123c9c549eddfaeb5bdef。從排序可以看出課程設(shè)計意圖先掌握字符串的聲明、拼接再學(xué)習(xí)以.length獲得長度隨后緊接若干課使用下標(biāo)方括號配合.length定位單個字符由整串過渡到單個字符。該塊在倉庫中的helpCategory被標(biāo)記為JavaScript見塊 JSON 頂部而挑戰(zhàn)正文本體存儲在課程英文源文件中curriculum/challenges/english/blocks/basic-javascript/bd7123c9c448eddfaeb5bdef.md。2. 核心知識點在字符串變量或字符串字面量后寫.length2.1 語法與返回值在 JavaScript 中統(tǒng)計一個字符串包含多少個字符只需要在字符串變量或字符串字面量后面寫.lengthconsole.log(Alan Peter.length);控制臺會輸出數(shù)字10。這里揭示了兩個要點.length是一個屬性property無需調(diào)用括號它的返回值是數(shù)字number類型可以直接參與運算、比較或賦值。2.2 空格也計入長度原文檔特別強(qiáng)調(diào)Alan 與 Peter 之間的那個空格同樣被統(tǒng)計在內(nèi)因此Alan Peter的長度是10而非9。這是初學(xué)者最常踩的誤區(qū)之一——在視覺上一個空格看起來不算字但在字符串內(nèi)部它是實實在在的一個字符code point其 Unicode 碼點是U0020。同理Ada 這類不含空格的字符串const firstName Ada; console.log(firstName.length); // 3文檔中給出的示例是若聲明const firstName Ada則可用firstName.length得知字符串Ada的長度。2.3 為什么它能寫在原始值上字符串屬于 JavaScript 的基本數(shù)據(jù)類型primitive本身并不是對象。但從源碼與語言語義看當(dāng)你對字符串字面量或變量訪問屬性如.length時引擎會把它臨時包裝為String對象從而暴露該屬性——因此在兩種寫法下.length都可用hello.length; // 字符串字面量直接跟 .length → 5 const msg hi; // 賦值給變量后再訪問 msg.length; // 23. 任務(wù)指令instructions解讀--instructions--一節(jié)給出唯一要完成的任務(wù)Use the.lengthproperty to setlastNameLengthto the number of characters inlastName.即不修改變量聲明把lastNameLength賦值為lastName中字符的個數(shù)。本課中的lastName固定為字符串Lovelace——它有8個字符L-o-v-e-l-a-c-e因此最終lastNameLength 8。4. 種子代碼seed與參考答案4.1 初始代碼挑戰(zhàn)的起始狀態(tài)原文檔 的--seed-- / --seed-contents--區(qū)塊如下// Setup let lastNameLength 0; const lastName Lovelace; // Only change code below this line lastNameLength lastName;注意// Setup區(qū)段的兩行是不允許改動的lastNameLength先用let初始化為0lastName用const固定為字符串學(xué)習(xí)者的改動只允許發(fā)生在// Only change code below this line之后。4.2 參考答案let lastNameLength 0; const lastName Lovelace; lastNameLength lastName.length;把lastName換成lastName.length后右側(cè)求值結(jié)果是從8開始的數(shù)字賦給lastNameLength即完成任務(wù)。這里的賦值方向值得初學(xué)者注意等號左側(cè)是目標(biāo)變量右側(cè)是表達(dá)式lastName.length.length返回的字符個數(shù)替換掉了原本錯誤的字符串值。5. 三條測試斷言freeCodeCamp 如何判定通過--hints--區(qū)塊是自動評測的規(guī)則集合本課共有三條斷言見 原文檔逐條拆開可以精確理解判題邏輯斷言 1不允許修改// Setup區(qū)段的變量聲明assert( __helpers.removeJSComments(code).match(/let lastNameLength 0;/) __helpers.removeJSComments(code).match(/const lastName Lovelace;/) );它先用輔助函數(shù)__helpers.removeJSComments(code)把解答中的 JS 注釋剝離再分別用正則匹配let lastNameLength 0;與const lastName Lovelace;確保這兩個初始聲明原樣保留。先去掉注釋再匹配是為了防止學(xué)習(xí)者把被注釋掉的聲明濫竽充數(shù)。斷言 2結(jié)果值必須為 8assert(typeof lastNameLength ! undefined lastNameLength 8);這里同時做了兩道檢查變量必須已定義類型不是undefined且嚴(yán)格等于數(shù)字8。嚴(yán)格相等意味著字符串8之類都無法通過。斷言 3必須通過.length得出結(jié)果禁止硬編碼assert(__helpers.removeJSComments(code).match(/\s*lastName\.length/g) !__helpers.removeJSComments(code).match(/lastName\s*\s*8/));正則\s*lastName\.length要求代碼中出現(xiàn) lastName.length這樣的賦值形態(tài)同時反向匹配lastName\s*\s*8予以否定杜絕把lastName直接改成數(shù)字8的作弊式硬編碼。這正體現(xiàn)了挑戰(zhàn)的教學(xué)目標(biāo)——讓學(xué)習(xí)者真正調(diào)用.length屬性而不是背答案。結(jié)合前文對basic-javascript塊的課程排序本課之后緊接著Use Bracket Notation to Find the First Character等課程來看這一課的.length用法是為后續(xù)用下標(biāo)訪問單個字符、用length - 1取最后一個字符打基礎(chǔ)的。6. 挑戰(zhàn)文件的 frontmatter題目是如何被倉庫解析的每個挑戰(zhàn) markdown 頂部都有以---包裹的 YAML frontmatter用于唯一標(biāo)識與分類。本課的字段如下字段值說明idbd7123c9c448eddfaeb5bdef全倉庫唯一的挑戰(zhàn) ID也是文件名不帶.mdtitleFind the Length of a String面向?qū)W習(xí)者顯示的標(biāo)題challengeType1挑戰(zhàn)類型編號1對應(yīng)JavaScriptforumTopicId18182關(guān)聯(lián)的論壇討論主題編號dashedNamefind-the-length-of-a-stringURL 友好的連字符形式名稱這些字段在倉庫里都有真實的校驗邏輯作支撐例如 curriculum/schema/challenge-schema.js 中規(guī)定challengeType是取值0到33的必填數(shù)字、dashedName必須匹配 slug 正則challengeType: 1的數(shù)字含義定義在共享配置 packages/shared/src/config/challenge-types.ts其中const js 1;并在導(dǎo)出對象中作為challengeTypes.js使用。也就是說本課在評測與渲染體系中被歸入 JavaScript 類型的代碼挑戰(zhàn)。7. 文檔各區(qū)塊section在倉庫約定中的含義沿用 freeCodeCamp 挑戰(zhàn)文件約定本課 markdown 包含以下用# --xxx--標(biāo)記命名的區(qū)塊各區(qū)塊職責(zé)清晰--description--面向?qū)W習(xí)者的概念講解與示例本課介紹了.length的兩種用法并給出Alan Peter.length輸出10的例子--instructions--具體要完成的編碼任務(wù)--hints--評測用的assert規(guī)則見上文第 5 節(jié)--seed-- / --seed-contents--編輯器預(yù)置的起始代碼見上文第 4.1 節(jié)--solutions--參考答案供學(xué)習(xí)者查看解答時使用。8. 同一課程塊里的延伸從長度到第幾個字符理解了.length之后同屬basic-javascript塊的后續(xù)課程會引導(dǎo)你把它與下標(biāo)結(jié)合起來。例如以 Lovelace長度 8為例取第一個字符下標(biāo)從0開始lastName[0]得到L對應(yīng)挑戰(zhàn) bd7123c9c549eddfaeb5bdef.md取最后一個字符最后一個字符的下標(biāo)是length - 1即lastName[lastName.length - 1]得到e。由于長度8、首字符下標(biāo)0最后一個字符下標(biāo)必然是7這正對應(yīng)Use Bracket Notation to Find the Last Character in a String一課bd7123c9c451eddfaeb5bdef.md所演示的firstName[firstName.length - 1]寫法取任意第 N 個字符同樣借助0起始的下標(biāo)定位任意位置bd7123c9c450eddfaeb5bdef.md?？梢?length是字符串下標(biāo)導(dǎo)航的基礎(chǔ)設(shè)施——先知道整體有多長才能知道邊界在哪里。9. 易錯點與自測建議結(jié)合本課內(nèi)容與實際評測規(guī)則練習(xí)時建議自查以下幾點把空格當(dāng)字符 、標(biāo)點等都算一個字符別憑肉眼數(shù)不要把.length寫在錯誤對象上如lastNameLength.length是把數(shù)字當(dāng)字符串結(jié)果會是undefined數(shù)字沒有l(wèi)ength屬性區(qū)分屬性訪問與賦值本課要求的是賦值語句lastNameLength lastName.length;若寫成lastName lastName.length會同時違反不改動 Setup 聲明的約束自測邊界情況空字符串.length為0單個字符a.length為1帶空格的Alan Peter.length為10。想在本倉庫中繼續(xù)研究可對照閱讀挑戰(zhàn)源文件 bd7123c9c448eddfaeb5bdef.md、塊的完整題目排序 curriculum/structure/blocks/basic-javascript.json、frontmatter 與區(qū)塊的 schema 校驗規(guī)則 curriculum/schema/challenge-schema.js以及挑戰(zhàn)類型常量定義 packages/shared/src/config/challenge-types.ts從而把一個字符串知識點還原到課程內(nèi)容如何被組織、校驗與評測的完整鏈路中。【免費下載鏈接】freeCodeCampfreeCodeCamp.orgs open-source codebase and curriculum. Learn math, programming, and computer science for free.項目地址: https://gitcode.com/GitHub_Trending/fr/freeCodeCamp創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考