講義:プログラミング基礎’2018 その11

講義:プログラミング基礎’2018 その11

講義:プログラミング基礎’2018


工学部学生の教養としてのプログラムを学習する

評価⇒ 講義:プログラミング基礎’2018 その1

授業のルール

  • 席は,空けずに詰めて座ること。
  • スマフォは鞄にしまうこと。
  • PC で,授業と関係ないことをしないこと。


本日の内容

Web プログラム

課題

習うテクニック
  • 文字の色の設定 例:document.fgColor = "White";
  • 年,月,日,時,分,秒の取得方法
  • 等間隔時間で関数を動かす setTimeout(関数, xxx); xxx ミリ,
その1 timer01.htm として,5秒毎タイマーを作成せよ。
その2 timer02.htm として,現在時刻の表示に,年月日,を追加せよ。

ヒント

yyyy = t.getFullYear();

xmonth = t.getMonth() + 1;

dd = t.getDate();

その3 本日のプログラムを一字一,人に説明できるようにする。

timer00.htm

<html>
<head>
<meta charset="utf-8">
    <title>00 タイマー</title>
</head>

<body>

現在時刻
<div id="xout01"></div>
<br>
残り
<div id="xout02"></div>
<hr>

<script>

xout01 = document.getElementById('xout01');
xout02 = document.getElementById('xout02');

document.fgColor = "White" //文字の色
xRealTime( ); // 現在時刻表示関数

// 関数定義

// 現在時刻表示関数
function xRealTime( ) {
  
    t = new Date(); // 現在時刻を取得
  
    //時,分,秒

    h = t.getHours( );
    m = t.getMinutes( );
    s = t.getSeconds( );

    // 30秒ごとに色を変える
    if ((0<=s) & (s<30)) {    // 0<= s < 30
        document.bgColor = "Red"; // 背景の色
    }

    if ((30<=s) & (s<=59)) {    // 30<= s <= 59
        document.bgColor = "Blue";
    }

    // 日付・時刻の文字列を作成
    xout01.innerHTML = h + ":" + m + ":" + s;
    xout02.innerHTML = 30 - Math.floor((t % (1000*30))/1000);

    // 200 ミリ後に開始をセット,つまり 0.2 秒ごとに書き換え
    setTimeout(xRealTime, 200);
}
</script>

</body>
</html>


質問から

  • "/" と "//"の使い分けは?
    • プログラム言語毎に微妙に違いがある。JavaScript では,"/" は,"÷"の記号のかわり。"//"は,メモ書きの印。Python では,"/" も "//" も割り算の記号で,前者は,計算結果は,小数付きだが,後者は,小数を切り捨て。Python のメモ書きは,"#" で始まる。
  • </〜>で閉じなくてもいいタグと,</〜>で閉じるタグの違いは何か?
    • タイトルなど,ここからここまでという範囲があるものは,</〜>で閉じます。改行の<br>のように範囲がないものは,</〜>で閉じません。


アンケート(アンケート用紙が配られたら,すぐに前後左右に人に書いてもらうこと)

A4 用紙の半分を使用。紙は,縦長に使用すること。すぐにりの人の名前を書いてもらうこと

日付,時限数,学生番号(下2桁),氏名

席の前後左右の人の名前(漢字とふりがな,その人に書いてもらう)とその人の「奢ってもらうとうれしい好きなオヤツ・スィーツ」

例:斎藤 末広(さいとう すえひろ) 31のアイスで,ナッツとチョコが入っているもの

前:

後:

左:

右:

A 今日の授業でためになったこと

B 授業に関する質問

C 授業の充実度(1-5)