[解決済み】TypeScriptで`keyof`に似た`valueof`はありますか?
2022-04-20 04:31:28
質問
キーと値を入力として、オブジェクトのプロパティを値に割り当てたいのですが、値の型を決定することができます。ちょっと説明しにくいので、このコードで問題を明らかにします。
type JWT = { id: string, token: string, expire: Date };
const obj: JWT = { id: 'abc123', token: 'tk01', expire: new Date(2018, 2, 14) };
function print(key: keyof JWT) {
switch (key) {
case 'id':
case 'token':
console.log(obj[key].toUpperCase());
break;
case 'expire':
console.log(obj[key].toISOString());
break;
}
}
function onChange(key: keyof JWT, value: any) {
switch (key) {
case 'id':
case 'token':
obj[key] = value + ' (assigned)';
break;
case 'expire':
obj[key] = value;
break;
}
}
print('id');
print('expire');
onChange('id', 'def456');
onChange('expire', new Date(2018, 3, 14));
print('id');
print('expire');
onChange('expire', 1337); // should fail here at compile time
print('expire'); // actually fails here at run time
を変更してみました。
value: any
を
value: valueof JWT
が、うまくいかなかった。
理想は
onChange('expire', 1337)
は失敗します。
1337
はDate型ではありません。
を変更するにはどうすればよいですか?
value: any
を指定されたキーの値にすることはできますか?
どのように解決するのですか?
UPDATE: 質問のタイトルは、可能なすべてのプロパティ値のタイプのユニオンを探している人々を引きつけているようです。
keyof
は、可能なすべてのプロパティ・キー・タイプの組合わせを提供します。 まず、そのような人たちを助けてあげましょう。 あなたは
ValueOf
に類似した
keyof
を使用することで
インデックス付きアクセスタイプ
と
keyof T
をキーにして、このようにします。
type ValueOf<T> = T[keyof T];
で、これは
type Foo = { a: string, b: number };
type ValueOfFoo = ValueOf<Foo>; // string | number
記載されている質問については、個別のキーで、狭義の
keyof T
のように、気になる値型だけを抽出することができます。
type sameAsString = Foo['a']; // look up a in Foo
type sameAsNumber = Foo['b']; // look up b in Foo
関数の中でキーと値のペア "マッチング"が正しく行われるようにするためには ジェネリックス というように、インデックス付きのアクセスタイプもあります。
declare function onChange<K extends keyof JWT>(key: K, value: JWT[K]): void;
onChange('id', 'def456'); // okay
onChange('expire', new Date(2018, 3, 14)); // okay
onChange('expire', 1337); // error. 1337 not assignable to Date
という考え方です。
key
パラメータを使うことで、コンパイラは一般的な
K
パラメータを使用します。 そして、そのためには
value
マッチ
JWT[K]
のように、必要なインデックス付きアクセスタイプを指定します。
関連
-
[解決済み】Typescriptで、! (エクスクラメーションマーク/バン)演算子でメンバを再参照するのは?
-
[解決済み] グローバル定数の定義
-
[解決済み] TypeScriptで、「extends keyof」と「in keyof」はどういう意味ですか?
-
[解決済み] TypeScriptで文字列を数値に変換する方法とは?
-
[解決済み] TypeScript で `window` に新しいプロパティを明示的に設定するにはどうすればよいですか?
-
[解決済み] TypeScriptでの取得と設定
-
[解決済み] TypeScriptでパラメータとして強く型付けされた関数は可能か?
-
[解決済み] TypeScriptでオブジェクトに動的にプロパティを割り当てるには?
-
[解決済み] TypeScriptの "*.d.ts "について
-
[解決済み】TypeScriptのインターフェースと型について
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] TypeScriptエラー TS1005: ';' が予想される (II)
-
ts 学習日記1 AssertionError [ERR_ASSERTION]: タスク関数を指定する必要があります
-
[解決済み] TypeScriptで、「extends keyof」と「in keyof」はどういう意味ですか?
-
[解決済み] オブジェクトの型は「不明」です typescript generics
-
[解決済み] メインとテストのコンパイルを分離するために、typescriptコンパイラ(tsc)のオプションはどのように設定するのが正しいのでしょうか?
-
[解決済み] オブジェクトの配列に対してインターフェースを定義するには?
-
[解決済み】TypeScriptのコンパイルでExperimental decoratorsの警告が出る。
-
[解決済み】TypeScriptとフィールドイニシャライザー
-
[解決済み】文字列の値を持つenumの作成
-
[解決済み】tsconfig.jsonファイルを生成するにはどうしたらいいですか?