TypeScript オブジェクト配列：インターフェース、ジェネリック型、any型、unknown型

TypeScriptでオブジェクトの配列を定義する方法

インターフェースを使ってオブジェクトの型を定義し、それを配列の型として使用することができます。

interface User {
  name: string;
  age: number;
}

const users: User[] = [
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
];

この例では、Userというインターフェースを定義し、nameとageというプロパティを持つオブジェクトを表すようにしています。

その後、usersという変数を宣言し、User型の配列として初期化しています。

ジェネリック型を使って、オブジェクトの型を動的に指定することができます。

function getObjects<T>(data: T[]): T[] {
  return data;
}

const users = getObjects([
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
]);

const numbers = getObjects([1, 2, 3]);

この例では、getObjectsというジェネリック関数を定義し、T型の配列を受け取ってT型の配列を返すようにしています。

any型を使う

オブジェクトの型がわからない場合は、any型を使うことができます。

const objects: any[] = [
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
];

any型を使うと、オブジェクトの型に関する安全性チェックがされないため、注意が必要です。

unknown型を使う

const objects: unknown[] = [
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
];

const users = objects.filter((object): object is User => {
  return typeof object.name === "string" && typeof object.age === "number";
});

TypeScriptでオブジェクトの配列を定義するには、いくつかの方法があります。

それぞれの方法にはメリットとデメリットがあるため、状況に合わせて使い分けることが重要です。

インターフェースを使う

interface User {
  name: string;
  age: number;
}

const users: User[] = [
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
];

console.log(users); // [{ name: "Alice", age: 20 }, { name: "Bob", age: 30 }]

ジェネリック型を使う

function getObjects<T>(data: T[]): T[] {
  return data;
}

const users = getObjects([
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
]);

const numbers = getObjects([1, 2, 3]);

console.log(users); // [{ name: "Alice", age: 20 }, { name: "Bob", age: 30 }]
console.log(numbers); // [1, 2, 3]

any型を使う

const objects: any[] = [
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
];

console.log(objects); // [{ name: "Alice", age: 20 }, { name: "Bob", age: 30 }]

unknown型を使う

const objects: unknown[] = [
  { name: "Alice", age: 20 },
  { name: "Bob", age: 30 },
];

const users = objects.filter((object): object is User => {
  return typeof object.name === "string" && typeof object.age === "number";
});

console.log(users); // [{ name: "Alice", age: 20 }, { name: "Bob", age: 30 }]

オブジェクトの配列を定義するその他の方法

クラスを使ってオブジェクトの型を定義し、そのクラスのインスタンスの配列を作成することができます。

class User {
  constructor(public name: string, public age: number) {}
}

const users = [
  new User("Alice", 20),
  new User("Bob", 30),
];

console.log(users); // [User { name: "Alice", age: 20 }, User { name: "Bob", age: 30 }]

Mapを使って、キーと値のペアの配列を作成することができます。

const users = new Map([
  ["Alice", { age: 20 }],
  ["Bob", { age: 30 }],
]);

console.log(users); // Map { "Alice" => { age: 20 }, "Bob" => { age: 30 } }

Recordを使って、キーと値の型を指定したオブジェクトの配列を作成することができます。

const users: Record<string, { age: number }> = {
  Alice: { age: 20 },
  Bob: { age: 30 },
};

console.log(users); // { Alice: { age: 20 }, Bob: { age: 30 } }