字符串反轉方法匯總

• split()方法將一個字符串對象的每個字符拆出來，並且將每個字符串當成數組的每個元素
• reverse()方法用來改變數組，將數組中的元素倒個序排列，第一個數組元素成為最后一個，最后一個變成第一個
• join()方法將數組中的所有元素邊接成一個字符串

來看個實例：

function reverseString(str) {
    // 第一步，使用split()方法，返回一個新數組
    // var splitString = "hello".split("");

    var splitString = str.split(""); //將字符串拆分

    // 返回一個新數組["h", "e", "l", "l", "o"]

    // 第二步，使用reverse()方法創建一個新數組
    // var reverseArray = ["h", "e", "l", "l", "o"].reverse();

    var reverseArray = splitString.reverse(); 
    // 原數組元素順序反轉["o", "l", "l", "e", "h"]

    // 第三步，使用join()方法將數組的每個元素連接在一起，組合成一個新字符串
    // var joinArray = ["o", "l", "l", "e", "h"].join("");

    var joinArray = reverseArray.join(""); 
    // "olleh"

    // 第四步，返回一個反轉的新字符串
    return joinArray; // "olleh"
}

reverseString("hello"); // => olleh

將上面的方法簡化一下，可以寫成這樣：

function reverseString(str) {
    return str.split("").reverse().join("");
}
reverseString("hello"); // => olleh

使用一個遞減循環遍歷將字符串反轉

這種方法使用的是一個for循環給原字符串做一個遞減遍歷，然后將遍歷的字符串重新合並成一個新字符串：

function reverseString(str) {
    // 第一步：創建一個空的字符串用來存儲新創建的字符串

    var newString = "";

    // 第二步：使用for循環
    // 循環從str.length-1開始做遞減遍歷,直到 i 大於或等於0，循環將繼續
    // str.length - 1對應的就是字符串最后一個字符o

    for (var i = str.length - 1; i >= 0; i--) { 
        newString += str[i]; // 或者 newString = newString + str[i];
    }

    // 第三步：返回反轉的字符串
    return newString; 
}

reverseString('hello'); // => // "olleh"

簡單的看看字符串遍歷的過程。假設需要將字符串"hello"反轉。其整個遍歷過程如下表所示：

迭代順序	對應i的值	新字符串 newString
每次迭代	str.length - 1	newString + str[i]
第一次迭代	5 - 1 = 4	"" + "o" = "o"
第二次迭代	4 - 1 = 3	"o" + "l" = "ol"
第三次迭代	3 - 1 = 2	"ol" + "l" = "oll"
第四次迭代	2 - 1 = 1	"oll" + "e" = "olle"
第五次迭代	1 - 1 = 0	"olle" + "h" = "olleh"

其實上面的for循環，也可以換成while循環：

function reverseString (str) {
    var newString = '';
    var i = str.length;

    while (i > 0) {
        newString += str.substring(i - 1, i);
        i--;
    }

    return newString;
}

reverseString("hello"); // => olleh

在while循環中substring()方法。substring() 返回字符串兩個索引之間（或到字符串末尾）的子串。

使用遞歸實現字符串反向

使用String.prototype.substr()和String.prototype.charAt()方法也可以將一個字符串反向。

substr() 方法返回字符串中從指定位置開始到指定長度的子字符串。比如：

var str = "abcdefghij";

console.log("(1,2): "    + str.substr(1,2));   // (1,2): bc
console.log("(-3,2): "   + str.substr(-3,2));  // (-3,2): hi
console.log("(-3): "     + str.substr(-3));    // (-3): hij
console.log("(1): "      + str.substr(1));     // (1): bcdefghij
console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
console.log("(20, 2): "  + str.substr(20,2));  // (20, 2):

charAt() 方法返回字符串中指定位置的字符。字符串中的字符從左向右索引，第一個字符的索引值為 0，最后一個字符（假設該字符位於字符串 stringName 中）的索引值為 stringName.length - 1。 如果指定的 index 值超出了該范圍，則返回一個空字符串。

