Typescript 對象成員的內聯類型聲明

Question

在以下代碼塊中，使用<> -Notation 定義了屬性筆的類型：

return {
    ...defaultValues, 
    pens: 
      <[{penStrokeColor: string, penStrokeWidth: number, penOpacity: number}]>
      [...Array(5).keys() ].map((_)=> { 
        return {
          penStrokeColor: defaultValues.currentItemStrokeColor,
          penStrokeWidth: defaultValues.currentItemStrokeWidth,
          penOpacity: defaultValues.currentItemOpacity
        }})
  }

上面的代碼有效，但我的 linter 抱怨這個類型提示應該以不同的方式聲明：

Use 'as [{ penStrokeColor: string; penStrokeWidth: number; penOpacity: number }]' instead of '<[{ penStrokeColor: string; penStrokeWidth: number; penOpacity: number }]>'  @typescript-eslint/consistent-type-assertions

這也可以內聯完成，如果可以，怎么做？

Answer 1

正如錯誤所說 - 使用as而不是尖括號表示法來斷言類型。

return {
    ...defaultValues, 
    pens: 
      [...Array(5).keys() ].map((_)=> { 
        return {
          penStrokeColor: defaultValues.currentItemStrokeColor,
          penStrokeWidth: defaultValues.currentItemStrokeWidth,
          penOpacity: defaultValues.currentItemOpacity
        }}) as [{penStrokeColor: string, penStrokeWidth: number, penOpacity: number}]
  }

但我認為這不是你想要的——你真的想告訴 TS 創建的數組是一個tuple ，只有一個項目嗎？ 由於您要創建 5 個元素，因此您可能需要一個數組類型。

如果是這種情況，也根本不需要類型斷言 - TS 可以正確推斷出創建的數組是所需的類型。

return {
    ...defaultValues, 
    pens: [...Array(5).keys() ].map((_)=> { 
        return {
          penStrokeColor: defaultValues.currentItemStrokeColor,
          penStrokeWidth: defaultValues.currentItemStrokeWidth,
          penOpacity: defaultValues.currentItemOpacity
        };
    })
};

它在根本沒有任何 TypeScript 語法的情況下推斷出正確的類型。