メモ：ifを使うときは==（文字列と数値があいまい）か===（文字列と数値が厳密に区別される）をつかう。=は定義のときに使う。
ifを使ってみる。pythonとどこが違うかみてみよう。
Pythonを学んでいたらすぐに使えるようになります。
試しに次のようなプログラムを書いてみましょう。
<!DOCTYPE html>
<html>
<body>
<script>
let words = prompt('合言葉を唱えてくださ。');
let check = confirm('合言葉は' + words + 'ですね？');
if (words == 'ちちんぷいぷい'){
alert('おめでとうございます！扉が開きました！');
} else {
alert('失敗しました。合言葉は「ちちんぷいぷい」です。');
}
</script>
</body>
</html>pythonとは書き方が所々違うことがわかるでしょうか。
試しに時間を読み込んでみる。ifもつかっちゃおう。
動的！というわけで、時間を表示させてみます。
それが、できるらしいのです。
<!DOCTYPE html>
<html>
<head>
<title>jsは動的だ！</title>
</head>
<body>
<script>
let now = new Date();//ある瞬間（インスタンス）に対してのみ有効な対象は「オブジェクト」ではなく「インスタンス」といわれている。ほとんどは「オブジェクト」だけれども、「インスタンス」の時にはnewをつけることになっている。
let hour = now.getHours(); //現在時刻の「時」を呼び出したものをhourと定義する。
let minute = now.getMinutes();
document.write("現在時刻は",hour,"時",minute,"分です。")
//https://www.scollabo.com/banban/jsindex/sample/sample_078.html
</script>
</body>
</html>できましいたか！？
やりました！
時間を取得できるので、サイトを訪れた時間に応じて「こんにちは」とか「こんばんは」といった表示をさせることもできます。
let hour = now.getHours();
をみてみると「現在時刻を取得する関数を働かせて出力されたもの（結果）をhourにする（let）」
と書かれています。
状況によって関数はメソッドやらプロパティと呼ばれます。
せっかくだから実現させてみます。
ifを使ってコードをかきます。
<!DOCTYPE html>
<html>
<head>
<title>jsは動的だ！</title>
</head>
<body>
<script>
let now = new Date();//ある瞬間（インスタンス）に対してのみ有効な対象は「オブジェクト」ではなく「インスタンス」といわれている。ほとんどは「オブジェクト」だけれども、「インスタンス」の時にはnewをつけることになっている。
let hour = now.getHours(); //現在時刻の「時」を呼び出したものをhourと定義する。
let minute = now.getMinutes();
if (hour < 4 && hour > 9){
document.write("おはようございます")
}else if (hour <= 9 && hour >= 18){
document.write("こんにちは")
} else if (hour > 18 || hour <= 4){
document.write("こんばんは")
}
</script>
</body>
</html>JavaScriptでこんなこともできてしまうのです！
getTime関数をつかって経過時間を調べたり、「〇〇まであと○日！」のような表示もつくれます。
getAge関数は、生まれた年を入力すると現在の年齢を返します。
ifをつなげると？・・・
ゲームが作れます。
数当てゲームです。
数学の授業で「場合分け」をした記憶がありますか？同じです。
<!DOCTYPE html>
<html>
<head>
<title>ifを使ってみる。</title>
</head>
<body>
<p id="success" style="visibility:hidden">おめでとうございます！</p>
<button id="btn" onClick="location.reload()" style="visibility:hidden">もう一度やってみる！</button>
<script>
let kazu = Number(prompt("１から１０までの値を入力してください。"));
if (isNaN(kazu)==true){ //!isNaN(kazu)にすると否定
window.alert("半角の数字で入力してください＾＾")//何も入力しなかった場合は・・・・？？？
location.reload();
}else{
if ( kazu > 5 ){
window.alert("おしい！数を小さくしてください！");
document.getElementById("btn").style.visibility = "visible";
//let reStart = location.reload();
} else if( kazu < 5 ){
window.alert("おしい！数を大きくしてください！");
document.getElementById("btn").style.visibility = "visible";
} else if( kazu == 5 ){ //else if でなく elseでもこの場合は同じ。elseと書くなら条件文はいらない。
window.alert("大正解！すばらしい直感！")
document.getElementById("success").style.visiblity = "visible"
document.getElementById("btn").style.visibility = "visible";
}
} //}else{がここで終わり。
</script>
</body>
</html>
コメント