var anyString = "Brave new world";
console.log("The character at index 0   is '" + anyString.charAt(0)   + "'"); // =>The character at index 0 is 'B'
console.log("The character at index 1   is '" + anyString.charAt(1)   + "'"); // =>The character at index 1 is 'r'
console.log("The character at index 2   is '" + anyString.charAt(2)   + "'"); // =>The character at index 2 is 'a'
console.log("The character at index 3   is '" + anyString.charAt(3)   + "'"); // => The character at index 3 is 'v'
console.log("The character at index 4   is '" + anyString.charAt(4)   + "'"); // => The character at index 4 is 'e'
console.log("The character at index 999 is '" + anyString.charAt(999) + "'"); // => The character at index 999 is ''

結合起來，我們可以這樣做實現字符串反向：

function reverseString(str) {
    if (str === "") {
        return "";
    } else {
        return reverseString(str.substr(1)) + str.charAt(0);
    }
}
reverseString("hello"); // => olleh

第一部分的遞歸方法。你需要記住，你不會只調用一次，你將會有幾個嵌套的調用。

每次調用str === "?"	reverseString(str.subst(1))	+ str.charAt(0)
第一次調用	reverseString("Hello")	reverseString("ello") + "h"
第二次調用	reverseString("ello")	reverseString("llo") + "e"
第三次調用	reverseString("llo")	reverseString("lo") + "l"
第四次調用	reverseString("lo")	reverseString("o") + "l"
第五次調用	reverseString("o")	reverseString("") + "o"

第二部分的遞歸方法。

每次調用	返回
第五次調用	reverseString("") + "o" = "o"
第四次調用	reverseString("o") + "l" = "o" + "l"
第三次調用	reverseString("lo") + "l" = "o" + "l" + "l"
第二次調用	reverserString("llo") + "e" = "o" + "l" + "l" + "e"
第一次調用	reverserString("ello") + "h" = "o" + "l" + "l" + "e" + "h"

上面的方法還可以繼續改良一下，改成三元操作符：

function reverseString(str) {
    return (str === '') ? '' : reverseString(str.substr(1)) + str.charAt(0);
}
reverseString("hello"); // => olleh

　　還可以換成這樣的方式

function reverseString(str) {
  return str && reverseString(str.substr(1)) + str[0];
}
reverseString("hello"); // => olleh

除了上面的方法之外，其實還有其他一些方法：

方法一

function reverseString (str) {
    var newString = [];
    for (var i = str.length - 1, j = 0; i >= 0; i--, j++) {
        newString[j] = str[i];
    }
    return newString.join('');
}

reverseString("hello"); // => olleh

方法二

function reverseString (str) {
    for (var i = str.length - 1, newString = ''; i >= 0; newString += str[i--] ) {

    }
    return newString;
}

reverseString("hello"); // => olleh

 

方法三

function reverseString (str) {
    function rev(str, len, newString) {
        return (len === 0) ? newString : rev(str, --len, (newString += str[len]));
    }
    return rev(str, str.length, '');
}
reverseString("hello"); // =>olleh

 

方法四

function reverseString (str) {
    str = str.split('');
    var len = str.length,
        halfIndex = Math.floor(len / 2) - 1,
        newString;
    for (var i = 0; i <= halfIndex; i++) {
        newString = str[len - i - 1];
        str[len - i - 1] = str[i];
        str[i] = newString;
    }
    return str.join('');
}
reverseString("hello"); // => olleh

 

方法五

function reverseString (str) {
    if (str.length < 2) {
        return str;
    }
    var halfIndex = Math.ceil(str.length / 2);
    return reverseString(str.substr(halfIndex)) + reverseString(str.substr(0, halfIndex));
}

reverseString("hello"); // =>olleh

 

方法六

function reverseString(str) {
  return [].reduceRight.call(str, function(prev, curr) {
    return prev + curr;
  }, '');
}

reverseString("hello"); // =>olleh

ES6的方法

在ES6中，可以變得更為簡單一些，如：

[...str].reverse().join('');

或者:

[...str].reduceRight( (prev, curr) => prev + curr );

或者：

const reverse = str => str && reverse(str.substr(1)) + str[0];