Console Program

コンソールモードで JavaScript の基本を説明します。
document.write で吐き出されたテキストがブラウザに渡されて、新しいページに表示されます。
ページ全体のソースコードは、右クリックから ソースの表示(V) で確認することが出来ます。
  1. con_100.html
    1~100までの合計を計算します。
    <script>
    sum= 0;
    for(i=1; i<101; i++)
    {   sum= sum +i;  }
    document.write("1~100までの合計 : " + sum + "<br>\n");
    </script>
    
  2. con_sosu.html
    50以下の素数を印字します。
    <script>
    for(n=2; n<50; n++)
    {   for(i=Math.floor(n/2); n%i!=0; i--);
        if (i==1)   document.write("素数 : " + n + "<br>\n");
    }
    </script>
    
  3. con_pai.html
    円に内接する正方形から始めて、円周率の近似値を求めて印字します。
    <script>
        k= 4;
        l= Math.sqrt(2);
        for(i=0; i<10; i++)
        {   document.write("正" + k + "角形    ");
            document.write("円周率 : " + l*k/2 + "<br>\n");
            w= l/2;
            lw= w*w;
            h= Math.sqrt(1-lw);
            hw= 1-h;
            l= Math.sqrt(hw*hw+lw);
            k= k+k;
        }
    </script>
    
  4. con_string.html
    文字列(String)の基礎です。
    <script>
    var str= " A, AA, AAA, AAAA, AA, aaa, BB, BBB, bbb, bbbb"
    document.write(str + "<br>\n");
    var ans= str.replace("AA", "A");
    document.write(ans + "<br>\n");
    var ans= str.replace(/B+/gi, "*" );
    document.write(ans + "<br>\n");
    </script>
    
  5. con_split.html
    split(), reverse(), join() のサンプルプログラムです。
    <script>
    var str= " A,  BB,   CCC,     DDDD"
    document.write(str + "<br>\n");
    var ans= str.split(",").reverse().join("");
    document.write(ans + "<br>\n");
    </script>
    
  6. con_gcm.html
    gcm() 関数(メソッド)を定義して、タイプ入力した DATA-1 と DATA-2 の最大公約数(GCM) を印字します。
    <script>
    function gcm(n, m)
    {   var wn = parseInt(n);     //値1
        var wm = parseInt(m);     //値2
        while(wn!=wm)
        {   if (wn>wm)  wn -= wm;
            else        wm -= wn;
        }
        return wn;
    }
        d1 = prompt("DATA-1 を入力してください");
        d2 = prompt("DATA-2 を入力してください");
        document.write("GCM(" + d1 + ", " + d2 + ") は= " +gcm(d1,d2) + " です。<br>\n");
    </script>
    
  7. con_array.html
    配列の基礎です。
    <script>
      var items = ['りんご', 'みかん', 'メロン', 'いちご', 'すいか', 'なし', 'もも', 'バナナ'];
      document.write("先頭:" + items[0] + " 後尾:" + items[items.length-1] + "<br>");
      var result = items.pop();
      document.write("ITEM(" + items + ") POP:" + result + "<br>");
      result = items.shift();
      document.write("ITEM(" + items + ") SHIFT:" + result + "<br>");
      items.splice(1, 2);
      document.write("ITEM(" + items + ")<br>");
      items.splice(2);
      document.write("ITEM(" + items + ")<br>");
    </script>
    
  8. con_sort.html
    Array クラスのソートメソッドで昇順に並べて印字します。
    <script>
      num = new Array(56, 9, 789, 1234);
      //Array の sort() メソッドを使う 
      num.sort();
      document.write(num + "<br>");
    
      //ソートの比較関数を定義する
      num.sort(function(a,b){ return a-b; } );
      window.alert("数値で比較 : " + num);
      document.write(num + "<br>");
    </script>
    
  9. con_input.html
    実数をタイプ入力して、func() 関数で降順にソートします。
    <script>
    function compareFunc(a, b)
    {   return b - a;
    }
    function func(ary)
    {   ary.sort(compareFunc);
    }
        var i;
        ary= new Array();
        for(i=0; i<10; i++)
        {   var d = prompt("DATA を入力してください");
            d = Number(d);
            if (d==0)   break;
            ary[i]= d;
        }
        func(ary);
        for(i=0; i<ary.length; i++)
        {   document.write("ary[" + i + "] 番目は : " + ary[i] + " です。<br>\n");
        }
    </script>
    
  10. con_join.html
    二次元配列⇔文字列の相互変換です。
    <script>
    var arr= [[1,2],[3,4,5],[6,7,8,9]];
    var str= arr.join(',');
    document.write(str + "<br>\n");
    // 1,2,3,4,5,6,7,8,9
    
    // 次元の区切り(/)を設定
    str= "";
    for(var i=0; i<arr.length; i++)
    {   str= str + arr[i].join(',');
        str= str + '/';
    }
    document.write(str + "<br>\n");
    // 1,2/3,4,5/6,7,8,9/
    
    // 二次元配列に戻す
    var arrw= new Array();
    var wk= str.split('/');
    for(var i=0; i<wk.length; i++)
        arrw.push(wk[i].split(','));
    // 二次元配列を印字   
    for(var i=0; i<arrw.length; i++)
    {   for(var j=0; j<arrw[i].length; j++)
            document.write(arrw[i][j] + ",");
        document.write("<br>\n");
    }
    </script>
    
  11. con_rensou.html
    連想配列の基礎です。
    <script>
    var ary= new Array();
    ary["ST"]= "Suzuki Tarou";
    ary["TH"]= "Tanaka Hanako";
    ary["YK"]= "Yamada Kouji";
    ary["AK"]= "Ayase Keiko";
    
    for(key in ary)
    {   var name = ary[key];
        document.write(key, ": ", name, "<br>\n");
    }
    </script>
    
  12. con_rensoufunc.html
    関数値(GCM, LCM)を連想配列でリターンします。
    <script>
    function glcm(n, m)
    {   var wn = parseInt(n);     //値1
        var wm = parseInt(m);     //値2
        while(wn!=wm)
        {   if (wn>wm)  wn -= wm;
            else        wm -= wn;
        }
        var lcm = n*m/wn;
        return {gcm:wn, lcm:lcm};
    }
        var d1 = prompt("DATA-1 を入力してください");
        var d2 = prompt("DATA-2 を入力してください");
        onload = function()
        {   var {gcm, lcm}= glcm(d1, d2);
            document.write("DATA-1:", d1, " DATA-2:", d2,
                "<br>\nGCM:", gcm, " LCM:", lcm);
        }
    </script>
    
  13. con_class.html
    gcmlcm Class を定義します。
    <script>
    function gcmlcm()
    {   this.nm;
        this.gcm = function(n, m)
        {   var wn = parseInt(n);   //値1
            var wm = parseInt(m);   //値2
            while(wn!=wm)
            {   if (wn>wm)  wn -= wm;
                else        wm -= wn;
            }
            return wn;
        }
        this.lcm = function(n, m)
        {   this.nm= parseInt(n)*parseInt(m);
            return this.nm/this.gcm(n, m);
        }
        this.disp = function(n, m)
        {   var str= "GCM(" + n + ", " + m + ")=" + this.gcm(n,m) +
                     " : LCM(" + n + ", " + m + ")=" + this.lcm(n,m) + "<br>\n";
            return str;
        } 
    }
        var cls = new gcmlcm();
        d1 = prompt("DATA-1 を入力してください");
        d2 = prompt("DATA-2 を入力してください");
        document.write(cls.gcm(d1, d2) + "<br>\n");
        document.write(cls.lcm(d1, d2) + "<br>\n");
        document.write(cls.disp(d1, d2) + "<br>\n");
    </script>
    
  14. con_TextFile.html
    ローカルフォルダーの Text File を入力します。
    <form name="test">
    <input type="file" id="selfile" /><br/>
    </form>
    
    <script type="text/javascript">
    var obj1 = document.getElementById("selfile");
    
    //ダイアログでファイルが選択された時
    obj1.addEventListener("change",function(evt)
    {   var file = evt.target.files;
        var reader = new FileReader();
        reader.readAsText(file[0]);
      
        //読込終了後の処理
        reader.onload = function(ev)
        {   window.alert(reader.result);  }
    },false);
    </script>
    
  15. con_GetArray.html
    次は Text File から二次元データを入力して Array に格納します。
    <form name="test">
    <input type="file" id="selfile" /><br/>
    </form>
    
    <script type="text/javascript">
    var obj1 = document.getElementById("selfile");
    
    //ダイアログでファイルが選択された時
    obj1.addEventListener("change",function(evt)
    {   var file = evt.target.files;
        var reader = new FileReader();
        reader.readAsText(file[0]);
      
        //読込終了後の処理
        reader.onload = function(ev)
        {   var str= reader.result;
            arr= new Array(); 
            var w1= str.split("\n");
            window.alert(w1);
            for(var i=0; i<w1.length; i++)
            {   if (w1[i].length<4) continue;
                var w2= w1[i].replace(" \r", ""); 
                var w2= w2.split(" ");
                arr.push(w2);
            }
            for(var i=0; i<arr.length; i++)
            {  for(var j=0; j<arr[i].length; j++)
               {   document.write(i + "," + j + "=" + arr[i][j] + " ");
               }
               document.write("<br>\n");
            }
        }
    },false);
    </script>
    

前田稔の超初心者のプログラム入門
超初心者のプログラム入門(JavaScript)