TypeScript で知っておく価値のある 7 つのメソッドについての簡単な説明

この記事では、知っておくべき TypeScript の 7 つのメソッドを紹介します。お役に立てれば幸いです。

#TypeScript の型システムは非常に強力です。これはタイプ セーフティを提供します。型システムは愛されていますが、型とインターフェイスを計画および設計しないと、コードが乱雑で読みにくくなる可能性もあります。

ジェネリック

コードの重複を避け、再利用可能な型を作成することは、簡潔なコードを作成する際の重要な部分です。ジェネリックは、再利用可能な型を作成できるようにする TypeScript の機能です。次の例を見てください。

type Add = (a: T, b: T) => T const addNumbers: Add = (a, b) => { return a + b } const addStrings: Add = (a, b) => { return a + b }

正しい型をAddのジェネリック型に入力します。これは、2 つの数値の加算または 2 つの文字列の連結を記述するために使用できます。関数ごとに型を記述する代わりに、ジェネリックを使用してそれを 1 回行うだけで済みます。これにより、労力が節約されるだけでなく、コードがよりクリーンになり、エラーが発生しにくくなります。

ユーティリティ タイプ

TypeScript は、一般的な型変換の実行に役立ついくつかの便利なユーティリティ タイプをネイティブに提供します。これらのユーティリティ タイプはグローバルに利用でき、すべてジェネリックを使用します。

私がよく使うのは以下の7つです。

1.Pick

Pickは、Type から属性セット Keys を選択して、新しいタイプのキーは、文字列リテラルまたは文字列リテラルの結合にすることができます。 Keys の値は Type のキーである必要があります。そうでない場合は、TypeScript コンパイラーからエラーが発生します。このユーティリティ タイプは、多くのプロパティを持つオブジェクトから特定のプロパティを選択して、より軽量なオブジェクトを作成する場合に特に便利です。

type User = { name: string age: number address: string occupation: string } type BasicUser = Pick // type BasicUser = { // name: string; // age: number; // }

2.Omit

OmitはPick## の逆です。 ＃。キーこれは、どの属性を保持するかということではなく、省略する属性キーのセットを意味します。これは、オブジェクトから特定のプロパティを削除し、他のプロパティを保持したい場合に便利です。

type User = { name: string age: number address: string occupation: string } type BasicUser = Omit // type BasicUser = { // name: string; // age: number; // }

3.Partial

Partialすべての型属性セットを使用して型を構築することはオプションです。これは、オブジェクトの更新ロジックを作成するときに非常に役立ちます。

type User = { name: string age: number address: string occupation: string } type PartialUser = Partial // type PartialUser = { // name?: string; // age?: number; // address?: string; // occupation?: string; // }

4.Required

は、Partialの逆です。すべてのプロパティが必要な型を構築します。これを使用すると、型にオプションのプロパティが存在しないことを確認できます。

type PartialUser = { name: string age: number address?: string occupation?: string } type User = Required<PartialUser> // type User = { // name: string; // age: number; // address: string; // occupation: string; // }

Readonly

型セットのすべてのプロパティが読み取られる型を構築します。 -のみ。新しい値 TS を再割り当てすると、エラーが発生します。

type User = { name: string age: number address: string occupation: string } type ReadOnlyUser = Readonly<User> const user: ReadOnlyUser = { name: "小智", age: 24, address: "厦门", occupation: "大迁世界" } user.name = "王大冶" // Cannot assign to &#39;name&#39; because it is a read-only property.

ReturnType

関数型の戻り値の型から型を構築します。これは、外部ライブラリの関数型を処理し、それらに基づいてカスタム型を構築する場合に非常に役立ちます。

import axios from 'axios' type Response = ReturnType function callAPI(): Response{ return axios("url") }