TypeScript函数使用剩余运算符返回undefined而非数字是什么原因

错误原因 #

1. 核心问题是map方法的回调箭头函数没有正确返回计算结果：
   当箭头函数使用花括号{}包裹函数体时，必须显式编写return语句指定返回值，你当前的写法没有加return，所以每次回调执行后默认返回undefined，最终得到的就是全undefined的数组。
2. 从TypeScript类型校验的角度看，你当前代码的实际返回值类型是undefined[]，和你预期的number[]类型也不匹配，开启严格类型校验的话编译阶段就会抛出错误提示。

修复方案 #

方案1：省略箭头函数的花括号，自动返回表达式结果

这种写法适合函数体只有单条返回语句的场景，箭头会自动将后面的表达式结果作为返回值：

function multiply(multiplier: number, ...args: [number, number, number]) {
    return args.map(
        element => multiplier * element
    );
}

方案2：保留花括号，显式添加return语句

如果需要在函数体内写多行逻辑，保留花括号的同时补充return即可：

function multiply(multiplier: number, ...args: [number, number, number]) {
    return args.map(
        element => { return multiplier * element; }
    );
}

修复后运行console.log(multiply(2, 5,6,7))的输出结果为[10, 12, 14]，符合预期。

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