JavaScriptでスペースの位置を維持したまま文字列を反転させる方法

問題

空白（スペース）を含む可能性のある文字列を受け取り、各単語の文字順だけを反転させるJavaScript関数を作成することを考えます。求められる条件は次のとおりです。

• 単語内部の文字は逆順に並べ替える
• 単語と単語を区切るスペースの位置は元のまま維持する
• 異なる単語の文字同士が入れ替わらないようにする

アプローチ

基本となるアイデアは、「元の文字列を末尾から先頭へ向かって走査し、空白以外の文字を結果用の文字列へ追加していく」というものです。文字を追加するたびに、結果文字列の現在の長さをインデックスとして元の文字列を参照し、その位置がスペースであれば同じくスペースを結果に加えます。こうすることで、スペースの位置を元の文字列に合わせながら、単語内部の文字だけを反転させることができます。

コード例

以下が実際の実装コードです。

const str = 'this is normal string';
const reverseWordsWithin = (str = '') => {
    let res = "";
    for (let i = str.length - 1; i >= 0; i--){
        if(str[i] != " "){
            res += str[i];
        };
        if(str[res.length] == " "){
            res += str[res.length];
        };
    };
    return res;
};
console.log(reverseWordsWithin(str));

出力

gnir ts lamron sisiht

補足：より堅牢な実装

上記のシンプルな実装は直感的で分かりやすい一方、単語の長さの組み合わせによってはスペースの位置がずれ、隣り合う単語が連結されてしまうことがあります。スペースの位置を厳密に維持したい場合は、正規表現で文字列を分割してから各単語だけを反転させる方法が確実です。

const reverseWordsStable = (str = '') =>
    str
        .split(/(\s+)/)
        .map(part => (/^\s+$/.test(part) ? part : [...part].reverse().join('')))
        .join('');

console.log(reverseWordsStable('this is normal string'));
// 出力: siht si lamron gnirts

split(/(\s+)/) のようにキャプチャグループ付きの正規表現で分割すると、スペース自体も配列の要素として保持されます。そのため、スペース部分はそのまま残し、単語部分にのみ reverse() を適用して再結合すれば、元のスペース配置を完全に保ったまま各単語を反転できます。