JavaScriptで空白と単語の順序を保持しながら各単語を反転する方法

はじめに

本記事では、文字列を引数として受け取り、その中の各単語の文字順を反転させながら、空白の位置と元の単語の順序はそのまま保持するJavaScript関数の作成方法を解説します。

課題の概要

作成する関数は、文章を表す文字列 str を第1引数(唯一の引数)として受け取ります。

この関数は、文中の各単語に含まれる文字の並びを逆順にします。ただし、空白の位置や単語が出現する順序自体は変えずに維持する必要があります。

入出力例

たとえば、次の文字列を入力した場合を考えてみましょう。

const str = 'this is some sample string';

この場合、期待される出力は以下の通りです。

const output = 'siht si emos elpmas gnirts';

実装コード

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

const str = 'this is some sample string';
const reverseWords = (str = '') => {
    return str.trim()
      .split(/\s+/)
      .map((s) => {
      let res = ''

      for (let i = s.length-1; i >= 0; i--) {
          res += s[i]
      }
      return res
   })
   .join(' ');
}
console.log(reverseWords(str));

コードの解説

このコードの処理の流れを順番に確認していきましょう。

• trim(): 文字列の先頭と末尾にある余分な空白を取り除きます。
• split(/\s+/): 正規表現 /\s+/ を使って文字列を分割します。連続する複数の空白が含まれていても、正しく単語ごとに分割できるのがポイントです。
• map(): 分割された各単語に対して、forループで後ろの文字から順に新しい文字列 res へ連結することで、単語を反転させます。
• join(' '): 反転された単語たちを半角スペース1つで連結し、最終的な結果文字列を生成します。

より簡潔な代替案

組み込みメソッドを活用すれば、同じ処理をもっと短く記述することも可能です。

const reverseWordsShort = (str = '') =>
  str.trim()
     .split(/\s+/)
     .map(word => word.split('').reverse().join(''))
     .join(' ');

こちらは split('') で文字ごとの配列に分解し、reverse() で反転させ、join('') で再び文字列へ戻すという流れになっています。可読性を重視する場合はこの書き方がおすすめです。

出力結果

コンソールには次のように表示されます。

siht si emos elpmas gnirts

まとめ

trim()・split()・map()・join() といった配列操作系のメソッドを組み合わせることで、空白や単語の順序を保持しつつ、各単語の文字だけを反転させることができます。特に正規表現 /\s+/ を使った分割により、不規則な空白にも柔軟に対応できる点が重要です。