【JavaScript授業八日目】for文、do while文、組み込みオブジェクト
%3CmxGraphModel%3E%3Croot%3E%3CmxCell%20id%3D%220%22%2F%3E%3CmxCell%20id%3D%221%22%20parent%3D%220%22%2F%3E%3CmxCell%20id%3D%222%22%20value%3D%22start%22%20style%3D%22rounded%3D1%3BwhiteSpace%3Dwrap%3Bhtml%3D1%3B%22%20vertex%3D%221%22%20parent%3D%221%22%3E%3CmxGeometry%20x%3D%22140%22%20y%3D%2270%22%20width%3D%22270%22%20height%3D%2260%22%20as%3D%22geometry%22%2F%3E%3C%2FmxCell%3E%3CmxCell%20id%3D%223%22%20value%3D%2210%26amp%3Bgt%3Ba%22%20style%3D%22rhombus%3BwhiteSpace%3Dwrap%3Bhtml%3D1%3B%22%20vertex%3D%221%22%20parent%3D%221%22%3E%3CmxGeometry%20x%3D%22140%22%20y%3D%22180%22%20width%3D%22280%22%20height%3D%2280%22%20as%3D%22geometry%22%2F%3E%3C%2FmxCell%3E%3C%2Froot%3E%3C%2FmxGraphModel%3E%3CmxGraphModel%3E%3Croot%3E%3CmxCell%20id%3D%220%22%2F%3E%3CmxCell%20id%3D%221%22%20parent%3D%220%22%2F%3E%3CmxCell%20id%3D%222%22%20value%3D%22start%22%20style%3D%22rounded%3D1%3BwhiteSpace%3Dwrap%3Bhtml%3D1%3B%22%20vertex%3D%221%22%20parent%3D%221%22%3E%3CmxGeometry%20x%3D%22140%22%20y%3D%2270%22%20width%3D%22270%22%20height%3D%2260%22%20as%3D%22geometry%22%2F%3E%3C%2FmxCell%3E%3CmxCell%20id%3D%223%22%20value%3D%2210%26amp%3Bgt%3Ba%22%20style%3D%22rhombus%3BwhiteSpace%3Dwrap%3Bhtml%3D1%3B%22%20vertex%3D%221%22%20parent%3D%221%22%3E%3CmxGeometry%20x%3D%22140%22%20y%3D%22180%22%20width%3D%22280%22%20height%3D%2280%22%20as%3D%22geometry%22%2F%3E%3C%2FmxCell%3E%3C%2Froot%3E%3C%2FmxGraphModel%3Efor文(続き)
var stormList = [
"松本",
"櫻井",
"大野",
"相葉",
"二宮",
];
var stormCode = "";
for (var i = 0; i < stormList.length; i++) {
stormCode += "<li>" + stormList[i] + "さん</li>\n";
}
stormCode = "<ol>\n" + stormCode + "</ol>\n";
console.log(stormCode);
document.getElementById("display21").innerHTML = stormCode;
●HTMLは</ul>閉じ忘れても表示されちゃうので注意！
var memberList = [
];
var code4 = '<ol>\n';
for (var i = 0; i < memberList.length; i++) {
code4 += '<li>\n';
code4 +=
'<div class="name">' + memberList[i].name + 'さん</div>\n';
code4 +=
'<div class="photo"><img src="' + memberList[i].img + '"></div>\n';
code4 += '</li>\n';
}
code4 += '</ol>\n';
console.log(code4);
document.getElementById('display2').innerHTML = code4;
●HTMLのタブで使用する「""」とごっちゃにならないように注意する！
●forの中にfor
code = '';
for (var i = 0; i < 3; i++) {
for (var j = 0; j < 3; j++) {
code += '★';
}
code += '<br>\n';
}
console.log(code);
document.getElementById('display3').innerHTML = code;
↓上のフローチャート
●forの中にforの中にif
code = "";
for (var i = 0; i < 3; i++) {
for (var j = 0; j < 4; j++) {
if (j % 2 == 0) {
code += "★";
} else {
code += "☆";
}
}
【(j % 2 == 0) ? (code += "★") : (code += "☆")←三項演算子ver】
code += "<br>\n"
}
console.log(code);
document.getElementById('display4').innerHTML = code;
↓上のフローチャート
●JSのfor文出すときに「var」じゃなくて「let」でる
・let：変数の使える範囲（スコープ）が狭い。バグが起こりにくい。
・一度使った変数が使えない（14章で詳しく知れる）
do while文
・ 処理が終わった後に条件を確認する
・whileと同じように条件が満たされている間、特定の処理
・while文との違いは繰り返し条件の判断を処理実行後に行うので必ず1回処理をする
var num;
num = 0;
do {
console.log(num);
num++;
} while (num < 3)
●どういうときに使う？
ドラクエのやつで例えると
一回キャラ選択して、その後に死亡したかどうか確認するときに使う
●for文使いこなせるようになったら、whileやdo while文を覚える
処理の手順を考えるのが重要
文科省が小学生にプログラミングを学ばせたいのはそれが理由だったりする
組み込みオブジェクト
●Mathオブジェクト（マス）
●Stringオブジェクト（ストリング）
オブジェクト：配列の箱を入れてる枠
プロパティ
console.log(Math.PI); ←円周率 3.1415926535
メソッド
console.log(Math.ceil(3.3)); ←切り上げ処理 4
console.log(Math.floor(3.3)); ←切り捨て処理 3
console.log(Math.round(3.3)); ←四捨五入処理 3
console.log(Math.max(5, 2, 10)); ←一番数値の高いもの表示 10
console.log(Math.min(5, 2, 10)); ←一番数値の低いもの表示 2
console.log(Math.random()); ←0以上1未満の少数(乱数)を返すメソッド
・Mathなどの組み込みオブジェクトはJSがあらかじめ用意してくれているオブジェクト
・オブジェクト内の値（プロパティ）を参照したい
オブジェクト名 . プロパティ名
・オブジェクト内の処理（メソッド）を呼び出したい
オブジェクト名 . メソッド名 ( )
※（）が最後あるかどうかでプロパティとメソッドの判断をする
※console.log()←これもコンソールオブジェクトのlogメソッドを呼び出している
console.log(Math.PI);
暗黙のルールですべて大文字で書かれた変数は「定数」
・定数とは確定した数、円周率とか...
●処理の流れ
Math.ceil(3.3)←この中に入っている数字(引数-ひきすう-)
