Javascriptの復習（2）

この記事について

Javascriptの復習（2）というタイトル通り2回目です。Javascriptの復習（1）でも書きましたが、初学者がアウトプットとして投稿した記事なので無視してください。

繰り返し処理

例えば、1~100までの数字を出力する場合、2,3行目を100回書けば出力できますが、はっきり言って非効率的です。

script.js

let number = 1;
//下の2行を繰り返せば
console.log(number);
number += 1;

繰り返し処理を用いることで短いコードで済ます事ができます。

script.js

let number = 1;
//やっている事自体は上のコードを100回繰り返すのと同じ。
while(number <= 100) {
  console.log(number);
  number += 1;
}

for文

while文以外にも繰り返し処理ができるコードの書き方があります。for文はより短く書く事ができ、括弧内で"変数の定義"、"繰り返しの条件"、"変数の更新"の全てを書きます。

script.js

let number = 1;
//左から順番に"変数の定義"、"繰り返しの条件"、"変数の更新"　セミコロンで区切る
for(let number = 1; number <= 100; number += 1) {
  console.log(number);
}

条件分岐 (if文)

ある条件が成り立つ時にだけ処理を行ないたい時に使用します。

script.js

const number = 12;
//()内が条件式で{}内が条件を満たした時と行なわれる処理です。
if(number >= 10) {
  console.log("numberは10より大きい");
}

条件を満たさなかった場合の処理を書きたいときはelseを使用します。

script.js

const number = 7;
if(number >= 10) {
  console.log("numberは10より大きい");
} else {
//条件を満たしていない時に行なわれる処理です。
  console.log("numberは10より小さい");
}

さらに条件を追加したい時はelse ifを使用します。

script.js

const number = 7;
if(number >= 10) {
  console.log("numberは10より大きい");
} else if(number >= 5) {
//ifの条件を満たしていないがelse if内の条件を満たしている時に行なわれる。
  console.log("5より大きく10より小さい")
} else {
  console.log("numberは5より小さい");
}

switch文

if文と同様に条件分岐の処理が行なえる書き方ですが、定数の値によって処理を分けたい時に使用するとif分よりもコードが短くなります。

script.js

const animal = "猫";
//括弧内に変数や定数等の条件の値を記載
switch(animal){
  case"猫"://ここはコロン
//条件の値がcaseに書いた値と一致していたら行なわれる処理
    console.log("ニャーと鳴く")；
    break;//breakで処理の終わりをハッキリさせる。
}

条件の数だけcaseを追加してください。

script.js

const animal = "猫";
//括弧内に変数や定数等の条件の値を記載
switch(animal){
  case"猫"://ここはコロン
    console.log("ニャーと鳴く")；
    break;//breakで処理の終わりをハッキリさせる。
  case"犬"://しつこいけどここはコロン
    console.log("ワンと鳴く")；
    break;
  case"カラス"://コロン!!
    console.log("カァーと鳴く")；
    break;
}

どの条件にも該当しない時の処理は、default以下に書きます。

script.js

const animal = "猫";
//括弧内に変数や定数等の条件の値を記載
switch(animal){
  case"猫"://ここはコロン
    console.log("ニャーと鳴く")；
    break;//breakで処理の終わりをハッキリさせる。
  case"犬"://しつこいけどここはコロン
    console.log("ワンと鳴く")；
    break;
  case"カラス"://コロン!!
    console.log("カァーと鳴く")；
    break;
  default:
//if文のelseのようなもの
    console.log("そのような動物は存在しません。");
    break;
}

複数の条件の書き方（and と or）

括弧内に複数の条件を書く方法があります。

script.js

const number = 53;
//&&を挟むと両方の条件を満たした時に処理が行なわれる条件式になる(andの条件)。
//||を挟むと片方の条件を満たしていれば処理が行なわれる(orの条件)。
if(number >= 10 && number < 100) {
  console.log("numberは2桁です");
} else {
  console.log("numberは1桁です");
}

　感想

既にRubyを学習した後だったお陰かすんなりと頭の中に入った。
この勢いでJavaScriptの全容を把握できたらいいなと思います。