TypeScript中为含Getter和Setter的装饰器属性定义类型

首先修正装饰器的语法错误（原代码在Object.defineProperty的配置对象内直接声明变量不符合语法规范），并添加泛型支持以约束类型：

import { Subject, Observable } from "rxjs";

export function defineDecorator<T>() {
  return (target: object, propertyKey: string) => {
    const sub = new Subject<T>();
    const obs = sub.asObservable();
    Object.defineProperty(target, propertyKey, {
      get(): Observable<T> {
        return obs;
      },
      set(value: T) {
        sub.next(value);
      },
      enumerable: true,
      configurable: true,
    });
  };
}

接下来在类中，需要通过存取器类型重载来明确属性的读写类型：读取时返回Observable<string>，赋值时接收string类型：

import { Observable } from "rxjs";

export class MyComponent {
  @defineDecorator<string>()
  get value(): Observable<string>;
  set value(v: string);
  value!: Observable<string>;
}

这样处理后，TypeScript会正确识别：

• 读取this.value时，类型为Observable<string>，可正常进行订阅操作
• 执行this.value = "test"时，允许传入string类型的值，不会触发类型错误

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