Question

以下是Knockout的subscribable的定义的简化版本：

export type SubscriptionCallback<T = any, TTarget = void> = (this: TTarget, val: T) => void;

export interface Subscription {
    dispose(): void;
}

export interface SubscribableFunctions<T = any> extends Function {
    init<S extends Subscribable<any>>(instance: S): void;

    notifySubscribers(valueToWrite?: T, event?: string): void;

    // This definition is wrong
    subscribe<TTarget = void>(callback: SubscriptionCallback<Array<ArrayChange<T>>, TTarget>, callbackTarget: TTarget, event: "arrayChange"): Subscription;

    subscribe<TTarget = void>(callback: SubscriptionCallback<T, TTarget>, callbackTarget?: TTarget, event?: "change"): Subscription;
    subscribe<X = any, TTarget = void>(callback: SubscriptionCallback<X, TTarget>, callbackTarget: TTarget, event: string): Subscription;

    extend(requestedExtenders: ObservableExtenderOptions): this;
    extend<S extends Subscribable<any>>(requestedExtenders: ObservableExtenderOptions): S;

    getSubscriptionsCount(event?: string): number;
}

export interface Subscribable<T = any> extends SubscribableFunctions<T> { }

export interface ArrayChange<T = any> {
    status: "added" | "deleted" | "retained";
    value: T;
    index: number;
    moved?: number;
}

问题是arrayChange事件的回调定义错误。首先，arrayChange事件仅在T是一个数组（例如X[]）时才适用。然后，ArrayChange接口使用的值必须是X类型，而不是X[]。

仅当arrayChange是一个数组并且能够提取基础类型时，如何才能包含T事件签名？

Answer 1

您可以使用条件类型从数组中提取项目。为了将数组重载的可用性限制为仅在T类型为数组时，我们可以为this参数添加类型注释。仅当调用目标符合this参数类型施加的约束时，该方法才可用。

export type SubscriptionCallback<T = any, TTarget = void> = (this: TTarget, val: T) => void;

export interface Subscription {
    dispose(): void;
}

// The conditional type that extracts the array item if T is an array
type ItemIfArray<T> = T extends Array<infer U> ? U : never;

export interface SubscribableFunctions<T = any> extends Function {
    init<S extends Subscribable<any>>(instance: S): void;

    notifySubscribers(valueToWrite?: T, event?: string): void;

    // this must be something compatible with  SubscribableFunctions<any[]> which should mean a SubscribableFunctions where T is an array 
    subscribe<TTarget = void>(this: SubscribableFunctions<any[]>, callback: SubscriptionCallback<Array<ArrayChange<ItemIfArray<T>>>, TTarget>, callbackTarget: TTarget, event: "arrayChange"): Subscription;

    subscribe<TTarget = void>(callback: SubscriptionCallback<T, TTarget>, callbackTarget?: TTarget, event?: "change"): Subscription;
     // since the last overload has the event of type string it allows invocation with arrayChange so I removed it to get the error below, not 100% sure if keeping this overload is a good idea. 
    //subscribe<X = any, TTarget = void>(callback: SubscriptionCallback<X, TTarget>, callbackTarget: TTarget, event: string): Subscription;
    getSubscriptionsCount(event?: string): number;
}

export interface Subscribable<T = any> extends SubscribableFunctions<T> { }

export interface ArrayChange<T = any> {
    status: "added" | "deleted" | "retained";
    value: T;
    index: number;
    moved?: number;
}

let a: Subscribable<number>
a.subscribe(() => { }, void 0, 'arrayChange') //err overload not available for this type parameter 


let ar: Subscribable<number[]>
ar.subscribe(a => a[0].value.toExponential() , void 0, 'arrayChange') //ok

在定义中，仅当泛型类型为数组时，才需要特定的方法签名

1 个答案: