WEB

JavaScriptで`undefined`の代わりに、`void 0`を使ったほうがいい理由

JavaScriptで`undefined`の代わりに、`void 0`を使ったほうがいい理由

今まで平気でundefinedを使ってましたが、underscore.jsのソース読んで、無防備にundefinedを使っちゃいけないなってことを初めて知りました。いやはや、まったくもって面目ない!
知っている方なら知っていると思いますが、意外と知らない方も多いのでは?という意味でのプチ記事です。

void 演算子

voidは1つの式を取って、常にundefinedを返す演算子です。
例えば

void 0
void (0)
void 99
void "wow"
void {}
//すべてundefinedが帰ってくる

と、このように、voidはundefinedの代わりとして使えるのが分かりますよね。

`undefined`の代わりに、`void 0`を使ったほうがいい

上記の理屈で行くと、そんな面倒なことをするまでもなく、undefinedを直接使えば済む話じゃあ?と思いますよね。ところが話はそう簡単ではないようです。
何故なら、なんと、undefined はただのグローバル変数だからです。例えば、こんなことだって可能です。

alert(undefined); // "undefined"
var undefined = "こんにちは";
alert(undefined) // "こんにちは"

自分の意思でundefinedを自由に書き換えることができるのだ!つまり、undefinedは常にundefinedである保証はどこにもないから、undefinedを使うのを避けるべきとうことです。
対して、void演算子を使えば、常に本当のundefinedを返すので、安全です。
以下の例を見て貰えれば分かると思います。

function test () {
	var undefined = true; //undefinedを上書き

	if(undefined){
		console.log( 'undefined: ' + undefined );
	}

	if(void 0 ){
		console.log( '決して実行されない' );
	}
}

test();

どうして `void 0` って書くの?

void 1void “foo”void {why:true}を使っちゃダメ?
なんでわざわざvoid 0を使うの!?
答えは決まっている!もちろん、0以外を使っても構いません!強いて言えば、そういうしきたり?それとも書きやすいから?別に0にする必要はないので、何を使おうが自分の自由です。

voidを使わずにundefinedを獲得する方法

他にもこんな方法があります。

(function(a,b,undefined){
	console.log(undefined)
})(1,2);

これはjQueryのソースでも使われている手法です。無名関数をその場で実行し、実引数には1,2しか渡していないのに、仮引数のほうではa,b以外に、もう一つundefinedという最初から渡されないと仮定した仮引数をセットすることで、安全にundefinedを獲得している。実にエレガントな書き方ですね!

また、ちょっとひねくれたやり方なら、

var udf = [][0];
console.log(udf)

限りなく非エレガントですけど、これでもいけますよねww

最後に

普段書く分には別にundefinedでもいいかなと思ってしまいそうですが・・・これはいけないですよね~
あらゆる可能性を考慮に入れ、すべてのシチュエーションに対応し、エラーが起きる確率がたとえほんのわずかでもあるなら、決して見過ごさない。それがrobustなコードを書くための必須条件ですからね。

この記事を書いた人

王
バックエンドエンジニア 2012年入社
LIGの王です。ウェブの全てを学ぶ為、中国は四川省より日本にやってきました。王という名に恥じぬよう、ウェブ業界のKINGとなるべく日々頑張っております。よろしくお願いいたします。