1. ホーム
  2. javascript

[解決済み] カーリーブレイスの配置によって結果が異なるのはなぜですか?

2022-05-08 02:06:16

質問

以下のコードスニペットは、なぜ この記事 中括弧の配置を1つ変えただけで、異なる結果が得られるのでしょうか?

冒頭の中括弧が { が改行されている場合。 test() が返されます。 undefined と表示され、アラートに "no - it broke: undefined" が表示されます。

function test()
{
  return
  { /* <--- curly brace on new line */
    javascript: "fantastic"
  };
}

var r = test();
try {
  alert(r.javascript); // does this work...?
} catch (e) {
  alert('no - it broke: ' + typeof r);
}

と同じ行にブレースがある場合。 return , test() はオブジェクトを返し、"fantastic" はアラートされます。

function test()
{
  return { /* <---- curly brace on same line */
    javascript: "fantastic"
  };
}

var r = test();
try {
  alert(r.javascript); // does this work...?
} catch (e) {
  alert('no - it broke: ' + typeof r);
}

解決方法は?

それがJavaScriptの落とし穴のひとつ、セミコロンの自動挿入です。セミコロンで終わっていない、しかし文の終わりである可能性がある行は自動的に終了されるので、最初の例は事実上次のようになります。

function test()
{
  return; // <- notice the inserted semicolon
  { 
    javascript: "fantastic"
  };
}

参照 Douglas CrockfordのJSスタイルガイド で、セミコロンの挿入について触れています。

2つ目の例では、(中括弧で囲まれた)オブジェクトを、プロパティ javascript とその値である "fantastic" ということで、実質的にはこれと同じです。

function test() {
    var myObject = new Object();
    myObject.javascript = "fantastic";
    return myObject;
}