文字列の分割（Java, JavaScript） - アプリ制作の学習サイト

（ブログ記事の一覧は「こちら」）

いろいろなアプリを作成するときに必要なスキルの1つに、文字列の処理があります。
ここでは、文字列を指定の文字で分割する方法を練習していきましょう。

文字列の分割を行う方法は、Java, JavaScriptともにsplit関数が用意されています。（同じ名前の関数ですが、使い方は異なります）

以下にサンプルのプログラムを用意しました。カンマ区切りの文字列に対して、ご自身でsplit関数を調べてみて、カンマで文字列を分割するプログラムとなるように完成させてください。

（Java, JavaScriptのどちらか一方を選択してもらって構いません）

Javaでの記述例

package com.test;

public class TestApp {

    public static void main(String[] args) {

        String str = "りんご,みかん,メロン,バナナ";
        
        // TODO: 文字列の分割

        // 分割した文字列を別々に出力
        System.out.println(”ここに分割した文字列の変数を入れる”);
    }

}

出力結果

りんご
みかん
メロン
バナナ

JavaScriptでの記述例

index.html

<html>
<head>
   <meta charset="UTF-8">
   <script src="main.js"></script>
</head>

<body>
    <input type="button" value="文字列の分割" onclick="divText()">
    <div id="hoge"></div>

</body>
</html>

main.js

function divText() {
    var str = "りんご,みかん,メロン,バナナ";

    // TODO: 文字列の分割

    document.getElementById("hoge").innerHTML = （分割した文字列を改行で表示）;
}

出力結果

りんご
みかん
メロン
バナナ

課題

以下の文字列に対して、「出力結果」のように出力させるプログラムを完成させなさい。

りんご=150円,みかん=80円,メロン=800円,バナナ=250円

出力結果

りんごは150円です。
みかんは80円です。
メロンは800円です。
バナナは250円です。

（ヒント）
まず、文字列全体をカンマ「,」で分割して、さらに区切ったそれぞれの文字列に対して「=」で分割します。
あとは、出力結果に合わせて必要な文字を追加することで完成します。