为何JavaScript函数func1返回对象而func2返回undefined？

嘿，这个问题问到点子上了！作为天天跟JavaScript打交道的开发者，我来给你掰扯清楚函数返回undefined的各种场景，再专门拆解你提到的func1和func2的差异～

日常写代码时，函数返回undefined主要有这几种情况：

• 没写return语句：函数执行完所有逻辑后，默认就会返回undefined，这是最普遍的情况。比如：

  function greet() {
    console.log("Hello!");
  }
  console.log(greet()); // 输出undefined
  

• 写了return但没带值：哪怕你写了return关键字，后面不跟任何表达式，结果也是undefined。比如：

  function justReturn() {
    return;
  }
  console.log(justReturn()); // 输出undefined
  

• 显式返回undefined：这种一般是刻意为之，但也算返回undefined的场景：

  function returnUndefinedOnPurpose() {
    return undefined;
  }
  

• 箭头函数的省略return陷阱：如果箭头函数用大括号包裹但没写return，或者表达式本身就是undefined，都会返回undefined。比如const doNothing = () => {}，或者const giveUndefined = () => undefined。
• 分支逻辑没覆盖所有情况：比如函数里只有部分条件分支有return，其他分支没处理，那进入这些分支时就会默认返回undefined：

  function getStatus(isActive) {
    if (isActive) {
      return "active";
    }
    // 当isActive为false时，这里没return，返回undefined
  }
  console.log(getStatus(false)); // 输出undefined
  

先假设你说的func1和func2是这种常见的面试题写法：

// func1：返回对象
function func1() {
  return {
    name: "test"
  };
}

// func2：返回undefined
function func2() {
  return
  {
    name: "test"
  };
}

问题的核心在于JavaScript的自动分号插入（ASI）机制——JS会在某些情况下自动帮你补充分号，而这里就补错地方了！

• 对于func1：return后面直接跟着对象字面量{ name: "test" }，JS会把它们当成一个完整的表达式，所以return会正确把这个对象返回出去。
• 对于func2：你把return和对象字面量拆成了两行，JS看到return单独占一行，就会自动在return后面插入分号，相当于代码变成了这样：

  function func2() {
    return; // 自动插入的分号，函数到这里就结束了
    {
      name: "test" // 这变成了一个独立的代码块，根本不会被执行
    };
  }
  

  这样一来，func2执行到return就直接结束了，后面的对象块完全是无效代码，自然返回undefined。

要避开这个坑，记住两个小技巧：要么把return和返回的对象写在同一行，要么用括号把返回的表达式包起来，比如：

// 写法1：同一行
function func2Fixed1() {
  return { name: "test" };
}

// 写法2：用括号包裹
function func2Fixed2() {
  return (
    {
      name: "test"
    }
  );
}

这样JS就不会乱插分号了，函数就能正确返回对象啦！

内容的提问来源于stack exchange，提问作者Trey Zhong