Webデザインの勉強と製作 | あかとんぼ

フェリカテクニカルアカデミーの学習をベースに、Webについての勉強と製作の過程をまとめています。

[Javascript]⑨組み込みオブジェクト Dateオブジェクト Mathオブジェクト random関数

  • 組み込みオブジェクト
  • Objectオブジェクト
  • Dateオブジェクト
  • Mathオブジェクト
  • 乱数を戻す:random

組み込みオブジェクト

  • 組み込み関数とおなじくJavaScriptが用意するオブジェクト
  • Object▶すべてのオブジェクトの元となるオブジェクト
  • Date▶日時操作機能をもつオブジェクト
  • Math▶計算機能をもつオブジェクト
  • Array▶配列操作機能をもつオブジェクト
  • String▶文字列操作機能をもつオブジェクト
Objectオブジェクト
  • 波括弧で初期化したオブジェクト
  • 連想配列はObjectオブジェクト
  • すべてのオブジェクトはObjectオブジェクトを元にする
  • Objectオブジェクトが持つプロパティ、メソッドはすべてのオブジェクトで利用可能

Dateオブジェクト

  • newキーワード(演算子)で新しいオブジェクトを作成
  • 生成されて利用可能になったオブジェクトをインスタンスとよぶ
  • オブジェクトとは、データと機能をまとめたもの
  • Dateオブジェクトは、日時データとそのデータを調べたり設定したりする機能をまとめたもの
<script>
var d = new Date();
document.write(d);
</script>
Dateオブジェクトから年、月、日を取得
  • オブジェクトにまとめられたデータは、プロパティという
  • オブジェクトにまとめられた機能は、メソッドという
  • プロパティとメソッドは、まとめてメンバといわれる
  • getFullYear()▶年を取得
  • getMonth()▶月を取得
  • getDate()▶日を取得
  • getDay()▶曜日を取得
  • getHours()▶時を取得
  • getMinutes▶分を取得
  • getSeconds▶秒を取得
<script>
var d = new Date();
document.write( '年:'+d.getFullYear()+'<br>' );
document.write( '月:'+d.getMonth()+'<br>' );
document.write( '日:'+d.getDate()+'<br>' );
</script>

Mathオブジェクト

最大値を戻す:max
var num = [0, 9, 3, 5];
var maxnum = Math.max(num[0],num[1],num[2],num[3]);
console.log(maxnum);
</script>
乱数を戻す:random
<script>
r = Math.random();
console.log(r);
</script>
整数の乱数を返す
  • 1~9の間で乱数を返す
<script>
r = Math.floor(Math.random()*9+1);
console.log(r);
</script>
ランダムでイメージを表示
<script>
var img = ["img/01.png", "img/02.png", "img/03.png"];
var r = Math.floor( Math.random()*3 );
document.write( '<img src ='+img[r]+'>');
</script>

d.hatena.ne.jp