JavaScriptのundefinedとnull

JavaScriptには5つの基本型(プリミティブ型)とオブジェクト型があり、基本型には数値型、文字列型、真偽値型、undefined型、null型があります。

ここでは、基本型のうちやや特殊な型であるundefined型とnull型について説明します。

undefined型

undefined型はundefinedという値のみを取り、未定義値あるいは未初期化値を表わします。

例えば、宣言されただけで初期化されていない(何も代入されていない)変数の値はundefinedとなります。undefinedが現れる例を確認しましょう。

初期化されていない

var a;                 //変数aを宣言
console.log(a);        //undefined

存在しないプロパティを参照

var b = {};           //空オブジェクトを生成
console.log(b.prop);   //undefined

実引数を渡さなかった場合の仮引数

function f(c){
    return c;
}
console.log(f());      //undefined()

return文がない関数

function g(){};        //return文がない関数を定義
console.log(g());      //undefined(return文がない場合undefinedが返される)

null型

null型はnull値のみをとる基本型です(typeof nullのように型判定するとobject型が返されますが、JavaScriptのバグと言われています)。

nullは、オブジェクトを何も参照していない状態を表わします。具体的には、オブジェクトが返される場面でそのオブジェクトが存在しない(参照されていない)場合、nullが返されます。

具体例を見てみましょう。

HTML

<div id="id_01"></div>
<ul>
    <li>List1</li>
    <li>List2</li>
</ul>

JavaScript

var ele = document.getElementById('id_02');           //存在しないidを指定
console.log(ele);                                     //null(返すべきオブジェクトがないため)

var nodelists = document.getElementsByTagName("li");  //HTML要素を取得
console.log(nodelists.item(2));                       //null(存在しないNodeListを表示しようとしたため)

このように、getElementById()で指定したidを持つ要素オブジェクトがなかった場合などでnullを返します。

undefinedとnullの共通点・相違点

内部的には、undefinedはグローバルオブジェクト(ブラウザの場合はwindowオブジェクト)のプロパティです。

条件式の中でundefined値及びnull値は偽となります(他に偽となるものに0, 空文字があります)。

undefined == nullは型変換されて真となります。ただし、undefined === nullは偽となります。


イベント

2017/12/05(火)
Design Thinking Square