typescript - 使用类型函数从混合数组返回特定​​类实例

Question

是否可以使用类型函数从混合数组中检索特定类型？

public plugins: (Tool|Service)[] = [];
getTools(): Tool[]{
    return this.plugins.filter(t => t instanceof Tool);
}

到目前为止，我没有运气。打字稿正在抛出以下消息

  

TS2322：类型'（工具|服务）[]'不能分配给'工具[]'类型。 “服务”类型中缺少属性“onclick”。

有什么办法可以在这里设置函数类型Tool[]吗？

以下是完整代码：

interface Required {
    id: string
    title: string
    owner: string
    type: 'user' | 'admin'
}

class P {
    id; title; owner; type;
    constructor(config: Required){
        this.id = config.id || 'uniqid';
        this.title = config.title || 'Title';
        this.owner = config.owner || 'user';
        this.type = config.type;
    }
}

interface ToolRequired extends Required{
    onclick: () => void
}

class Tool extends P {
    onclick;
    constructor(config = {} as ToolRequired){
        super(config);
        this.type = 'tool';
        this.onclick = config.onclick
    }
}

class Service extends P {
    constructor(config = {} as Required){
        super(config);
        this.type = 'service'
    }
}

class Storag {
    static types = {
        tool: Tool,
        service: Service,
        undefined: Tool,
    };
    public plugins: (Tool|Service)[] = [];
    setPlugin(config = {} as Required){
        const Type = Storag.types[config.type];
        this.plugins.push( new Type(config) );
    }
    getTools(): Tool[]{
        return this.plugins.filter(t => t instanceof Tool);
    }
}

Answer 1

最后加上as Tool[]。

public plugins: (Tool|Service)[] = [];
getTools(): Tool[]{
    return this.plugins.filter(t => t instanceof Tool) as Tool[]; // << here
}

你需要这样做的原因是因为Typescript编译器不够聪明，不知道当你做这样一个过滤器时它只会 返回Tool。任何数组上的.filter将通常返回与前一个数组相同的类型，这是编译器在此假设的 - 一个Tool|Service数组。

然而，编译器很聪明，知道Tool|Service可以减少到只有Tool s - 因此，你可以在最后做一个as Tool[]来告诉编译器I know what I'm doing - the type that ".filter" returns will only be Tools here，编译器将监听并尊重它。

您可以在此处详细了解as关键字：https://www.typescriptlang.org/docs/handbook/basic-types.html（向下滚动或搜索“类型断言”）。