読者です 読者をやめる 読者になる 読者になる

WEBエンジニア奮闘記

日々の業務から思ったこと、学んだことを書き連ねていきます。

JavaScriptのobject型の+,-について

JavaScript エンジニア プログラミング 備忘録

素朴な疑問

突然だが、

[] + [];

これの結果が分かる、または知っとる人おる?
答えは""(空文字)なんですよ。

[] - [];

これの結果はまだ予想ができる。もちろん答えは0ですわ。
やっぱり前者の+の時の結果がよく分からんので、調べてみた。

いろいろいじる

普通に考えたら[]の型はobjectだと思うが、とりあえず[]の型を確認。

<実験1>

typeof([]);

<結果>
"object"

ふむ、やっぱり間違っていない。
おそらく[]は暗黙的に文字列型に変換されてる? ほいじゃあ次は、{}について。

<実験2>

typeof([]);
{} + {};
{} - {};

<結果>
"object"
NaN
NaN

んーむ、どうやら同じobjectでも{}は暗黙的に数値型に変換されてる?
では[], {}を組み合わせてみるとどうなるか見てみる。

<実験3>

[] + {};
{} + [];
[] - {};
{} - [];

<結果>
"[object Object]"
0
NaN
-0

ん?ちょっと待てよ?

<実験4>

typeof( [] + [] );
typeof( {} + {} );
typeof( [] - [] );
typeof( {} - {} );

typeof( [] + {} );
typeof( {} + [] );
typeof( [] - {} );
typeof( {} - [] );

<結果>
"string"
"string"
"number"
"number"

"string"
"string"
"number"
"number"

あーつまり、+のときは文字列型に変換し、-のときは数値型に変換されているってことか。
ということは、

<実験6>

[] + [];
[1] + ['test']
"" + "";
[2] + [3,4];
"test" + [5];

<結果>
""
"1test"
""
"23,4"
"test5"

なるほど、結構すっきりした!冒頭の[] + []は実験6の3行目の"" + ""と同じってことか。
 
しかし、実験3の結果が謎だ…

終わりに

JavaScriptという言語を本格的に勉強し始め、いろいろ触ってみると、結構不思議な動きをするなーと思うことが多い。
それが自分としては魅力のひとつだったりする。また何かあったら更新しまーす。

 
PS. どなたか実験3の解説をしてくださる方いましたら、ぜひご教示頂けますと幸いです。