Ceeds Academy教材アプリ教材・症状語・タグで検索
索引グラフ試す
プログラミング言語▸TypeScript

TypeScript: オブジェクトと型定義(interface / type)

hands-on所要 25分最新草稿
前提: TypeScript: 関数(引数/戻り値の型・アロー関数)→次: TypeScript: ユニオン型と絞り込み(union / narrowing)
意味グラフ(この教材と内容的に近い教材・1ネスト)
例え(Analogies)
interface=記入フォームの様式

interfaceは申込フォームの「様式」。必須欄(name)が空だと受理されず、任意欄(email?)は空でもOK。形を決めて取り違えを防ぐ。

概要

📍 programming-languages ▸ TypeScript ▸ オブジェクトと型定義 | 種別: hands-on | facts_as_of 2026-06(TypeScript 6.0)

公式ドキュメント — hands-on

🎞 スライド

オブジェクトの「形」を型にする

interface / type

形を決める(テキスト図)

interface User {
id: number ← 必須
name: string ← 必須
email?: string ← ? = オプション
}

interface vs type

interface … 拡張(extends)に強い(オブジェクト向き)
type … ユニオン等に強い(柔軟)
※ オブジェクトの形はどちらでも書ける

—
出典(sources)

TypeScript Handbook (Object Types) ; TypeScript 6.0 / 2026-06確認

確認問題(Review-Questions)
id(number)とname(string)を持つUser型をinterfaceで定義せよ。コード
基礎公式
解答・解説▾ 開く

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

interface と type の使い分けを一言で。記述
基礎公式
解答・解説▾ 開く

オブジェクトはどちらも可。interfaceは拡張(extends)向き、typeはユニオン等に強い。

目次
例え概要公式ドキュメント出典確認問題
鮮度
最新
更新: 2026-06-15
次回棚卸し: 2026-12-15
周期: 6か月
版: TypeScript 6.0

概要

オブジェクトの「形」を型で定義する(interface / type)。配列・ネスト・オプションプロパティも扱う。

公式ドキュメント準拠(TypeScript 6.0)

エディタを読み込み中…
  • interface vs type:オブジェクトはどちらでも可。interface は拡張(extends)、type はユニオン等に強い。

出典: TS Handbook: Object Types

🧭 誤解訂正集

よくある誤解 正しい理解
interface と type は別物で使い分け必須 オブジェクトの形はどちらでも書ける
プロパティは全部必須 ? を付ければオプションにできる
型に無いキーも入れられる 余分なキーはエラー(型にあるキーだけ)

📖 用語

  • オブジェクト型 … { id, name } のような「形」を表す型。
  • interface … オブジェクトの形を定義する型。extends で拡張に強い。
  • type(型エイリアス) … 型に名前を付ける。ユニオン等に強い。
  • オプションプロパティ … email? のように有無を許すプロパティ。
  • 配列型 … User[] のように同じ型の並びを表す。

✅ 確認の目安(can-do)

interface と type の使い分け、必須/オプションプロパティ、配列型を区別し、**「このオブジェクトの形をどう型定義するか」**を判断できる。

⚠️ エラー復旧集

症状 原因 復旧
Property 'name' is missing 必須プロパティ不足 値を追加 or ? で任意化
Object literal may only specify known properties 余分なキー 型にあるキーだけにする