私と一緒に Typescript を学びましょう - パート 2

前回の記事では typescript の基礎を学びました。まだ読んでいない場合は、この記事を読む前に読んでください。

1- タイプスクリプトを一緒に学びましょう - 1

ENUM

列挙型は、一連の名前付き定数を定義する方法を提供します。デフォルトでは列挙値は 0 から始まりますが、オーバーライドできます。

enum Color { Red = "RED", Green = "GREEN", Blue = "BLUE", };

const getColorMessage = (color: Color): string => { 
      return You selected ${color};
 }; 

console.log(getColorMessage(Color.Red));

配列

typescript の配列を使用すると、同じ型の要素のコレクションを定義できます。Python ではリスト型と呼ばれる、ある種のリストのように考えることができます。

const numbers: number[] = [1, 2, 3, 4];

numbers.push(5);

console.log(numbers);

now if I try to add a string in numbers array typescript will complain

number.push("five") // type string is not assignable to type number

タプル

タプルは、固定サイズと型の配列を定義できる typescript の特別な配列型です。タプルは、データの形状が正確にわかっている場合に使用されます。タプルを使用すると、データの読み取りのパフォーマンスが向上します。

const user: [number, string] = [1, "Alice"];

console.log(user);

物体

typescript のオブジェクトを使用すると、型を使用してオブジェクトの構造を定義できます。このようにオブジェクトを入力できます。タイプエイリアストピックのオブジェクトについて詳しく説明します

const user: { id: number; name: string } = { id: 1, name: "Alice" }; 

console.log(user.name);

タイプエイリアス

型エイリアスを使用すると、コードの再利用と読みやすさを向上させるために、typescript でカスタム型を定義できます。これで、オブジェクトを Type Alias UserType

として入力できるようになりました。

注: 実際のプロジェクトでは「type」などの単語を使用しないでください。

type UserType = { id: number; name: string; };

const user: UserType = { id: 1, name: "Alice" };

console.log(user.id);

オプションのプロパティ

オプションのプロパティを使用すると、存在する場合も存在しない場合もあるオブジェクト プロパティを定義できます。前の例では、ユーザーが ID と名前のみを持つと考えた場合、存在する場合と存在しない場合があります。 ? を追加できますか? before : これがオプションのプロパティであることを示します

type UserType = { id: number; name?: string; };

const user: User = { id: 1 };

console.log(user.name ?? "Name not provided");

ナローイング / タイプガード

型ガードを使用すると、コードの特定のブロック内の値の型を絞り込むことができます。ユーザーにはオプションのプロパティとして名前があることがわかっているため、ユーザーの名前を出力しようとすると、顧客に表示したくない未定義と表示されるため、表示する前にユーザー名が文字列であることを確認します。それ

if (typeof user.name == 'undefined') {
   console.log("Welcome", user.name)
}  else {
   console.log("Welcome Guest")
}

次の記事では、関数と型アサーションについて説明していきます。

デンマークのアリ

以上が私と一緒に Typescript を学びましょう - パート 2の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。