javascriptの勉強しているのだけど、値がnullかどうかの判定を行うにはどうすればいいのだろうか。
上記のお悩みを解決します。
■本記事の内容
本記事で以下の内容をお伝えします。
・nullの判定処理はよく使用する
・テストするときはnullのケースを意識しよう
■本記事の信頼性
この記事を書いている私は、プログラミングを仕事として始めて10年以上ほど経ちます。今も現役のシステムエンジニアです。
JavaScriptでnullの判定の仕方を初心者向けに解説していきます。
実際のコードも記載しておりますので、参考にしてください。
なお、null判定はプログラミングでよく使用する処理なので早めに身に着けておくといいです。
javascriptのif文を用いたnullの判定方法
さっそくjavascriptのif文を用いたnull判定の方法についてお伝えします。
そもそもnullとは？
そもそもnullとは何かですが、nullは値が存在しないもしくは何もいれていませんという状態です。よく初期化するときにも使われたりします。明示的に空にしたいときとかです。
このnullと似たような意味でjavascriptにはundifinedというものがあります。
これも大きなくくりの意味では値がないという部分では同じですが、厳密には別物です。
undefinedは未定義という意味でこちらでちゃんと値を指定していないときにこの型を持つようになります。
以下のような形です。
let a = null;
let b;
console.log(a);
console.log(b);結果は以下になります。
> null
> undefinedｂのように明確に代入して指定していないときにundefinedになります。
nullの判定の仕方
nullの判定の仕方について説明していきます。
以下のif文で実現可能です。
const a = null;
if(a === null){
console.log('aはnullです。');
}もし、undefinedも条件に含めたい場合は以下のようにするだけです。
const a = undefined;
if(a == null){
console.log('aはnullかundefinedです。');
}あまり見た感じ変わってなさそうですが違いが分かりますでしょうか？
はじめはif文の中のイコールが３つ（===）でしたが、後のものは２つ（==）になります。
イコールが３つ（===）の場合は、厳密等価演算子と呼ばれ比較する値を型まで一致しているかチェックします。
イコールが２つ（===）のものは等価演算子と呼ばれ、値だけ比較するといった感じです。
他にもif文の特性上以下のような書き方もできます。
const a = null;
if(!a){
console.log('aはnullかundefinedです。');
}if文では何かしら値が入っているとtrueとなり、空だとfalseと判定されるので「==null」と書かなくても実現できたりします。
nullの判定処理はよく使用する
javascriptに限らずですが、このnullの判定はよく使用します。
例えば必須チェックとかです。
WEBアプリとかでは値が必ず入っていてほしい入力などが存在します。
よく入力フォームとかで赤字で＊だったり、必須とか書かれているものです。
値がない状態というのは、変数や引数などがnullまたはundefinedとなっていることが多いので、nullまたはundefinedの場合はエラーを表示するといったことを多々行います。
「○○を入力してください。」とかです。
ですので、先ほどお伝えしたif文の書き方を早めに理解しておくといいでしょう。
テストするときはnullのケースを意識しよう
判定とは話が変わりますが、余談でお伝えします。
自身が作成したプログラムをテストする場合は、入力にnullが入る可能性があるものはそのテストを忘れずに行いましょう。
理由としては、変数がnullであることでプログラムが異常終了するバグが起こりやすいからです。
あるあるのエラーですが、よくぬるぽとよばれたりする異常系です。
例えば以下のケースです。
const array = null;
if(array.length > 0){
console.log('配列の要素は1個以上あります。');
}分かりやすようにはじめにarrayという変数を定義していますが、このarrayが外部から入力されるものだと思ってください。
処理の内容的には、配列の方を持ったarrayの要素数が1個以上ある場合はログを出力するといった形ですが、上記を動かすとエラーになります。
なぜかと言いますとif文の中にあるarray.lengthですが、このlengthは配列の型である場合の時に使用できるものだからです。
nullの型の変数にlengthというプロパティは存在しないので、lengthなんてないです！って怒られてしまいます。以下のようなエラーです。
Error: Cannot read property 'length' of nullこのような時どうするかといいますとnullの判定処理をいれて、nullで異常終了することを回避します。
const array = null;
if(array && array.length > 0){
console.log('配列の要素は1個以上あります。');
}if文は左から順に判定していくので、arrayに値が入っているかつ要素数が１個以上あるかといった判定をすることでエラーを回避することができます。
このnullのチェックが漏れることが非常に多いので、テストする際は注意しておくとよいでしょう。
最後に
javascriptの言語でif文を用いたnull判定についてお伝えしました。
上記の内容は他のプログラミング言語でもよく実施する処理なので、今後違うプログラミング言語に挑戦するときでもここで学んだことは無駄にはなりません。
コメント