# 変数したい（`var` / `let` / `const`）

```js
var a = 任意のオブジェクト

// ES6で追加
let b = 再代入できるオブジェクト
const c = 再代入できないオブジェクト
```

変数を宣言する方法は``var``、``const``、``let``の3種類があります。
``var``はどのような変数にも使うことができます。
``const``は再代入ができない変数、``let``は再代入してもよい変数に使います。

もともと``var``しかなかった世界に、``const``と``let``が導入されたみたいです。
プログラミングでは、変数のスコープは最小限にするほうがよいとされています。
なので基本は``const``か``let``を使えばよく、``var``はあまり出番がないでしょう。

:::{hint}

``const``は「定数」というイメージがあったため、**あとから書き換えることができない**ように変数を宣言するときに使うものだと思っていましたが、大きく間違っていました。
あくまで**再代入を禁止**する宣言なので、オプジェクトのプロパティは変更できます。

:::

ウェブで検索したコードは``var``や``const``/``let``が入り混じっています。
``var``になっているものは積極的に``const``に書き換えればよいでしょう。
そこで、エラーがでる場合は``let``に置きかえましょう。
そして、プログラムが動けばOKです。

## 分割代入したい

```js
const person = {
    "name": "John Doe",
    "age": 999,
}

// オブジェクトを分割代入
// - 変数名はプロパティと同じにしなければならない
const {name, age} = person;

// 新しい変数名に分割代入
// - オブジェクトのキーはプロパティと同じにする
// - 値を新しい変数名で受け取ることができる
const {name: anotherName, age: anotherAge} = person;

// 配列に分割代入
// - オブジェクトを配列で受け取ることはできない
const [name, age] = person;  // これはエラーになる
```

複数のプロパティを持つオブジェクトを、アンパックした状態で受け取ることができます。
上のサンプルだとありがたみが分かりづらいですが、
オブジェクトを返り値に持つ関数を受け取るときに便利です。

## 初期化したい（`null` / `undefined`）

```js
// 変数が空（から）である場合
let name = null;  // nullを明示的に代入
```

`null`はJavaScriptで「値が空であること」を示すための特殊な値です。
変数やプロパティに値が割り当てられていない状態を明示的に表現したい場合に使用します。

```js
// 変数名のみを定義
let name;  // undefined
```

`undefined`は、変数やプロパティが「未定義」であることを示す値です。
変数名だけを定義した場合や、関数が値を返さない場合、
存在しないプロパティにアクセスした場合などに`undefined`となります。

```js
// nullを判定したい場合
if (name === null) {
    console.log("名前の設定が null です")
};

// undefinedを判定したい場合
if (name === undefined) {
    console.log("名前の設定が undefined です");
};

// 同時に判定したい場合（例外処理）
if (name == null) {
    throw new Error("Error: 名前が設定されていません")
};

// 除外したい場合
if (name) {
    console.log(`名前が ${name} に設定されています`)
} else {
    console.log("名前の設定が null もしくは undefined です")
}
```

`null`や`undefined`はそれぞれ`===`演算子で判定します。
両方を同時に判定したい場合は`==`演算子を使います。
例外処理を発生させたい場合によく使います。

:::{note}

自分で変数を定義する場合は`null`で初期化しておけばOKです。

:::

## 型変換したい

```js
// 数値に変換
Number("123");     // -> 123（数値）
Number("123abc");  // -> NaN（変換できない）
Number(true);      // -> 1
Number(false);     // -> 0

// 文字列から数値を抽出
parseInt("42px");      // -> 42
parseFloat("3.14em");  // -> 3.14

// 文字列に変換
String(456);        // -> "456"（文字列）
String(true):       // -> "true"
String([1, 2, 3]);  // -> "1,2,3"

// 真偽値に変換
Boolean(1);        // true
Boolean(0);        // false
Boolean("");       // false（空の文字列はfalse）
Boolean("hello");  // true
Boolean([]);       // true（空の配列はtrue）
Boolean({});       // true（空のオブジェクトはtrue）

// JSON形式の文字列に変換
const data = {...};
JSON.stringify(data);

// 等価演算子／厳密等価演算子
5 == "5";     // true（暗黙の型変換）
5 === "5";    // false（暗黙の型変換されない）
```

型を変換するメソッドも多数用意されています。
JSでは**暗黙の型変換**がデフォルトになっているのですが、これは予期せぬバグを引き起こす可能性があります。
とくに等価演算子を使って条件分岐する際は、
`===`（厳密等価演算子）を使うとよいと思います。