3月8日 授業内容 (配列、二次元配列、チェックテスト②、連想配列、)
↓arrayの中は下記
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>配列</title> </head> <body> <script> var num=[10,100,1000,10000];//配列に関する数値は必ず[]←ブラッケトで囲む console.log(num[2]);//0番目が一番初めの順序なので1000が2番目の値として表示される </script> <script> var fruits=['りんご','みかん','もも','ぶどう']; console.log(fruits[0]);//0番目からのカウントなので3番目はぶどうになる </script> <script> var number = [ 10, 20, 30 ]; number[1] = 50; console.log(number);//1番目に50が上書きされることによって表示は10,50,30になる。 </script> <script> var number = [ 10, 20, 30 ]; number[3] = 50; console.log(number);//3番目に50が新たに代入されるので表示は10,20,30,50になる。 </script> <script> var number=[ ]; number[0]=10; number[1]=20; number[2]=30; number[3]=40; number[7]=100; console.log(number);//*表示したときに”:”があるとその配列は連続していないことを表す </script> <script> var number=[ ]; number[0]=10; number[1]=20; number[2]=30; number[3]=40; number[7]=100; console.log(number.length);//飛びぬけた部屋の数(欠番)も数えるので表示結果(0番目から7番目)は8になる //number.lengthは数値の数を表す </script> </body> </html>
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>2次元配列</title> </head> <body> <script> var number = [ [ 10 , 20 , 30 ] , [ 40 , 50 , 60 ] ]; console.log(number[0][0]); console.log(number[0][1]); console.log(number[0][2]); console.log(number[1][0]); console.log(number[1][1]); console.log(number[1][2]); </script> </body> </html>
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>連想配列</title> </head> <body> <!--http://d.hatena.ne.jp/web-0818/20160503/p1--> <script> var favorites={ food:'カレー', color:'青', number:7 };//連想配列の初期値はカールブラケットで囲むこと console.log(favorites.food); console.log(favorites.color); console.log(favorites.number); </script> <script>//《ブラケットを使った要素の参照》 var favorites = { food : 'カレー', color : '青', number : 7 }; console.log(favorites['food']); var key = 'food'; console.log(favorites[key]); </script> <script> var favorites = { food : 'カレー', color : '青', number : 7 }; favorites.sports = 'サッカー'; //要素が追加される console.log(favorites.sports); </script> </body> </html>
オブジェクトとプロパティとメッソッド
オブジェクトとプロパティとメソッド - Webデザインの勉強 | Webサイト制作科 1月20日開講クラス
*組み込みオブジェクト
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>Dateオブジェクト(連想配列)</title> </head> <body> <!--http://d.hatena.ne.jp/web-0818/20160509/p1--> <!--//オブジェクト=連想配列--> <script> var d=new Date();//newキーワード(演算子)を使い、新しいオブジェクトを作成する。ここから今日に関する情報を抜き取る document.write('<h1>'); document.write(d); document.write('</h1>'); </script> <br> <script> var today=new Date();//全ての情報がtodayの中に入っている//下でこの情報を分配している var d='今日は、' + today.getFullYear() +'年' + (today.getMonth() + 1) + '月' + today.getDate() +'日です。'; document.write(d);//getMonth() + 1 と入力するのは1月を0番目、2月を1番目とするため1を足さないと正しい月が表示されない console.log(d); </script> <br> <script> var d = new Date(); var y = d.getFullYear(); document.write( '今年は、' + y + '年' ); </script> <br> <script> var d = new Date(); var mt = d.getMonth() + 1; var dt = d.getDate(); document.write( '今日は' + mt + '月' + dt + '日' ); </script> <br> <script> var d=new Date(); var h=d.getHours(); var m=d.getMinutes(); document.write('今は、' + h + '時' + m + '分です。'); </script> </body> </html>
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>曜日の区別</title> </head> <body> <!--http://d.hatena.ne.jp/web-0818/20160510/p1--> <script> var d=new Date(); var day=d.getDay(); if(day===0 || day===6){//0番目は日曜日、6番目は土曜日 document.write('<img src="img/hday.jpg">');} else{document.write('<img src="img/wday.jpg">'); } </script> </body> </html>