【JavaScript】文字列を1文字ずつ表示する方法

JavaScriptを使用して、文字列を1文字ずつ表示する方法は、特定の処理やデバッグの際に便利です。この記事では、そのような方法をいくつか紹介します。必要に応じて、適切な方法を選択して文字列を1文字ずつ表示する際に活用しましょう。

スポンサーリンク

forループを使用する方法

forループを使用して、文字列を1文字ずつ表示します。

function displayStringOneByOne(string) {
    for (let i = 0; i < string.length; i++) {
        console.log(string[i]);
    }
}

let myString = "Hello";
displayStringOneByOne(myString);

forEach() メソッドを使用する方法

forEach() メソッドを使用して、文字列を1文字ずつ表示します。

function displayStringOneByOne(string) {
    string.split("").forEach(function(char) {
        console.log(char);
    });
}

let myString = "Hello";
displayStringOneByOne(myString);

ES6のfor…ofループを使用する方法

ES6のfor…ofループを使用して、文字列を1文字ずつ表示します。

function displayStringOneByOne(string) {
    for (const char of string) {
        console.log(char);
    }
}

let myString = "Hello";
displayStringOneByOne(myString);

これらの方法を使用して、文字列を1文字ずつ表示することができます。適切な方法を選択し、必要なときに文字列の各文字を表示しましょう。

よくある質問（FAQ）

Q. JavaScriptで文字列から1文字だけ取り出して表示するには？
A. string[0]やstring.charAt(0)で先頭文字、string.at(-1)で末尾文字が取得できます。テキストのイニシャル表示やアバター文字に使われます。
Q. 文字列を文字配列に分割するには？
A. […string]やArray.from(string)が絵文字・サロゲートペアに対応しているため推奨です。string.split(“”)は一部の特殊文字で正しく分割できない場合があります。
Q. 文字列の各文字に対してある操作を行うには？
A. Array.from(string)で配列に変換してからmap()・filter()等の配列メソッドを使うと便利です。最後にjoin(“”)で文字列に戻せます。

まとめ

JavaScriptで文字列を1文字ずつ表示する方法を紹介しました。forループ、forEach() メソッド、およびES6のfor…ofループを使用する方法があります。必要に応じて、これらの方法を使って文字列の各文字を操作しましょう。