typescript 为什么TS中相同领域的不同接口兼容

kb5ga3dv  于 2023-08-07  发布在  TypeScript
关注(0)|答案(2)|浏览(115)

我有两个接口:

export interface IProductInCartBody {
  count: number;
  variantId: string;
}

export interface IProductInCart {
  id: string;
  variantId: string;
  name: string;
  price: number;
  count: number;
}

字符串
为什么我在这一行没有错误:
第一个月
我想我都试过了)

bxfogqkk

bxfogqkk1#

你不会在那一行得到错误,因为TypeScript允许你在某些情况下执行类型Assert,即使类型不完全相同。
在这种特定情况下,类型AssertproductsInTheCart as IProductInCart[]告诉TypeScript将productsInTheCart变量视为IProductInCart对象的数组,即使其声明的类型是IProductInCartBody[]
TypeScript允许这种类型Assert,因为IProductInCartBody具有IProductInCart属性的子集,即count和variantId。
当您将IProductInCartBody数组分配给IProductInCart[]类型的变量时,TypeScript会推断数组中的每个元素至少具有IProductInCart所需的属性。
其他属性,如idnameprice,对于TypeScript验证赋值是不必要的。

yruzcnhs

yruzcnhs2#

因为IProductInCartBody定义了一个满足接口契约的对象必须有一个number类型的属性count和一个string类型的属性variantId
由于IProductInCart类型的ab对象满足了这两个条件,因此它满足了这个契约(=接口),因此您可以分配值。
换句话说,IProductInCartIProductInCartBody更具体。您也可以按如下方式定义接口,这样更容易理解:

export interface IProductInCartBody {
  count: number;
  variantId: string;
}

export interface IProductInCart extends IProductInCartBody {
  id: string;
  name: string;
  price: number;
}

const productInCart: IProductInCart = {
    id: "1",
    name: "Product 1",
    price: 20,
    count: 2,
    variantId: "1"
}

const productInCartBody: IProductInCartBody = productInCart;

字符串
参见TypeScript docs on type compatibility

相关问题