You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在TypeScript中正确为setValue和getValue函数添加泛型类型?

问题描述

能否使用泛型为以下setValue和getValue函数进行正确的类型标注?当前代码报错是因为检测到属性存在多种类型,希望让函数根据传入的属性名,自动感知name/age属性对应的类型。

import { BehaviorSubject, Observable } from 'rxjs';

interface Person {
    age: BehaviorSubject<number>;
    name: BehaviorSubject<string>;
}

class SomeClass {
    private _somePerson:Person = {
        age: new BehaviorSubject(0),
        name: new BehaviorSubject('John')
    };

    public setValue<T>(inID: number, inProperty: keyof(Person), inValue: T): void {
        this._somePerson[inProperty].next(inValue);
    }

    public getValue<T>(inID: number, inProperty: keyof(Person)): Observable<T> {
        return this._somePerson[inProperty].asObservable();
    }

}
解决方案

可以通过泛型约束关联属性名与对应类型实现需求。核心思路是用泛型锁定具体属性名,再自动提取该属性对应BehaviorSubject的内部值类型。

修改后的代码

import { BehaviorSubject, Observable } from 'rxjs';

interface Person {
    age: BehaviorSubject<number>;
    name: BehaviorSubject<string>;
}

// 工具类型:从BehaviorSubject中提取内部值类型
type SubjectValue<T> = T extends BehaviorSubject<infer U> ? U : never;

class SomeClass {
    private _somePerson: Person = {
        age: new BehaviorSubject(0),
        name: new BehaviorSubject('John')
    };

    public setValue<K extends keyof Person>(
        inID: number, 
        inProperty: K, 
        inValue: SubjectValue<Person[K]>
    ): void {
        this._somePerson[inProperty].next(inValue);
    }

    public getValue<K extends keyof Person>(
        inID: number, 
        inProperty: K
    ): Observable<SubjectValue<Person[K]>> {
        return this._somePerson[inProperty].asObservable();
    }
}

关键说明

  • 使用泛型K extends keyof Person锁定传入的属性名,确保仅能传入Person中定义的合法属性。
  • 工具类型SubjectValue通过条件类型+类型推断,自动提取BehaviorSubject包裹的内部值类型(比如age对应number,name对应string)。
  • 调用函数时,TypeScript会根据传入的inProperty自动推导值的类型:例如调用setValue(1, 'age', '123')会直接触发类型错误,因为age要求的值类型是number。

内容的提问来源于stack exchange,提问作者cschear

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.06 03:21:02