YES/NOチャート 効果音

今回のゼミではYES/NOチャートの中に効果音を入れることを目標に前回作成したmonacaを改善した。

今回のキーワードは、”関数”
関数を使用し、YES/NOチャートで最終的にたどり着いた画面ごとに異なる効果音を出すようにブログに掲載されていた既存のプログラムを修正した。
関数に引数を与えることで、様々な異なる画面ごとで異なる効果音を出すことに成功した。

今回は　beep=function()　を利用して効果音を入れることにした。
効果音は次のサイトにあるのを使った。

https://maoudamashii.jokersounds.com/

＜今回学習した内容＞

字下げ

Javascriptでの記述で行末に "{" が書かれてある次の行は字下げ（たとえば２文字ずら）して記述すると見やすい（リスト１参照）。

var beep = function(url) {
    var my_media = new Media(url,
        function() {
            console.log("playAudio():Audio Success");
        },
        function(err) {
            console.log('playAudio():Audio Error:' + err);
    }).play();
};

リスト１

このプログラムで、1行目の末尾に "{" があるので、2行目は字下げしている。さらに4行目の行末にも "{" があるので5行目は字下げしている。

文字列定数と変数

 「"」(ダブルクォーテーション)や「'」(シングルクォーテーション)で囲んであるものは文字列定数、という意味。
何も囲んでないのは変数、という意味。
リスト１の例でいえば、２行目の「url」は変数で、４行目の"playAudio():Audio Success"や'playAudio():Audio Error:'が文字列定数。

「"」(ダブルクォーテーション)と「'」(シングルクォーテーション)の使い分け

文字列の中に文字列を書きたい時がある。そんな場合、下記の例のようにダブルクォーテーションで囲んだ文字列の中にシングルクォーテーションで囲んだ文字列を書く。

onclick="beep('https://maoudamashii.jokersounds.com/music/se/wav/se_maoudamashii_chime03.wav')"

今回のゼミの最初にjsのフォルダを作成するしようとした。その際に、既存のフォルダを移動してしまったらYES/NOチャートがきちんとした動作を起こさない可能性があると学んだ。このことから、最初からあるフォルダは絶対に動かしてはいけないということを学んだ。

次回はよりよいmonacaアプリを目指してページが表示されたら効果音が鳴りだしたり、動画を再生したりするアプリの作成を目標に頑張ります。