ジャバスクリプトの3

時間を表示しよう
<

時間表示をやってみよう
new を使ってインスタンス（実態）を作り、それを取り扱う。


こんなふうに時間が表示できる。

いまの時間表示１


    <p id="id1">いまの時間表示１</p>    
    <script>
        let now = new Date();  //グローバルスコープ　どこでも有効
        year =  now.getFullYear();
        let month = now.getMonth() + 1; //１を足すこと
        let day = now.getDate();
        let s = year+"年"+month+"月"+day+"日;
        let jikan2 = document.getElementById("id1");
        jikan2.innerHTML = s ;        
//       　1行でもかける
//       　document.getElementById("id1").innerHTML=s; 
    </script>

インタープリンター型プログラム

Javaスクリプトはインタープリンター型プログラムです。
書けばそのまま使えます。だから便利です。
コンピュータは、1行1行読み取って、機械語に直して動作します。
そこで，弱点として動作が遅くなります。
それに対して、java（Javaスクリプトとは名前が似ているだけで別言語）やC等のコンパイル型のプログラムがあります。
これは、プログラム完成時に一度に機械語に直してあります。
これは動作が速い、そして複雑なことが早くできるのです。

そこでJavaスクリプトは少しでも動作が速くなるように短く書くことがあります。 

//　　2行で書くと
        let jikan2 = document.getElementById("id1");
        jikan2.innerHTML = s ;
        
//    1行でもかける
       　document.getElementById("id1").innerHTML=s; 
    </script>
簡単に言うと、2行で書くと，機械は2回仕事をします。
1行で書くと1回の仕事で済む。
実際は最複雑なのでしょうが、行数を減らすことで動きが速くなります。
コンパイラ型のプログラムでは、長くなってもわかりやすいプログラムを書くことが大事ですが、インタープリンター型プログラムは、短くする必要もあるのです。
そこで、上のような短く仕方も覚えましょう。

スコープについて

変数の宣言には、let を使います。
（このほかに　var というのがあります。<br>
var は挙動(どこまで通用するかということです）が他のプログラムと比べて変で、これから無くなるでしょう。）
var は他のプログラムとよく似ていますので、まずはこれだけで充分です。
宣言した変数は、{}の中で有効です。

1段目/トップレベルに書いた変数はどこでも使えます。


fanctionの中に書かれた変数はその中で使われて、使い終わるとメモリから消えます。
これをローカルスコープと言います。

書かれた｛｝の中で通用する、これは他の言語にも通用します。
これがこれからの主流になるでしょう。

こうしても通用します。たぶん。
でも2カ所でsuを宣言するのはプログラムが分かりにくくなるから、やめた方が良い。

それから　const　という一度決めたらもう変えられない変数（定数）の宣言もあります。
宣言は必要なところで宣言すること。
宣言名は多少長くてもわかりやすい名前にすること。単に a なんてダメです。
下のローカル変数は、su としましたが、su1 などと名前を変えた方がわかりやすいです。
なるべく資源は使いすぎないように、必要なところで使ってあとは廃棄されるのが良いのです。

違った書き方　ローカルスコープ

2つ比べてみて下さい。
ローカルスコープの例

<p id="id3">いまの時間表示１</p>        
    <script>
    document.getElementById("id3").innerHTML = getNow3();
    function getNow3() {
        let now3 = new Date();
        let month = now3.getMonth()+1; //１を足すこと
        let day = now3.getDate();
        let hour = now3.getHours();
        let min = now3.getMinutes();
        let sec = now3.getSeconds(); 
        let s = year + "年" + month + "月" + day + "日"+ hour + "時"; 
        return s;
    }

</script>
グローバルスコープの例 

<p id="id7">いまの時間表示111</p>        
    <script>
        let now7 = new Date();
        let month = now7.getMonth()+1; //１を足すこと
        let day = now7.getDate();
        let hour = now7.getHours();
        let min = now7.getMinutes();
        let sec = now7.getSeconds(); 
        let s7 = year + "年" + month + "月" + day + "日"+ hour + "時"; 
        document.getElementById("id7").innerHTML = s7;
</script>

いまの時間表示１

上の例で書かれた month 等の変数は、このfunctionの中だけで使われます。
functionが使い終わるとガベージコレクションされて、メモリから消えます。

インスタンスgetnow3()を呼び出すと、文字を返します。
functionの最後に、このfunctionは、return s; と書いてあります。
これで、Sの内容である年月日の文字が返されます。

それを、最初の行で受け取って、表示しているのです。







sub1.html へのリンク　←これができあがり資料
b.zip へのリンク←これを解凍すればほぼできあがり
次の問題へ進む