將一個object轉換為typescript中key較少的接口

Question

我有這個界面

interface Product {
    id: string
    name: string
  }

和擴展它的那個

interface AdminProduct extends Product {
    isVisible: boolean
  }

然后我有這個代碼

  const adminProducts = (await queryByCollection('product')) as AdminProduct[]

  const products = adminProducts.filter((product) => {
    if (!product.isVisible) {
      return
    }
  }).map((product)=> product as Product) as Product[]

  return products

即使我在 map adminProducts 數組中定義了產品的返回類型，它仍然包含鍵“isVisible”

如何將 object 轉換為更小的界面並刪除所有冗余鍵？

Answer 1

Typescript 僅在構建時出現，在轉譯后， tsc （打字稿編譯器）將刪除所有 typescript 類型，僅保留 javascript。
所以不能指望通過TS來操作數據。 您必須在 javascript 區域進行：

adminProducts
   .filter((adminProduct) => adminProducts.isVisible)
   .map(({isVisible, ...product}) => product)

使用此代碼，您將從列表中刪除isVisible 。