如何在Angular中不受参数位置限制约束TypeScript类装饰器的构造函数类型安全？

要摆脱构造函数参数位置的限制，同时保留TypeScript编译器对SomeService注入的检查，可以通过类型系统的条件判断来约束装饰器接受的类构造函数，只要构造函数参数列表中包含SomeService类型（无论位置），且类实现了ISomeInterface即可。

步骤1：定义参数类型检查的辅助类型 #

首先创建一个通用类型，用于递归判断构造函数的参数列表中是否包含指定类型：

// 检查数组类型中是否包含目标类型
type Includes<T extends any[], U> = T extends [infer First, ...infer Rest]
  ? First extends U
    ? true
    : Includes<Rest, U>
  : false;

步骤2：修改装饰器的类型约束 #

调整MyDecorator的类型定义，利用上述Includes类型检查构造函数参数是否包含SomeService，同时确保类实现ISomeInterface：

export function MyDecorator<
  T extends new (...args: any[]) => ISomeInterface
>(
  constructor: Includes<ConstructorParameters<T>, SomeService> extends true 
    ? T 
    : never
) {
  // 保留原有装饰器的业务逻辑
}

步骤3：组件中自由安排参数位置 #

现在组件的构造函数中，SomeService可以放在任意位置，只要存在该参数且类实现ISomeInterface，编译器就会通过检查：

interface ISomeInterface {
  someService: SomeService;
}

@MyDecorator
@Component({ /* 组件元数据配置 */ })
export class MyComponent implements ISomeInterface {
  constructor(
    private router: Router,
    public someService: SomeService, // 位置不再受限
    private anotherService: AnotherService
  ) {}
}

原理说明 #

• 原装饰器的类型new(someService: SomeService, ...args) => ISomeInterface强制要求第一个参数是SomeService，这是位置限制的根源。
• 新的类型约束通过Includes<ConstructorParameters<T>, SomeService>遍历构造函数的所有参数，只要存在SomeService类型就满足条件，彻底摆脱了位置依赖。
• ISomeInterface确保类实例必须拥有someService属性，结合构造函数的public修饰符（或手动赋值逻辑），保证服务实例能被正确注入并绑定到类属性。

如果组件未在构造函数中注入SomeService，TypeScript编译器会直接抛出类型错误，实现了编译时的约束检查。

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