こんにちは!今回は令和最初ということで、javascriptで混同されがちなnullとundefinedについて元号を例に説明してみます。

以下のような元号のオブジェクトを用いて説明していきます。 {元号: 終わった年}になってるやつ。

const era = {
  // 大正より前は省略
  showa: 1989,// 昭和は1989年まで
  heisei: 2019,// 平成は2019年まで
  reiwa: null,// 令和はまだわからん
}

Q.昭和と平成は何年まで?

昭和は1989年、平成は2019年までですね!

これをオブジェクトから取得すると...

console.log(era.showa)// 1989
console.log(era.heisei)// 2019

こう!2つとも取得できました。

Q.平成と令和は何年まで?

これもオブジェクトから取得します。

console.log(era.heisei)// 2019
console.log(era.reiwa)// null

令和はnullになりましたね!

nullとは

nullは

「存在はするが何かは分からない」

って感じです。

令和が「いつか終わること」は分かってるけど 「いつ終わるか」は分からんわけです。

平成と安久は何年まで?

こちらもオブジェクトから取得します。

console.log(era.heisei)// 2019
console.log(era.ankyu)// undefined

安久はundefinedになりました。

undefinedとは

undefinedは

「...そもそも何それ?」

って感じです。安久は予想されていた元号の一つですが 結局選ばれなかったので元号として定義されていない、即ち undefinedです。

...大体理解できたかしら?もう1問考えてみましょう。

昭和、平成、令和、安久は何年まで?(2010年時点)

上記の要素を2010年時点に取得したとしたらどうなるでしょう?

ちょっと考えてみよう

.

.

.

.

.

正解はこちら!

console.log(era.showa)// 1989
console.log(era.heisei)// null
console.log(era.reiwa)// undefined
console.log(era.ankyu)// undefined

昭和はもう終わっているので「1989」

平成はいつ終わるか分からないので「null」

令和はまだ定められてないので「undefined」

同じく安久も「undefined」です。わかったかな!?

使いどころ

諸説あるかと思いますが、 個人的にはないことを明示したい場合にnullを使って undefinedは使わないようにしてます (undefinedが出たらどっかおかしいみたいな認識でいます)

令和もよろしくな