当返回语句和对象之间有换行符时，Javascript 函数无法返回对象？

Question

这是 jsfiddle

完整代码:

function foo1(){
    return {msg: "hello1"};
}
function foo2(){
    return
    {msg: "hello2"};
}

// output = "foo1 =  {"msg":"hello1"}"
console.log('foo1 = ' , JSON.stringify(foo1())); 

//output = " foo2 =  undefined "
console.log('foo2 = ' , JSON.stringify(foo2()));

两者之间的区别在于，在 foo2 中，{msg: 'hello'} 位于其自己的新行中。我期望解析器忽略空格？

Answer 1

tl;dr 换行符导致第二个函数中出现“未定义”。 JavaScript 在很多情况下不需要分号，只是在某些上下文中假定分号 (Automatic Semicolon Insertion)。

---

在某些情况下，为了避免这个 ASI 问题并出于美观原因，我使用所谓的 grouping operator .例如，使用 hoquet模板化 DSL(它将数组作为 s 表达式编译成 HTML)，我喜欢对数组进行分组，以便它们清楚地显示 HTML 结构:

return (
  ["ul"
  , ["li"
    , ["span", {class: "name"}, this.name]
    , ["span", {id: "x"}, "x"]
    ]
  ]
);

这对我来说似乎比

更清晰，或者更一致

return [
  "ul",
  [
    "li",
    ["span", {class: "name"}, this.name],
    ["span", {id: "x"}, "x"]
  ]
];

他们最终得到相同数量的行。但这是一个美学问题，真的。

---

分组运算符只计算其中的任何表达式。您通常会看到 Immediately Invoked Function Expressions ，您需要将通常是函数声明的内容转换为表达式，然后可以立即调用它(因此得名)。然而，分组运算符的一个可能鲜为人知的特性是它也可以采用逗号分隔的表达式列表，例如

function() {
  return (
    doSideEffects(),
    console.log("this is the second side effect"),
    1 + 1
  );
}

在这种情况下，它会计算每个表达式并仅返回最后一个 (1 + 1)。