JavaScript: nullとundefinedの違い

このページではJavaScriptでの null と undefined の違いについて説明します。

null も undefined もどちらも「値がない」ことを表す値なのですが、 その意味合いは異なります。

わかりやすいように変数を例に説明してみます。次のコードを見てください


// 変数a: 意図をもってnullを入れている
var a = null;
console.log(a);  // null

// 変数b: 初期化されていない(値が代入されていない)
var b;
console.log(b);  // undefied

変数aは、意図を持って null を代入して「値がない」ことを示しています。
それに対して変数bは、初期化されていない(値が代入されていない)から「値がない」だけです。

つまり、意図を持って値がないことを意味するのが null。 値が代入されていないことを意味するのが undefined です。

変数に限って言えば、null と undefied の違いは上記のようになります。


もう少し詳しく見ていきましょう

nullは「値がない」ことを表す特殊な値です。 数値や文字列に対しても同じように使われます。

他のプログラム言語でも同じように「値がない」ことを表す値があります。 言語によって違いますが、通常は null や nil が使われます。

特にデータベースを操作する言語・SQL 等で、 データが無いことを示す値として null がよく使われます。

そしてJavaScriptでは「値がない」ことを表す値が null の他にもう1つあり、それが undefined です。 undefined は日本語では「未定義」と訳されます。

undefinedとなるのは変数だけではなく、次のように複数のケースがあります。

  • 初期化されていない(値が代入されていない)変数の値
  • 存在しないオブジェクトのプロパティを読み出そうとしたときの値
  • 存在しない配列の要素を読み出したときの値
  • 戻り値のない関数が返す値
  • 関数を呼び出す時に値が指定されていない引数の値

null も undefined もどちらも「値がない」ことを表すので、同じものとしても扱えますし、 別々のものとして区別して扱うこともできます。

等値演算子「==」を使って比較すると両者は同じものとして扱われます。 同値演算子「===」を使って比較すると両者は違うものとして扱われます。 自分が望む処理によって演算子を使い分けます。

undefined は「初期化されていない変数の値(値が代入されていない)」であったり、 「存在しないオブジェクトのプロパティを読み出そうとしたときの値」 という点では、ある意味エラーに近いとも言えます(エラーではありませんが)。

一方 null は意図をもって「値がない」ことを表していますので全くエラーではなく、正常な処理です。 ですから「値がない」ことを設定したい場合は「null」を使います。

サンプルプログラム

初期化されていない変数、存在しない配列の要素を読み出した場合の例を表示します。 どちらも undefined と表示されます。

var a;

console.log(a);       // undefined

var arr = [1,2,3];

console.log(arr[5]);  // undefined

次のプログラムは null と undefined を等値演算子「==」と同値演算子「===」で 比較しています。前者がtrue、後者がfalseを返していることを確認してください。

var a = null;
var b;

// 等値演算子
if(a == b){
    console.log("TRUE");
}else{
    console.log("FALSE");
}

// 同値演算子
if(a === b){
    console.log("TRUE");
}else{
    console.log("FALSE");
}

// 実行結果
TRUE
FALSE

ツール・書籍紹介

まとめ・一覧

基本編

数値

文字列

正規表現

日付・時刻

配列

関数

オブジェクト指向

DOM操作

API

便利な小技集

用語

実践編

関連サイト