序文: この翻訳は、TypeScript ハンドブックの「マップされた型」の章から編集されています。 この記事は原文通りに厳密に翻訳したものではなく、一部解説や補足も加えています。 1. マップされた型場合によっては、ある型を別の型に基づいて作成する必要があるものの、コピーを作成したくないことがあります。この場合は、マッピング型の使用を検討できます。 マッピング タイプは、インデックス シグネチャの構文に基づいています。まずはインデックス シグネチャを確認しましょう。 // プロパティの型を事前に宣言する必要がある場合 type OnlyBoolsAndHorses = { [キー: 文字列]: ブール値 | 馬; }; const準拠: OnlyBoolsAndHorses = { del: 本当、 ロドニー: 間違いだ、 }; マッピング タイプは、 タイプ OptionsFlags<Type> = { [keyof Type のプロパティ]: boolean; }; この例では、 タイプFeatureFlags = { ダークモード: () => void; 新しいユーザープロファイル: () => void; }; タイプ FeatureOptions = OptionsFlags<FeatureFlags>; // タイプFeatureOptions = { // darkMode: ブール値; // 新しいユーザープロファイル: ブール値; // } 2. マッピング修飾子マップされた型を使用する場合、使用できる追加の修飾子が 2 つあります。1 つはプロパティを読み取り専用に設定するために使用される readonly で、もう 1 つはプロパティをオプションに設定するために使用される ? です。 これらの修飾子は、プレフィックスに - または + を付けることで削除または追加できます。プレフィックスを指定しない場合は、プレフィックス + を使用するのと同じです。 // 属性内の読み取り専用属性タイプを削除します CreateMutable<Type> = { -readonly [keyof Type 内のプロパティ]: Type[プロパティ]; }; タイプ LockedAccount = { 読み取り専用ID: 文字列; 読み取り専用の名前: 文字列; }; UnlockedAccount を CreateMutable<LockedAccount> と入力します。 // タイプ UnlockedAccount = { // id: 文字列; // 名前: 文字列; // } // 属性内のオプション属性タイプを削除します。Concrete<Type> = { [Typeのキー内のプロパティ]-?: Type[プロパティ]; }; MaybeUser = {と入力します id: 文字列; 名前?: 文字列; 年齢?: 番号; }; User を Concrete<MaybeUser> と入力します。 // タイプ User = { // id: 文字列; // 名前: 文字列; //年齢: 数値; // } 3. キーの再マッピング
タイプ MappedTypeWithNewProperties<Type> = { [keyof Type の NewKeyType としてのプロパティ]: Type[プロパティ] } たとえば、テンプレートリテラル型を使用して、以前のプロパティ名に基づいて新しいプロパティ名を作成できます。 タイプ Getters<Type> = { [keyof Type のプロパティは `get${Capitalize<string & Property>}` です]: () => Type[Property] }; インターフェース Person { 名前: 文字列; 年齢: 番号; 場所: 文字列; } LazyPerson = Getters<Person> と入力します。 // タイプ LazyPerson = { // getName: () => 文字列; // getAge: () => 数値; // getLocation: () => 文字列; // } 条件型を使用して never を返し、特定の属性を除外することもできます。 // 'kind'プロパティを削除します タイプ RemoveKindField<Type> = { [キーの Type のプロパティが Exclude<Property, "kind"> である]: Type[Property] }; インターフェースサークル{ 種類: "circle"; 半径: 数値; } タイプ KindlessCircle = RemoveKindField<Circle>; // タイプ KindlessCircle = { // 半径: 数値; // } また、 型 EventConfig<Events extends { kind: string }> = { [E in Events を E["kind"]] として: (イベント: E) => void; } タイプ SquareEvent = { kind: "square", x: 数値, y: 数値 }; タイプ CircleEvent = { kind: "circle", 半径: 数値 }; タイプ Config = EventConfig<SquareEvent | CircleEvent> // タイプ Config = { // square: (イベント: SquareEvent) => void; // 円: (イベント: CircleEvent) => void; // } 4. さらなる調査マッピング タイプは他の関数でも使用できます。たとえば、これは条件付きタイプを使用し、オブジェクトに pii 属性があるかどうかに応じて true または false を返すマッピング タイプです。 タイプExtractPII<Type> = { [keyof Type のプロパティ]: Type[プロパティ] は { pii: true } を拡張します。true : false; }; タイプ DBFields = { id: { 形式: "増加中" }; 名前: { タイプ: 文字列; pii: true }; }; ObjectsNeedingGDPRDeletion を ExtractPII<DBFields> と入力します。 // type ObjectsNeedingGDPRDeletion = { // id: false; // 名前: true; // } 以下もご興味があるかもしれません:
|
<<: CentOS7 環境で gcc (バージョン 10.2.0) をアップグレードする詳細な手順
>>: さまざまな解像度やブラウザでウェブページを適切に表示する方法
インターフェイス ドメイン名を構成する際、各パブリック プラットフォームはドメイン名に対する開発者の...
序文最近、古いプロジェクトから残ったいくつかの SQL 最適化の問題に対処するのに忙しくしています。...
AND キーワードを使用した MySQL 複数条件クエリ。MySQL では、AND キーワードを使用...
1. 前提条件何度かインストールしているので、エラーについてはこれ以上説明しません。ちょっとわかりに...
この記事では、画像のフェードインとフェードアウトを実現するためのjsの具体的なコードを参考までに紹介...
この記事では、libudev ライブラリを使用して hidraw デバイスにアクセスします。 lib...
序文最近、パソコンのシャットダウンに時間がかかることが多く、強制的にシャットダウンするには電源ボタン...
1. Nginx サービス基盤Nginx (エンジン x) は、パフォーマンスの最適化のために特別...
目次序文指導の基本フック機能フック関数のパラメータ文章使い方とアイデア成し遂げる汎用性を高める要約す...
序文PIPE、パイプラインと翻訳されます。 Angular パイプは、HTML コンポーネントで宣言...
目次質問サーバー層とストレージエンジン層LIMITって何ですか?何をするか?トゥカオ最近、Q&...
border-radius で生成できる四角形やその他の図形に影を追加する場合 (「Adaptive...
目次1. MySQLをダウンロードする1.1 ダウンロード1.2 インストール1. MySQLをダウ...
目次1. JDKをインストールする手動インストール2. トムキャット1. JDKをインストールする注...
私は頻繁にシステムをインストールするので、インストールのたびにいくつかのソフトウェアを再インストール...