JavaScript中带return与不带return的函数哪种写法更优？

实际开发中优先推荐使用带return的第二种写法，第一种无return的写法仅适合写一次性的临时测试demo，完全不适合正式项目使用，核心原因如下：

• 函数复用性差距极大
  第一种写法把「弹出输入框获取用户里程」「计算出行费用」「控制台打印结果」三个完全独立的逻辑全部耦合在同一个函数里，核心的费用计算逻辑根本没法单独复用。如果后续你需要从页面输入框、后端接口等其他来源获取里程值计算费用，或者需要把计算结果渲染到页面、存入本地缓存、传给其他接口做后续处理，第一种写法完全做不到——它既写死了输入来源必须是prompt弹窗，又没有把计算结果返回，你根本拿不到计算值做后续操作。
  第二种写法把费用计算逻辑抽成了独立的、带return的函数，这个计算函数不关心输入的km是从哪来的，只要传里程值进去就能返回计算结果，不管后续交互逻辑怎么改，计算部分的代码可以直接复用。
• 可维护性、可测试性差距明显
  带return的计算函数是典型的纯函数：相同输入永远返回相同输出，执行过程不会修改外部变量、不会触发弹窗/打印/请求这类额外副作用。排查问题的时候你只需要传不同的里程值进去，看返回结果对不对就能快速定位计算逻辑有没有错，写自动化测试也非常简单。
  第一种无return的函数执行时会连带触发一堆副作用，测试的时候需要额外模拟prompt输入、拦截console输出才能验证计算逻辑是否正确，代码规模变大之后，这种混了多类逻辑的函数排查bug的成本会高很多。
• 符合通用的代码设计原则
  正式项目里写函数的通用思路就是：纯计算逻辑和带交互、副作用的逻辑分离，计算类函数统一通过return返回结果，不要在计算函数里掺杂输入输出操作。

你给出的两段示例代码参考：
无return的耦合写法：

function calculatingExpenses() {
  let km = prompt("How far is your target");
  let partialExpenses = 1.65;
  const wholeExpenses = km *= partialExpenses;
  console.log(wholeExpenses);
}

带return的拆分写法：

function wholeFunction() {
    function calculatingExpenses(km) {
      return km * 1.65;
    }
    const km = prompt("How far is your target?");
    const wholeExpenses = calculatingExpenses(km);
    console.log(wholeExpenses);
}

额外提个小注意点：prompt返回的结果是字符串类型，虽然做乘法时JS会做隐式类型转换，但正式写的时候最好先显式转成数字类型再计算，避免出现意外的字符串拼接问题。

内容的提问来源于stack exchange，提问作者65 sami