UnsplashのArtem Sapeginが撮影した写真

はじめに

JavaScriptの基本として、コメントの書き方や定数、変数、関数、条件分岐、ループなどをまとめた記事です。

演算子

■四則演算子

記号	内容
+	足し算
–	引き算
*	掛け算
/	割り算
%	割り算の余り
**	べき乗（2**4 =>2の4乗）

　

■比較演算子

記号	trueになる条件
==	左辺と右辺の値が等しい
===	左辺と右辺の値が等しく、データ型も同じ
!=	左辺と右辺の値が異なる
!==	左辺と右辺の値が異なる、またはデータ型が異なる
>	左辺が右辺より大きい
>=	左辺が右辺以上
<	左辺が右辺より小さい
<=	左辺が右辺以下

　

■論理演算子

記号	内容
&&	AND。(条件1 && 条件2）
||	OR。（条件１ || 条件２）
!	NOT。（!条件1）

「()」で式を囲むことで、条件を評価する順番を指定できます。

　

■3項演算子

3項演算子は「?」と「:」で区切り、以下のように書きます。

条件 ? Trueのときの処理 : Falseのとき処理;

関数

関数は以下のように定義し、呼び出します。

//定義
function 関数名(引数){
  ～処理～
  return 戻り値
}

//呼び出し（関数の戻り値を変数aに代入しています）
let a = 関数名(引数);

　

以下は三角形の面積を求める関数です。

//定義
function calcArea(height, width = 3){
  let area = height * width / 2;
  return area;
}

//呼び出し
console.log(calcArea(3,6));

※calcArea(height, width=3)の「width=3」は引数の初期値です。
　関数に引数を渡さなくても初期値を使って処理してくれます。

条件分岐

■if文

if(条件1){
  ～条件1がtrueの時の処理～
}else if(条件2){
　～条件1がfalseで条件2がtrueの時の処理～
}else{
  ～条件1も条件2もfalseの時の処理～
}

　

■switch文

switch(変数){
    case 値1:
        ～変数の値が値1の時の処理～
        break;
    case 値2:
        ～変数の値が値2の時の処理～
        break;
    default:
        ～変数の値が値1,値2でない時の処理～
}

ループ

■while文

while文は条件式がtrueの間繰り返す処理です。

while (条件) {
    ～処理～
}

　

■for文

for文は指定した回数繰り返します。

for (初期値; 条件; 増分) {
    ～処理～
}

例）

for (let i = 0; i < 10; i++){
  console.log(i);

}

　

■foreach

配列のループです。配列の要素の分だけループを繰り返します。

let items = [1, 2, 3];
items.forEach(item => {
    ～処理～
});

　

■for…in文

連想配列（オブジェクト）のループです。連想配列の要素の数だけループします。

let items = {
    "a": 1,
    "b": 2,
    "c": 3
};

for (let key in items) {
    console.log(`key:${key}, value:${items[key]}`);
}

　

■continue、break

ループの途中で次のループに移ったり、ループを抜けたくなることもあるかと思います。

その時に使うのがcontinueとbreakです。

continue：次のループに移る
break：ループを抜ける

次のように使います。

for (let i = 0; i < 10; i++){
  if(i == 3){ continue; }
  console.log(i);
}

おわりに

JavaScritpの基本をまとめているページがありましたので、リンクを載せておきます。

https://jsprimer.net/basic/