オブジェクトの型エイリアス
CoddyのJavaScriptジャーニー「Introduction To TypeScript」セクションの一部。レッスン 38/73。
TypeScriptでは、オブジェクトの再利用可能な形状を定義する型エイリアスを作成できます。
型エイリアスは、オブジェクト構造の定義に名前を付けるために type キーワードを使用します。一度定義すると、その特定のオブジェクトの形状が必要な場所であればどこでも、このエイリアスを使用できます。
type Product = {
name: string;
price: number;
inStock: boolean;
};
let laptop: Product = {
name: "Gaming Laptop",
price: 1299,
inStock: true
};
let phone: Product = {
name: "Smartphone",
price: 699,
inStock: false
};チャレンジ
簡単以下のプロパティを持つオブジェクトのための、Book という名前の型エイリアスを作成してください:
string型のtitlestring型のauthornumber型のpagesboolean型のisAvailable
以下のプロパティを持つオブジェクトのための、Movie という名前の型エイリアスを作成してください:
string型のtitlestring型のdirectornumber型のdurationstring型のrating
作成した型エイリアスを使用して、以下の変数を作成してください:
- title が
"The Great Gatsby"、author が"F. Scott Fitzgerald"、pages が180、isAvailable がtrueである、Book型のnovelという名前の変数を作成します。 - title が
"TypeScript Handbook"、author が"Microsoft"、pages が450、isAvailable がfalseである、Book型のtextbookという名前の変数を作成します。 - title が
"Inception"、director が"Christopher Nolan"、duration が148、rating が"PG-13"である、Movie型のfilmという名前の変数を作成します。
Book 型のパラメータを受け取り、"[title] by [author] - [pages] pages" という形式の string を返す、getBookInfo という名前の関数を作成してください。
Movie 型のパラメータを受け取り、"[title] directed by [director] ([duration] min)" という形式の string を返す、getMovieInfo という名前の関数を作成してください。
以下の出力を別々の行に表示してください:
novelを引数にしてgetBookInfoを呼び出し、その結果を表示しますtextbookを引数にしてgetBookInfoを呼び出し、その結果を表示しますfilmを引数にしてgetMovieInfoを呼び出し、その結果を表示しますnovelの利用可能状況(isAvailableプロパティ)を表示します
自分で試してみよう
// TODO: ここにコードを書いてください
// BookとMovieの型エイリアスを作成します
// 型エイリアスを使用して変数を作成します
// 情報を取得するための関数を作成します
// 必要な出力を表示しますこのレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
Introduction To TypeScriptのすべてのレッスン
2基本の型
基本の型: str, num, boolean'any' 型: 脱出ハッチ'unknown' 型'null' と 'undef' の扱い型推論の実践明示的な型アノテーションまとめ:基本の型の演習5型:エイリアス、ユニオン型、インターセクション型
プリミティブ型の型エイリアスユニオン型 ('|')ユニオン型の扱い方リテラル型インターセクション型 ('&')型エイリアスの組み合わせまとめ:高度な型の組み合わせ自分で練習してみよう: JavaScriptオンラインコンパイラ