Question

我是打字稿新手。在这里，我有下面的代码，类似，

interface FirstOriginal {
  active: boolean;
  status: boolean;
}

interface Product {
  id: number;
  name: string;
  Original: FirstOriginal;
}

interface MainProduct {
  id: number;
  Name: string;
  Original: Product;
}

class MainService {
  buildproduct = memoize((products: Array<Product | MainProduct>, ismain) => {
    const group = _.groupBy(products, (bsp: Product) =>
      !ismain
        ? bsp?.Original?.active ?? undefined
        : bsp?.Original?.Original?.active ?? undefined
    );
  });
}

现在，我无法执行bsp?.Original?.active ?? undefined : bsp?.Original?.Original?.active ?? undefined。因为我只能在一个界面上做到这一点，所以任何人都可以帮助我。喜欢，

如何将这两个接口用于同一个类函数。

谢谢。

Answer 1

要指定可选的属性或参数，可以在属性/参数名称前使用?。

例如：

memoize((products?: Array<Product | MainProduct>, ismain?:number) {
}

或

interface Product {
  id?: number;
  name?: string;
  Original?: FirstOriginal;
}

另一种方法是使用[Partial][1]。 Partial将返回给定接口的所有子集。

memoize((products?: Array<Partial<Product | MainProduct>>, ismain?:number) {
}

Answer 2

在这里！接口在javascript上不存在。即使您可以在执行时解决所有编译错误，javascript也无法分辨出哪一个。如果我们想知道是什么样的等等，我们需要添加javascript。这就是为什么我创建了Imp类的原因。

import { groupBy, memoize } from "lodash";
import { MainOrNot } from "./tril";

interface FirstOriginal {
    active: boolean;
    status: boolean;
}

interface MainProduct {
    id: number;
    Name: string;
    Original: Product;
}

interface Product {
    id: number;
    name: string;
    Original: FirstOriginal;
}

class FirstOriginalImp implements FirstOriginal {
    active: boolean;
    status: boolean;
    public constructor(data: FirstOriginal) {
        Object.assign(this, data);
    }
}

class ProductImp implements Product {
    id: number;
    name: string;
    Original: FirstOriginal;

    public constructor(data: Product) {
        Object.assign(this, data);
    }
}

class MainProductImp implements MainProduct {
    id: number;
    Name: string;
    Original: Product;

    public constructor(data: MainProduct) {
        Object.assign(this, data);
    }
}

export type MainOrNot = MainProductImp | ProductImp;

class MainService {
    buildproduct = memoize((products: Array<MainOrNot>, ismain: boolean) => {
        const group = groupBy<MainOrNot>(products, (bsp) => {
            if (bsp instanceof MainProductImp) {
                return bsp?.Original?.Original?.active ?? undefined;
            }

            if (bsp instanceof ProductImp) {
                return bsp?.Original?.active ?? undefined;
            }
        });
    });
}

如何在or条件下使用打字稿的界面

2 个答案: