type とオプショナルプロパティ

導入

型に名前を付ける方法は interface のほかに type（型エイリアス）もあります。また、「あってもなくてもよいプロパティ」は ? を付けて表します。

説明

type は型に別名を付けるしくみです。オブジェクトの形だけでなく、ユニオン型などにも名前を付けられます。

type Point = { x: number; y: number };
type Direction = "up" | "down" | "left" | "right";

let p: Point = { x: 10, y: 20 };
let d: Direction = "up";
console.log(p.x, p.y, d);

プロパティ名のうしろに ? を付けると、そのプロパティは省略可能になります。

type Profile = {
  name: string;
  nickname?: string;   // あってもなくてもよい
};

let a: Profile = { name: "太郎" };                 // OK（nickname なし）
let b: Profile = { name: "花子", nickname: "はな" }; // OK
console.log(a.nickname);   // undefined
console.log(b.nickname);   // はな

interface と type はどちらもオブジェクトの型に使えます。ユニオン型などにも名前を付けたいときは type、オブジェクトの形を素直に表すなら interface、と使い分けられます。

やってみよう

Profile の a に a.nickname = "たろ"; を足してから console.log(a.nickname) してみましょう。

演習

Item という type を作ってください。name（string）と、省略可能な note（string）を持ちます。note を付けずに let x: Item = { name: "箱" }; を宣言し、console.log(x.note) を表示してください（undefined と出ます）。