導入

この記事では、split()、reverse()、join() という 3 つの JavaScript メソッドについて説明します。これらのメソッドは、文字列を操作したり、テキストの反転や単語の順序の変更などのタスクを実行したりする場合に役立ちます。

前提条件

事前の経験は必要ありません。JavaScript を詳しく知り、これらのメソッドを試してみたいという意欲だけが必要です。

split() メソッド

split() メソッドは、引数として渡される指定された区切り文字に基づいて文字列を配列に分割します。区切り文字は、文字列をどこで「カット」するかをプログラムに指示します。たとえば、「これは素敵なサンドイッチです」のような文があり、それを個々の単語に分割したい場合は、区切り文字としてスペース (' ') を使用できます。

const string = "This is a lovely sandwich";
const splitString = string.split(" ");

引数としてスペース (' ') を指定すると、コードは文字列内でそのスペースを検索し、出現するたびに文字列を「分割」します。これにより、各単語が個別の要素となる配列が作成されます。

上記のコードの結果は次のとおりです:

Array(5) [ "This", "is", "a", "lovely", "sandwich" ]

かなり素敵ですね?

任意の区切り文字を使用できます。たとえば、「hi-there-how-are-you-doing!」のようなハイフンでつながれた文字列があるとします。ハイフンで分割したい場合は、区切り文字として「-」を使用するだけです:

const hyphen = "hi-there-how-are-you-doing!";
const splitHyphen = hyphen.split("-");

結果は次のようになります:

Array(6) [ "hi", "there", "how", "are", "you", "doing!" ]

このメソッドは、文字列を操作するための多くの可能性を広げます。しかし今、あなたは次のように考えているかもしれません: なるほど、それは素晴らしいことですが、私は文字列から始めて、今では配列を手に入れました。文字列を元に戻すにはどうすればよいですか?

次の方法に進みましょう。

join() メソッド

配列に対して join() メソッドを使用すると、配列を文字列に戻すことができます。 Split() と同様に、join() メソッドは配列要素の結合方法を指定する引数を受け取ります。違いは、join() は文字列を分割するのではなく、引数を使用して配列要素を結合して 1 つの文字列に戻すことです。

たとえば、前の splitHyphen 配列を使用すると、引数としてスペースを指定することで、配列を 1 つの文字列に結合し直すことができます。

const joinedString = splitHyphen.join(" ");

const joinString = splitHyphen.join(" ");

結果は次のようになります:

const joinedString = splitHyphen.join(" ");

「こんにちは、調子はどうですか！」

まるで魔法のようです！これで、配列が各単語の間にスペースを入れた文字列に変換され直されました。

reverse() メソッド

reverse() メソッドは、配列内の要素の順序を元の逆に変更します。このメソッドは引数なしで配列に対して直接呼び出され、単に要素の順序を逆にします。

たとえば、splitHyphen 配列内の要素を逆にしたい場合は、次のように実行できます:

const joinedString = splitHyphen.join(" ");

const reversedArray = splitHyphen.reverse();

結果は次のようになります:

const joinedString = splitHyphen.join(" ");

もう一度 join() を使用して、この反転した配列を文字列に戻すこともできます:

const reversedString = reversedArray.join(" ");

const reversedString = reversedArray.join(" ");

これにより、次のことが得られます:

const reversedString = reversedArray.join(" ");

「やってます！元気ですね、こんにちは」

かなりクールですね?

結論

---

この記事では、JavaScript の 3 つの重要なメソッド、split()、reverse()、join() について説明しました。これらがどのように連携して文字列と配列を操作し、柔軟な方法で変換するかを調べました。これがあなたの JavaScript の旅に役立ち、さらに実験するきっかけになれば幸いです!

読んでいただきありがとうございます！ JavaScript の文字列操作についてご質問がある場合、またはご意見を共有したい場合は、Twitter @km_fsdev までお気軽にご連絡ください。