ジェネリック配列
CoddyのJavaScriptジャーニー「Introduction To TypeScript」セクションの一部。レッスン 60/73。
TypeScriptでは、配列とジェネリックは美しく連携します。先ほど型付き配列について学んだときは、配列に特定の型の要素だけを含められることを指定するために、T[]構文を使用しました。ジェネリックを使うと、この同じ概念を別の方法で表現できます。
TypeScript では、Array<T> 形式を使用して型付き配列を記述する別の構文も利用できます。
// これら2つの宣言は同等です:
let numbers1: number[] = [1, 2, 3];
let numbers2: Array<number> = [1, 2, 3];特に、配列を操作する generic 関数を扱うとき、Array<T> 構文は非常に便利です。型安全性を維持しながら、任意の型の配列で動作する関数を作成する場合に、コードが generic であることをより明確かつ読みやすく表現できます。
チャレンジ
簡単任意の型の配列を受け取り、最初の要素を返すか、配列が空の場合は undefined を返す、getFirstElement という名前の generic function を作成してください。
この function は次の条件を満たす必要があります。
- generic 型パラメーター
Tを使用する Array<T>型のarrという名前のパラメーターを 1 つ受け取る- 型
Tの最初の要素、またはundefinedを返す T | undefinedの明示的な戻り値の型注釈を持つ
Array<T> syntax を使用して、次の arrays を作成してください。
stringArray：Array<string>型で、["apple", "banana", "cherry"]を含むnumberArray：Array<number>型で、[10, 20, 30, 40]を含むbooleanArray：Array<boolean>型で、[true, false, true]を含むemptyStringArray：Array<string>型で、空である
function を Test し、次の出力を print してください。
stringArrayを指定してgetFirstElementを呼び出した結果を print するnumberArrayを指定してgetFirstElementを呼び出した結果を print するbooleanArrayを指定してgetFirstElementを呼び出した結果を print するemptyStringArrayを指定してgetFirstElementを呼び出した結果を print する["single"]を含む新しいArray<string>を指定してgetFirstElementを呼び出した結果を print する
自分で試してみよう
// TODO: ここにコードを書いてください
// ジェネリック関数 getFirstElement を作成する
// Array<T> 構文を使用して必要な配列を作成する
// 関数をテストして結果を出力する
腕試しこのレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
Introduction To TypeScriptのすべてのレッスン
2基本の型
基本の型: str, num, boolean'any' 型: 脱出ハッチ'unknown' 型'null' と 'undef' の扱い型推論の実践明示的な型アノテーションまとめ：基本の型の演習5型：エイリアス、ユニオン型、インターセクション型
プリミティブ型の型エイリアスユニオン型 ('|')ユニオン型の扱い方リテラル型インターセクション型 ('&')型エイリアスの組み合わせまとめ：高度な型の組み合わせ自分で練習してみよう: JavaScriptオンラインコンパイラ