TypeScript装饰器类型优化：实现类型推断与编译时校验

核心需求 #

• 保留类装饰器原有正常使用逻辑（除标记为C的场景）
• 调用describe(myClass, myDecorator("a"))时，编辑器提供成员名智能提示
• describe(myClass, myDecorator("c"))在编译阶段报错，拦截非法成员名

问题根源 #

1. 类装饰器的target参数是类的构造函数，而非类实例类型T，直接把target设为T会导致类型不匹配，装饰器失效
2. describe函数的decorator参数为any，完全失去类型校验能力
3. myDecorator的泛型T未与describe的参数类型建立关联，无法自动推断

解决方案代码 #

console.clear();

// 定义类构造函数类型，适配装饰器的target参数类型
type Constructor<T = {}> = new (...args: any[]) => T;

function myDecorator<T>(someMemberName?: keyof T) {
  // 返回符合类装饰器规范的函数，target为构造函数类型
  return (target: Constructor<T>) => {
    console.log(someMemberName);
    return target;
  };
}

// 约束describe的第二个参数为针对T类型的类装饰器
function describe<T>(c: Constructor<T>, decorator: (target: Constructor<T>) => Constructor<T>) {
  decorator(c);
}

// 测试用例
@myDecorator()
@myDecorator<myClass>("a")
class myClass {
  a = 'some string';
  b = 'one more thing';
}

describe(myClass, myDecorator<myClass>("a"));
describe(myClass, myDecorator("a")); // 自动提示可选成员："a"、"b"
describe(myClass, myDecorator("c")); // 编译报错：'"c"'不属于myClass的成员名

关键修改说明 #

• Constructor<T>类型：明确类装饰器接收的是构造函数而非实例，解决原代码中将target改为T导致的装饰器失效问题
• myDecorator类型约束：返回的函数严格符合类装饰器类型规范，同时保留泛型T与成员名keyof T的关联
• describe类型强化：将第二个参数限定为对应T的构造函数装饰器，当传入myClass时，TypeScript自动推断T为myClass，从而让myDecorator的someMemberName只能是myClass的成员名，实现智能提示与编译校验

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