typescript の 合併型「Union Types」と交差型「Intersection Types」

● 合併型「Union Types」= OR

OR
指定した型のどれかにマッチすれば良い。

typeの場合

type DrinkOrFood = Drink | Food;

● 交差型「Intersection Types」 = AND

AND
指定した型の全てにマッチすれば良い。

typeの場合

type Drink AndFood = Drink & Food;

interfaceの場合

interface Drink AndFood extends Drink, Food {}

型ガード(例: data に x というプロパティがあるかどうか?)

  if ('x' in data) {
  }
No.2209
09/07 14:18

edit

typescript で オブジェクトの keys を map したときのエラーの対処方法

● typescript で オブジェクトの keys を map で回すと次のようなエラーがでます

interface MyData {
  id: number;
  name: string;
}

const myData: MyData=
  {
    id: 1,
    name: 'hoge',
  }

Object.keys(myData).map((key) => {
  console.log(myData[key]);    // ★ ここでエラー(TS7053)となります。
});

TS Playground
https://bit.ly/3KxxBgx

このようなエラーが表示されます

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'MyData'.
  No index signature with a parameter of type 'string' was found on type 'MyData'.(7053)

● 修正方法

Object.keys(myData).map((key) => {
  console.log(myData[key]);    // ★ ここでエラー(TS7053)となります。
});

 ↓ 次のように修正します

・keys が MyData の キーであることを保証する

(Object.keys(myData) as (keyof MyData)[]).map((key) => {
  console.log(myData[key]);
});

・Object.entries を使って value を直接取得する

Object.entries(myData).map(([key, value]) => {
  console.log( '● key, value' );
  console.log( `${key} : ${value}` );
})

・Object.keys が返すのは必ず string[] になります

https://stackoverflow.com/questions/59545011/object-with-generic-keys-in-typescript

No.2205
09/02 10:05

edit