インラインでのオブジェクト型アノテーション
CoddyのJavaScriptジャーニー「Introduction To TypeScript」セクションの一部。レッスン 37/73。
時には、特定の1回限りのユースケースのためにオブジェクトの構造を定義する必要がある場合があります。再利用可能な型エイリアスやインターフェースを作成する代わりに、TypeScriptでは変数を宣言する場所で直接オブジェクトの形状を定義することができます。これはインラインオブジェクト型アノテーションと呼ばれます。
この構文では、波括弧を使用して、変数宣言の中でオブジェクトのプロパティとその型を直接記述します：
let user: { name: string; id: number } = {
name: "Alice",
id: 123
};このアプローチは、コードの他の場所で再利用する予定のない、使い捨てのオブジェクト構造に最適です。
チャレンジ
簡単以下の構造を定義するインラインオブジェクト型アノテーションを使用して、student という名前の変数を作成してください：
- 型が
stringのnameプロパティ - 型が
numberのstudentIdプロパティ - 型が
booleanのisEnrolledプロパティ
変数に以下の値を代入してください：
name:"Sarah Johnson"studentId:12345isEnrolled:true
以下の構造を定義するインラインオブジェクト型アノテーションを使用して、course という名前の別の変数を作成してください：
- 型が
stringのtitleプロパティ - 型が
numberのcreditsプロパティ - 型が
stringのinstructorプロパティ
変数に以下の値を代入してください：
title:"Introduction to TypeScript"credits:3instructor:"Dr. Smith"
以下の情報を個別の行に出力してください：
- 生徒の名前
- 生徒のID
- コースのタイトル
- 単位数
自分で試してみよう
// TODO: ここにコードを書いてください
// インラインオブジェクト型注釈を使用してstudent変数を作成します
// インラインオブジェクト型注釈を使用してcourse変数を作成します
// 必要な情報を出力します
腕試しこのレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
Introduction To TypeScriptのすべてのレッスン
2基本の型
基本の型: str, num, boolean'any' 型: 脱出ハッチ'unknown' 型'null' と 'undef' の扱い型推論の実践明示的な型アノテーションまとめ：基本の型の演習5型：エイリアス、ユニオン型、インターセクション型
プリミティブ型の型エイリアスユニオン型 ('|')ユニオン型の扱い方リテラル型インターセクション型 ('&')型エイリアスの組み合わせまとめ：高度な型の組み合わせ3データ構造：配列とタプル
型付き配列配列の 'readonly' 修飾子タプルとは？タプルの宣言とアクセスタプルの分割代入Readonly タプル多次元の型付き配列配列でのスプレッド演算子まとめ：配列とタプル6オブジェクトとインターフェースの型定義
インラインでのオブジェクト型アノテーションオブジェクトの型エイリアスインターフェース入門インターフェース vs 型エイリアスオプショナルと Readonly プロパティインターフェースと型の拡張インターフェースへのメソッドの追加まとめ：オブジェクトの構造定義自分で練習してみよう: JavaScriptオンラインコンパイラ