ジャバスクリプトの１

数字を作って占いをする

準備

HTMLを準備しよう
br> 前回作ってある続きからです。

     <p id="p1">今日の運勢1</p>
   <input id="button1" type="button" value="ボタンを押して下さい">
    <script>
        let button1=document.getElementById("button1");
        let p1 = document.getElementById("p1");
        button1.onclick = function(){
            let rnd = Math.floor( Math.random()*5 );
            let uranai="大吉";
            if(rnd == 0 ){ uranai="大吉"}
            if(rnd == 1 ){ uranai="中吉"}           
            if(rnd == 2 ){ uranai="吉"}          
            if(rnd == 3 ){ uranai="小吉"}          
            if(rnd == 4 ){ uranai="凶"}          
            p1.innerHTML= uranai ;
        }
    </script>

配列を使えば基すっきり　反応もはやいかも

これまで、文字の入れ物として　ver を使ってきました。
これには、1つだけ入る入れ方があります。 ver moji = "大吉";
これは文字を一つだけ入れる方法。

箱の中に、一つ文字などを入れられる。

でも名前をいくつもつけるのは面倒だ。
そこで、
let moji = ["大吉","中吉","吉","小吉","凶"];
これで配列が出来ます。同じ名前で、中が分かれている。

一つ一つを呼び出すには，番号を指定します。
moji(0) は　大吉
moji(1) は　大吉
moji(2) は　大吉
moji(3) は　大吉
moji(4) は　大吉
ということになります。
０から４までの５つです。乱数発生のとき０から数字を作ったのは、配列の呼び出しにぴったりで、ここへ来て役に立つのです。プログラムの1番目の数は０とする方が都合が良いのです。

配列を使ってプログラムを書き直すと


    <p id="p1">今日の運勢1</p>
    <input id="button1" type="button" value="ボタンを押して下さい">
    <script>
        let button1=document.getElementById("button1");
        let p1 = document.getElementById("p1");
        let uranai = ["大吉","中吉","吉","小吉","凶"];
        button1.onclick = function(){
            let rnd = Math.floor( Math.random()*5 );          
            p1.innerHTML= uranai[rnd] ;
        }
    </script>

今日の運勢1



こんなふうになります，
ずいぶん簡単になりましたし、いちいちif文を呼び出さないので反応も早いと思います。
　 <