TypeScript中能否安全展开any类型数组的slice结果？

问题描述 #

我可以像这样转发函数的参数：

const log = (...args: Parameters<typeof console.log>) => {
  console.log(...args);
};

但如果我想拆分参数，给第一个参数加上前缀后再传递剩余参数，写成下面这样时：

const log = (...args: Parameters<typeof console.log>) => {
  console.log(`${this.name}: ${args[0]}`, ...args.slice(1));
};

lint检查会失败，报错信息如下：

972:41  error  Unsafe spread of an `any` array type  @typescript-eslint/no-unsafe-argument

请问有没有正确的实现方式？

问题原因 #

报错核心是args.slice(1)的返回类型被TypeScript推断为any[]，而@typescript-eslint/no-unsafe-argument规则禁止将any类型数组作为函数参数展开——这会绕过类型检查，带来潜在的类型安全风险。

正确实现方式 #

方法1：参数解构拆分（推荐）

直接在函数参数列表中用解构语法拆分第一个参数和剩余参数，TypeScript会自动推导剩余参数的类型，完全匹配console.log的参数要求，避免any[]的问题：

const log = (...[first, ...rest]: Parameters<typeof console.log>) => {
  console.log(`${this.name}: ${first}`, ...rest);
};

方法2：类型断言（备选）

如果必须使用slice方法，可以将返回结果断言为符合console.log参数要求的类型，明确告知TypeScript该数组是安全的：

const log = (...args: Parameters<typeof console.log>) => {
  console.log(`${this.name}: ${args[0]}`, ...(args.slice(1) as Parameters<typeof console.log>));
};

额外注意：箭头函数的this绑定问题

箭头函数不会绑定自身的this，它会继承外层作用域的this。如果你的this.name是想引用某个对象的属性，箭头函数可能无法满足需求，此时可改用普通函数：

function log(...[first, ...rest]: Parameters<typeof console.log>) {
  console.log(`${this.name}: ${first}`, ...rest);
}

这样this的指向会根据函数调用方式动态绑定。

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