js・jQuery【鬼練1~3】

【書き方(復習)】

⑴head内にscriptタグで囲って書く

⑵body内にscriptタグで囲って書く

⑶head,body内にscriptタグで書いて作ったjsファイルを読み込む

→基本は ⑶で書くのが当たり前

 

【鬼練1】

開発ツール(デベロッパーツール)の「console(コンソール)」タブ内に「彼女:仕事と私どっちを取るのよ!」という文字をに表示する

【答え】

console.log('仕事と私どっち取るのよ!');

【解説】

文字列には

「''(シングルクウォート)」

「""(ダブルクウォート)」

で囲えば文字として判別してくれる(外すとエラーになる)

※基本は「シングルクウォート」を使う

 

【鬼練2】

開発ツール(デベロッパーツール)の「console(コンソール)」タブ内に

「彼女:仕事と私どっちを取るのよ!」という文字をに表示させる

その次に

「自分:◯◯◯」を表示させる。

◯◯◯は変数(変数answerとする)にしておき、その変数の中身を表示させる。

変数answerには「仕事に決まってるだろ!」の文字列を入れておく。

変数answerの中身が「仕事に決まってるだろ!」だった場合には、

「彼女:あたたたたたたたっーーー!!」と

「自分:ひでぶっ!!」という文字を表示させる

 

【答え】

var answer ='仕事に決まってるだろ!';

console.log('彼女:仕事と私どっち取るのよ!');

console.log('自分:' + answer);

 

if(answer === '仕事に決まってるだろ!'){

console.log('彼女:あたたたたたたたっーーー!!');

console.log(自分:ひでぶっ!!);

}

 

【解説】

①変数answerの定義 

ーーー

var answer ='仕事に決まってるだろ!';

ーーー

箱(変数answer)を用意してその中に文字列(仕事に決まってるだろ!)を入れておく

※変数→箱(「⑴文字列」「⑵数値」「⑶種類(型)」なりが入れられる(⑵⑶が違う))

 

②文字列の連結でコンソールに表示

ーーー

console.log('自分:' + answer);

ーーー

・変数を用意したら2つのconsole.logで表示させる

・「+(プラス記号)」で文字列を「連結」させることができる

※この場合、文字列(「自分:」)と変数(answer)を連結させている

・半角スペースや改行はあってもなくても動く

 

③変数answerの中身をif文で判定する

ーーー

if(answer === '仕事に決まってるだろ!'){

console.log('彼女:あたたたたたたたっーーー!!');

console.log('自分:ひでぶっ!!');

}

ーーー

【書き方】

if(判定したい式を書く){

//「もし、〜なら」の場合に当てはまった時に実行したい処理を書く

}

 

・jsやPHPでは「==」「!=」は使わないようにする

・「===」「!==」→『厳密比較』という(値の「型」も同じかどうか?まで判定される)

※この場合、『変数answer(の中身)と文字列「仕事に決まってるだろ!」が同じ場合』という意味になる

※左辺右辺も同じ「仕事に決まってるだろ!」という値なので『型も値も同じ』になる

 

→判定結果は「true」「false」のboolean型で返ってくる

これを踏まえて・・・↓

if(true){

console.log('彼女:あたたたたたたたっーーー!!);

console.log('自分:ひでぶっ!!');

}

に変わる(内部的に変わっていて、目に見えるわけではない)

 

さらにif文は、、

判定式内が「true」の時に「{ }(波括弧)」内の処理を行う

という決まりがある

 

【鬼練3】

開発ツール(デベロッパーツール)の「console(コンソール)」タブ内に

「彼女:仕事と私どっちを取るのよ!」という文字をに表示させる

その次に

「自分:◯◯◯」を表示させる。

◯◯◯は変数(変数answerとする)にしておき、その変数の中身を表示させる。

変数answerには「仕事よりも君が大事さ。仕事はもう嫌で嫌で嫌で。。嫌で嫌で嫌で。。ほんと嫌なんだ。」の文字列を入れておく。

変数answerの中身が「仕事に決まってるだろ!」だった場合には、

「彼女:あたたたたたたたっーーー!!」と

「自分:ひでぶっ!!」という文字を表示させる

変数answerの中身が「仕事よりも君が大事さ。仕事はもう嫌で嫌で嫌で。。嫌で嫌で嫌で。。ほんと嫌なんだ。」だった場合には、

「彼女:仕事してこいやーーーーーー!!」と

「自分:ひでぶっ!!」という文字を表示させる

 

【答え】

var answer = '仕事よりも君が大事さ。仕事はもう嫌で嫌で嫌で。。嫌で嫌で嫌で。。ほんと嫌なんだ。';

console.log('彼女:仕事と私どっちを取るのよ!');
console.log('自分:' + answer);

if(answer === '仕事に決まってるだろ!'){
console.log('彼女:あたたたたたたたっーーー!!');
console.log('自分:ひでぶっ!!');
} else if (answer === '仕事よりも君が大事さ。仕事はもう嫌で嫌で嫌で。。嫌で嫌で嫌で。。ほんと嫌なんだ。') {
console.log('彼女:仕事してこいやーーーーーー!!');
console.log('自分:ひでぶっ!!');
}

 

【解説】

else if (answer === '仕事よりも君が大事さ。仕事はもう嫌で嫌で嫌で。。嫌で嫌で嫌で。。ほんと嫌なんだ。') {
console.log('彼女:仕事してこいやーーーーーー!!');
console.log('自分:ひでぶっ!!');
}

 

「else if(エルスイフ)文」

<書き方>

if(判定式){

//処理いろいろ1

}else if(判定式){

//処理いろいろ2

}

 

条件を複数に分けられる

→「もし、〜だった時にこの処理をして、もし◯◯だった時にはこっちの処理をする」

※「else」「if」には半角スペースを入れる