# JavaScript 語法筆記:顛倒字串 split()、reverse()、join() 一開始學習 JavaScript 的語法時,總會不知道要在什麼情況下使用。在課程中雖然都懂得如何運用,但如果沒有真正融會貫通,下次碰到題目時也不知道原來有這些方法可以用。這次藉由「顛倒字串」這個題目,也就是當我輸入 "Apple" 時,電腦要回應我 "elppA" ,來加強之前學到的陣列及字串處理語法。這邊介紹可以達成這道題目的兩種方法: ## 1. 使用 split()、reverse()、join() 首先,先來認識這些語法的使用方式。每一個語法名稱的第一個單字代表他是處理什麼的意思。String 就是處理字串的語法;而 Array 就是處理陣列的語法。使用上要注意不要將用在陣列的語法放到字串上囉! ### String.prototype.split() split() 可以**將字串轉為陣列**,在 () 中以一個指定的分割方式來決定分割的位置。例如,在括號的引號 '' 中沒有輸入任何字符(包括空格),就會以「每一個字串每一個字串」的**陣列**回傳。 ```javascript= const splitted = "Apple is very delicious".split('') console.log(splitted) // [ 'A', 'p', 'p', 'l', 'e', ' ', 'i', 's', ' ', 'v', 'e', 'r', 'y', ' ', 'd', 'e', 'l', 'i', 'c', 'i', 'o', 'u', 's' ] ``` 那如果在引號中加入空格呢? ```javascript= const splitted = "Apple is very delicious".split(' ') console.log(splitted) // [ 'Apple', 'is', 'very', 'delicious' ] ``` 神奇的事發生了!JavaScript 引擎會幫我們用空格來當分割點,回傳給我們一個一個的單字**陣列**。 ### Array.prototype.reverse() 顧名思義就是將**陣列反轉,最後一個元素變成第一個**。讓我們用剛剛的例子來看看: ```javascript= const splitted = "Apple is very delicious".split(' ').reverse() console.log(splitted) // [ 'delicious', 'very', 'is', 'Apple' ] ``` 如果只有一個單字的時候,記得在 split('') 的引號中不要放入空格喔,這樣才能將每一個字母倒轉。 ```javascript= const splitted = "Apple".split('').reverse() console.log(splitted) // [ 'e', 'l', 'p', 'p', 'A' ] ``` 是不是越來越接近我們要的感覺了? ### Array.prototype.join() 與 split() 相反,join() 能將**陣列轉成字串**。而括號內的規則也是相同的。來看看例子吧: ```javascript= const splitted = "Apple".split('').reverse().join('') console.log(splitted) // elppA ``` 我們成功完成題目了,把它寫成一個可以一直使用的函式吧。 ```javascript= function reverseString(str) { return str.split('').reverse().join('') } ``` 句子也可以使用喔,自己試試看吧! ## 2. 使用 for 迴圈 第二種方式就簡單多了,用 for 迴圈讓它倒著跑回去就可以。 ```javascript= function reverseString(str) { let reversed = '' for (let i = str.length -1; i >= 0; i--){ reversed += str[i] } return reversed } ``` ## 結語 一道看起來不怎麼起眼的題目也可以學到很多,尤其是陣列與字串互相轉換的語法在實作上會滿常使用到的。至於把字串顛倒要用在什麼情況呢?總會有那個時候的吧😂