React应用迁移TypeScript时无参调用Array.fill触发参数报错的解决方法

TS 较新版本对Array.prototype.fill()的类型定义做了收紧，要求该方法调用时必须至少传入1个填充值参数；而原生JS运行时其实允许不传参，此时默认用undefined填充数组空位，这个运行时行为和TS的类型校验规则存在差异，才触发了报错。代码本身的运行逻辑没有问题，只是不满足当前TS的严格类型要求。

代码重构（推荐） #

这类方案不需要调整TS编译规则，不会降低项目整体的类型校验严格度，是React应用向TS迁移过程中的优先选择，一共有两种等价的落地写法：

• 最小改动方案：把原代码中空参调用的.fill()显式补充为.fill(undefined)，和原生JS不传参的运行时行为完全一致，无任何逻辑副作用
• 更简洁的优化方案：替换为Array.from生成连续数组，从根源上省去fill步骤。Array.from生成的是无空位的连续数组，不会出现稀疏数组跳过遍历项的边界问题，整体逻辑比“生成稀疏数组+填充+遍历”的链路更简洁可靠

最小改动的代码实现：

const weekNumber = [
    ...Array(CURRENT_WEEK_NUMBER)
      .fill(undefined)
      .map((_, i) => i + 1)
];
const weekLabels = [
    ...Array(17)
      .fill(undefined)
      .map((_, i) => i + 1),
    'Playoffs: Wild Card',
    'Playoffs: Divisional Round',
    'Playoffs: Conference Championship',
    'Playoffs: Super Bowl'
];

优化后的代码实现：

const weekNumber = [
    ...Array.from({ length: CURRENT_WEEK_NUMBER }, (_, i) => i + 1)
];
const weekLabels = [
    ...Array.from({ length: 17 }, (_, i) => i + 1),
    'Playoffs: Wild Card',
    'Playoffs: Divisional Round',
    'Playoffs: Conference Championship',
    'Playoffs: Super Bowl'
];

TS配置调整（不推荐生产环境使用） #

目前TS没有单独的开关可以精准跳过“fill方法未传参”这一类校验。该报错属于TS核心的函数参数数量校验规则，调整配置会连带放宽其他类型校验要求：

• 可以通过设置strict: false关闭全量严格校验，此时不会再提示参数缺失，但会直接失去null检查、隐式any检查等核心类型保护能力，极易引入线上运行隐患
• 不建议为了单处代码的报错关闭全局类型校验，迁移过程中遇到这类类型规则与原生JS行为的差异，优先做代码适配的长期收益远高于配置调整

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