1-3. オブジェクトの型を使う

オブジェクトの型定義を学びます

JS/TS基礎 - 第1章: TypeScript基礎 - 型の基本

📚

関連する教科書第1章: TypeScript基礎 - 型の基本

課題：オブジェクトの型を使ってみよう

オブジェクトを使うと、複数の情報をまとめて扱えます。各プロパティに型を指定することで、間違った値が入るのを防げます。

やること

1.
以下のプロパティを持つオブジェクト book を作る：
- • title: "TypeScript入門"（string型）
- • price: 2980（number型）
- • inStock: true（boolean型）
2.各プロパティの値を print() で表示

オブジェクトの型定義

// オブジェクトの型定義
const person: {
  name: string;
  age: number;
} = {
  name: "太郎",
  age: 25
};

// プロパティへのアクセス
console.log(person.name);  // "太郎"
console.log(person.age);   // 25

※ ヒント：プロパティは ;（セミコロン）で区切ります。

期待される出力

TypeScript入門
2980
true

// ヘルパー関数（変更不要）
function print(value: any): void {
  const output = document.getElementById('output');
  if (output) {
    const div = document.createElement('div');
    div.style.margin = '8px 0';
    div.style.fontFamily = 'monospace';
    div.textContent = String(value);
    output.appendChild(div);
  }
}

// ここからあなたのコードを書いてください！

// 1. bookオブジェクトを作成
const book: {
  // ここに型定義を書く


} = {
  // ここに値を書く


};

// 2. 各プロパティを表示

Open Sandbox

← 前のレッスン: 1-2. 配列の型を使う

次のレッスン: 2-1. Type AliasとUnion型 →