JavaScript闭包实现generateID时输出undefined错误排查

问题复现 #

基于闭包编写的序列ID生成函数原代码如下：

var generateID=function() {
    var prefix="uid-";
    var count=0;

    return function(){
        count+=1;
        console.log(prefix+count)
    }
}
var create = generateID();

console.log(create());
console.log(create());
console.log(create());

预期运行结果为依次打印uid-1、uid-2、uid-3，实际运行输出如下，存在额外的undefined打印：

uid-1
undefined
uid-2
undefined
uid-3
undefined

错误原因 #

核心问题是闭包返回的内层函数没有显式返回值：

• 内层函数仅通过console.log在内部打印了拼接完成的ID，没有使用return将ID作为函数执行结果返回
• JavaScript规则中，无显式return语句的函数，执行完成后默认返回值为undefined
• 外层代码对create()的返回值再次做了console.log打印，导致每次调用会先输出内层函数打印的ID，再输出函数默认返回的undefined

修复方案 #

根据实际使用场景二选一即可，不建议混用两种逻辑：

• 方案1（推荐）：让闭包函数返回生成的ID，打印逻辑交给调用方
  这种写法的函数职责更单一，生成的ID可以直接用于后续业务逻辑，复用性更强：

  var generateID=function() {
      var prefix="uid-";
      var count=0;
  
      return function(){
          count+=1;
          // 仅返回生成的ID，不在函数内部做打印
          return prefix + count
      }
  }
  var create = generateID();
  
  console.log(create()); // 输出 uid-1
  console.log(create()); // 输出 uid-2
  console.log(create()); // 输出 uid-3
  

• 方案2：保留闭包内部的打印逻辑，外层调用时不再包裹console.log
  如果仅需要函数执行时自动打印ID，不需要获取ID值做后续处理，可以直接调用create()：

  var generateID=function() {
      var prefix="uid-";
      var count=0;
  
      return function(){
          count+=1;
          console.log(prefix+count)
      }
  }
  var create = generateID();
  
  create(); // 打印 uid-1
  create(); // 打印 uid-2
  create(); // 打印 uid-3
  

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