## 対象読者

- プログラミング初心者
- JavaScript の基本構文を学びたい方
- 今すぐ JavaScript の文法を思い出さないといけない方

## JavaScript

JavaScript(JS)は、ウェブページを動的にするためのプログラミング言語
HTMLとCSSとともに、ウェブページの設計に使用されるJavaScriptは、ウェブページに動的なコンテンツを追加したり、ユーザーの操作に応じてページを変更したりするために使用される
ECMAScriptという標準仕様に基づいているため、ブラウザに依存しない
ES5以前は、ブラウザによって動作が異なることがあったが、ES6以降は、ブラウザに依存しない動作が可能になった

### JavaScriptの基本構文

### 変数

変数は、データを格納するための箱のようなもの

- var: 古いバージョンのJavaScriptで使用される(非推奨)
- let: 変数の再宣言ができない
- const: 再宣言も再代入もできない

```javascript
const x = 10;
```

### データ型

JavaScriptには、以下のデータ型がある

- string: 文字列
- number: 数値
- boolean: 真偽値
- object: オブジェクト
- function: 関数
- undefined: 未定義
- null: 空

型は以下のようにして確認できる

```javascript
console.log(typeof "Hello World"); // string
```

JavaScriptは動的型付け言語であるため、変数の型を宣言する必要はない

### 演算子

JavaScriptには、以下の演算子がある

- 算術演算子
  - +: 加算
  - -: 減算
  - *: 乗算
  - /: 除算
  - %: 剰余
- 代入演算子
  - =: 代入
  - +=: 加算代入
  - -=: 減算代入
  - *=: 乗算代入
  - /=: 除算代入
- 比較演算子
  - ==: 等しい
  - ===: 厳密に等しい
  - !=: 等しくない
  - !==: 厳密に等しくない
  - \>=: 以上
  - <=: 以下
  - \>: より大きい
  - <: より小さい
- 論理演算子
  - &&: 両方がtrueの場合にtrue
  - ||: どちらかがtrueの場合にtrue
  - !: trueをfalseに、falseをtrueに変換
- 三項演算子: (条件) ? trueの場合 : falseの場合
  - 条件分岐の短縮形

比較演算子には、==と===があるが、==は型の比較を行わないため、===を使用することが推奨される

==は、型の比較を行わないため、以下のような結果になる

```javascript
console.log(1 == "1"); // true
```

===は、型の比較を行うため、以下のような結果になる

```javascript
console.log(1 === "1"); // false
```

### 条件分岐

条件分岐は、if文を使用する
条件には、比較演算子を使用する

```javascript
if (条件) { 
    条件がtrueの場合に実行される処理 
} else { 
    条件がfalseの場合に実行される処理 
}
```

else ifを使用することで、複数の条件を指定することができる

```javascript
const x = 10;
if (x > 10) {
    console.log("xは10より大きい");
} else if (x < 10) {
    console.log("xは10より小さい");
} else {
    console.log("xは10");
}
```

### 繰り返し処理

繰り返し処理は、for文やwhile文を使用する

for文は、指定した回数だけ処理を繰り返す

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

while文は、条件がtrueの間、処理を繰り返す

```javascript
while (条件) {
    処理
}
```

### 配列

配列は、複数のデータを格納するための箱のようなもの

```javascript
const fruits = ["apple", "banana", "orange"];
```

配列の要素には、インデックスを指定することでアクセスできる

```javascript
console.log(fruits[0]); // apple
```

配列の要素数は、lengthプロパティを使用することで確認できる
配列の要素数は、0から始まるため、length - 1が最後の要素のインデックスになる
配列の要素数を使用して、for文を使用することで、配列の要素を繰り返し処理することができる

```javascript
for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}
```


脱・人海戦術

Author

Ryo Arai

Jobs

AI Engineer

Full Stack Engineer

SNS

カテゴリ

タグ

PlayGround