--- tags: JS 直播班 - 2023 秋季班 --- >若有任何疑問請至 Discord「作業討論」頻道討論 # 字串處理 ## 本章節我們要學什麼？ 學習練習基礎常見的字串處理方法。 ### 提示 如沒有概念可以引用哪些方法來達成這次題目的目的，可以試試看…… 1. 閱讀、搜尋文檔：[JavaScript 字符串方法](https://www.w3school.com.cn/js/js_string_methods.asp)、[Mozilla MDN String](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/String)。 2. 在本文件最下方參考同學們的解答。 ### 題目一：字串取長度 ``` =JavaScrip // input 輸入 checkStringLength("Hello") checkStringLength("my name is Tom！") // output 輸出 5 15 ``` ### 題目二：字串大小寫互換 ``` =JavaScript // input 輸入 lowerCase("FOKFF@gmail.com") upperCase("hello, world") // output 輸出 "fokff@gmail.com" "HELLO, WORLD" ``` ### 題目三：字串去左右空白 ``` =JavaScript // input 輸入 trimString(" hi, mom! ") trimString(" aa@gmail.com ") // output 輸出 "hi, mom!" "aa@gmail.com" ``` ### 題目四：字串去任何空白 ``` =JavaScript // input 輸入 removeAllSpaceString("Hello World") removeAllSpaceString("你好 美麗的 世界") // output 輸出 "HelloWorld" "你好美麗的世界" ``` ### 題目五：字串陣列互換 ``` =JavaScript // input 輸入 stringArraySwitcher(['A', 'B', 'C']) stringArraySwitcher('1,2,3') // output 輸出 A,B,C [1,2,3] ``` ### 題目六：字串切割 ``` =JavaScript // input 輸入 getArea("高雄市前鎮區一心二路33號"); getArea("高雄市新興區新興路66號"); // output 輸出 "前鎮區" "新興區" ``` ### 題目七：字串黏合 ``` =JavaScript // input 輸入 concatString("我今天想來點", "六角冰咖啡") // output 輸出 "我今天想來點六角冰咖啡" ``` ### 題目八：顯示字串 請嘗試修改以下代碼，使其可正確運行 (留意單、雙引號)。 關鍵字：單引號、雙引號、反引號、樣板字串。 ``` =JavaScript // To be edit 需修改代碼 console.log("'字串'是 JavaScript 中一種基礎且重要的"型別"，必須好好學習。") // output 輸出 '字串'是 JavaScript 中一種基礎且重要的"型別"，必須好好學習。 ``` ### 題目九：擷取字串內容 創造一個函式用於擷取輸入字串的指定索引字元，如找不到，回傳 false 。 ``` =JavaScript // input 輸入 const input = "Hello" getCharacter(input, 1) getCharacter(input, 3) getCharacter(input, 10) // output 輸出 "H" "l" false ``` ### 題目十：反轉字串 創造一個函式用於反轉字串內文字的順序。 ``` =JavaScript // input 輸入 stringReverser("hello") // output 輸出 olleh ``` ## 回報流程 1. 將答案貼在 Codepen 並複製 Codepen 連結貼至「回報區」回報 ![](https://i.imgur.com/vftL5i0.png) <!-- 解答： https://codepen.io/jmimiding4104/pen/XWoVmqq 這邊解答可能不都是最佳的解法， 適合初學者或者該題突然卡住者， 內容程式碼有針對內容進一步註解可供參考。 --> ## 作業提交等級 * LV1：解出 10 題，並提交 Codepen * LV2：設計一個 hackmd，嘗試自己設計 10 題 * LV3：嘗試去做其他學生寫的題目，並 tag 學員回報給他，感謝他的命題，讓自己觀念更好 回報區 --- <!-- 參考答案： https://codepen.io/jmimiding4104/pen/XWoVmqq?editors=1012 答案僅供參考， 答案會使用各種方式書寫(非最佳化)並加上部分解說， 適合初學者還不太會解題或者是該題卡住的同學。 --> | Discord | LV1 答案 |LV2 自行設計題目 | LV3 做其他學員設計的題目 | |:-------:|:-------:|:-------------:|:---------------------:| | ShangChu | [Codepen](https://codepen.io/shangchu0412/pen/JjwqBYd?editors=0011) ||| | 阿榮 |[Codepen](https://codepen.io/codeitaday/pen/RwEmJzo?editors=0011)||| | 詹姆士 |[Codepen](https://codepen.io/z111048/pen/YzdbjQV)||| | xiaokui_71292 |[Codepen](https://codepen.io/pen?template=LYMoBJW)||| | tanuki5863 | [CodePen](https://codepen.io/tanuki320/pen/RwEmBVZ?editors=0011) ||| | Ching | [CodePen](https://codepen.io/tzuchingg/pen/LYMoBXy?editors=0012) |[HackMD](https://hackmd.io/3rjm4iDGQ5SX81UnVxRGyA?view)|| | Fabio20 | [CodePen]([網址](https://codepen.io/fabio7621/pen/rNogrxE)) ||| | 精靈 | [CodePen](https://codepen.io/justafairy/pen/poqmZZX?editors=0012) ||| | Leo | [CodePen](https://codepen.io/Aruminiya/pen/dywEjdW) ||| | Alyce | [CodePen](https://codepen.io/alycehwy/pen/yLGWxbO?editors=0010) ||| | yuan! | [CodePen](https://codepen.io/townyuan/pen/KKbLBQY) ||| | 楓仔 | [CodePen](https://codepen.io/maplestartend/pen/mdaYGLo?editors=0012) ||| | PayRoom |[CodePen](https://codepen.io/water38198/pen/QWzobVY)||| |Moreene|[CodePen](https://codepen.io/Moreene/pen/dywEqEa)| |runweiting|[CodePen](https://codepen.io/weiting14/pen/dywEKxG)| |pinyi_9|[CodePen](https://codepen.io/Wpypy/pen/dywEjYX?editors=1111)| |Winnie|[CodePen](https://codepen.io/codepen-io-winnie/pen/JjwqBxW?editors=0011)| |保羅|[CodePen](https://codepen.io/paul-1997/pen/ZEVNwxj?editors=0011)| |Ataraxia|[CodePen](https://codepen.io/ataraxia8888/pen/wvRbNyJ)| | ann6212 | [CodePen]([網址](https://codepen.io/yqmegupa-the-styleful/pen/PoXvVdW?editors=1012)) ||| | santu0868 | [CodePen](https://codepen.io/HatsumiSan/pen/VwqOEKJ?editors=1111)||| | SHUO| [CodePen](https://codepen.io/xrzarxkl-the-reactor/pen/XWowowV?editors=1111) ||| | jiayu | [CodePen](https://codepen.io/fjqxaznl-the-reactor/pen/LYMoKPV?editors=0011) ||| | Chia Pin | [CodePen](https://codepen.io/joker-cat/pen/oNJRrBL) | | Celine 510 | [CodePen](https://codepen.io/Celine-510/pen/xxmNoWV?editors=1010) ||| | Jun_ | [CodePen](https://codepen.io/Jun-L/pen/JjwqVQB) ||| | kuanju27 | [CodePen](https://codepen.io/Eero-Chiao/pen/NWeVZee) ||| | 銀光菇 |[CodePen](https://codepen.io/genesynthesis/pen/XWowvWK)| | MY |[CodePen](https://codepen.io/ahmomoz/pen/VwqOOOe) | smalljie | [CodePen](https://codepen.io/smalljie/pen/bGOyPQQ) ||| | shiro | [CodePen](https://codepen.io/chenghsienwang/pen/eYbwYpX) ||| | gebyman | [CodePen](https://codepen.io/gebyman/pen/JjwQjNY?editors=0011) ||| | MDFK | [CodePen](https://codepen.io/maywang/pen/XWowYPO?editors=0012) |[HackMD](https://hackmd.io/@gpwzoBhzQVK9uS394vzV_Q/B1Qguuj-p)|[感謝Ching出題](https://codepen.io/maywang/pen/dywBJyz)| | ming0712 | [CodePen](https://codepen.io/StevenHuang/pen/MWZdzgZ?editors=0011) ||| | hsu0921 | [CodePen](https://codepen.io/HSUANIN0327/pen/ExGzGqL) ||| | 小廷 | [CodePen](https://codepen.io/uyxkiake-the-selector/pen/xxmoqwq?editors=1011) ||| | Peng | [CodePen](https://codepen.io/H-Peng/pen/oNJrBMB?editors=0010) ||感謝Ching出題 [CodePen](https://codepen.io/H-Peng/pen/eYbqOZE?editors=0010)| | Dora | [CodePen](https://codepen.io/dorayu/pen/KKbLjOO?editors=1011) ||| | RX00 | [CodePen](https://codepen.io/llqzknqv-the-styleful/pen/vYvqyvN?editors=0011) ||| | shcopy | [CodePen]([網址](https://codepen.io/shcopy/pen/GRPbrNm)) ||| | 蛋塔 | [CodePen](https://codepen.io/Hong-Game1/pen/XWoLadK) ||| | MKL | [CodePen](https://codepen.io/Code-My/pen/BaveMdQ) ||| | phyllis_0802 | [CodePen](https://codepen.io/Phyllis-Cheng/pen/wvRLgop) ||| | 奔跑吧(GTR150) | [CodePen](https://codepen.io/Wer-Qwe/pen/NWeVJRz?editors=1111) ||| | 依依 | [CodePen](https://codepen.io/Rita-Yang/pen/MWZdPOG) ||| | Peggy | [CodePen](https://codepen.io/peggylai/pen/yLGdoYL?editors=1011) ||| | Aritan | [CodePen](https://codepen.io/Aritan/pen/poqMjBY) ||| | ⭐️小正 | [CodePen](https://codepen.io/colorgolden/pen/jOXoRBE) ||| | jslong | [CodePen](https://codepen.io/Emillo/pen/eYbwrxv?editors=0011) ||| | nini1202desu | [CodePen](https://codepen.io/tvxq5206/pen/XWowPpM?editors=0011) ||| | yaoling.liang |[CodePen](https://codepen.io/Yao-Ling-L-/pen/eYbqNBG?editors=1111)||| | zona |[CodePen](https://codepen.io/w242920/pen/gOZVQmL?editors=1111)||| | noah |[CodePen](https://codepen.io/lch1222/pen/zYyVaLm?editors=0010)||| | minnielin | [CodePen]([網址](https://codepen.io/ShengXin-Lin/pen/yLGmXZZ)) ||| | Ivan | [CodePen](https://codepen.io/swalok/pen/xxMKKey?editors=0012) ||| | xin | [CodePen](https://codepen.io/Estherrrrrr999/pen/qBLzmyG) ||| | 小夏 | [CodePen](https://codepen.io/michaelhsia/pen/Rwvbpbp) ||| | Oria | [CodePen](https://codepen.io/kajing/pen/MWLgEXm?editors=0011) ||| | ss585801 | [CodePen](https://codepen.io/ss585801/pen/zYeOYze?editors=0012) ||| | Suzi | [CodePen](https://codepen.io/midomommy/pen/abXoEgJ?editors=0012) ||| | Uli | [CodePen](https://codepen.io/uli1313/pen/NWoKQqY?editors=0011) ||| | Eden | [Codepen](https://codepen.io/iseden/pen/poGzMrG)||| | shuuu | [Codepen](https://codepen.io/afjrvjzl-the-bashful/pen/NWeZXqJ)||| | JasonFu | [Codepen](https://codepen.io/jie-Fu/pen/NWeQBqj)||| |celinelinnn|[CodePen](https://codepen.io/celinephoebe/pen/PoVYXXB)| | 白夜 | [CodePen](https://codepen.io/Wei903/pen/abPeQEg?editors=1112) | Zhu | [CodePen](https://codepen.io/codepenplayer/pen/OJdJPOv) | Tina02 | [CodePen](https://codepen.io/chjitlox-the-bashful/pen/abPezyp) | | yu.t_liu | [CodePen](https://codepen.io/YuT200053/pen/dyabYzy?editors=0011) | | 郭芙蘭#6374 | [CodePen](https://codepen.io/flora_Kuo/pen/ZEwEKJO?editors=1011) | | LinaChen | [CodePen](https://codepen.io/LinaChen/pen/GRzRmxz) | | skylaaaa | [CodePen](https://codepen.io/chihyu2790/pen/qBgBPWr) | | Ivy | [CodePen](https://codepen.io/Irene-Ke/pen/poGoPRv?editors=0010) | | Yijing | [CodePen](https://codepen.io/Yi-Jing-71080635/pen/WNPNYgj) ||| | Kouta | [CodePen](https://codepen.io/kouta-f2e/pen/BaMyYbE) | | Lainie | [CodePen](https://codepen.io/Lainie88/pen/WNLBKam?editors=0012) | | damon0323 | [CodePen](https://codepen.io/swk9eny2/pen/dyaovEM?editors=0012) | | ricktsaiii | [CodePen](https://codepen.io/ricktsaiii/pen/JjxYdqE) | | Andy | [CodePen](https://codepen.io/andy31342/pen/MWLKZOo?editors=0010) | | yuan2781 | [CodePen](https://codepen.io/ismebir/pen/NWoKwXv) ||| | xuan | [CodePen](https://codepen.io/xuan0915/pen/KKJzOwP?editors=0012) ||| | cest_jessie | [CodePen](https://codepen.io/itsjessiechen/pen/BaMLPEY) ||| | 維哲 | [CodePen](https://codepen.io/kwz1202/pen/PoVjYbO) ||| | yuling | [CodePen](https://codepen.io/igzdflpu/pen/vYbZdPe) ||| | lychee_kk | [CodePen](https://codepen.io/kakakala/pen/ZEwXRJR?editors=1112) ||| | kawa | [CodePen](https://codepen.io/z83xji6/pen/WNPOLer) | | bf_tsai | [CodePen](https://codepen.io/BF-Tsai/pen/mdvGOqW?editors=0011) ||| <!-- 快速複製 | 名稱 | [CodePen](網址) ||| -->