オブジェクトのプロパティを反復処理する際の TypeScript の問題

オブジェクトのプロパティを反復処理する際の TypeScript の問題

1. 問題

たとえば、次のコード:

タイプ 動物 = {
    名前: 文字列;
    年齢: 番号
}

定数動物:動物={
    名前:"犬",
    年齢:12
}

関数テスト(obj:Animal) {
    (let k in obj) {
        console.log(obj[k]) を実行します。 //ここでエラー}
}
テスト(動物)

エラー:

2. 解決策

1. オブジェクトをanyとして宣言する

関数テスト(obj:Animal) {
    (let k in obj) {
        console.log((obj as any)[k]) //エラーなし}
}


この方法はtypescript検証メカニズムを直接バイパスします

2. オブジェクトのインターフェースを宣言する

タイプ 動物 = {
    名前: 文字列;
    年齢: 番号;
    [キー: 文字列]: 任意
}

定数動物:動物={
    名前:"犬",
    年齢:12
}

関数テスト(obj:Animal) {
    (let k in obj) {
        console.log(obj [k]) //エラーなし}
}
テスト(動物)

これは、より一般的なオブジェクト タイプ、特に一部のツール メソッドに使用できます。

3. ジェネリックを使用する

関数テスト<T extends object>(obj:T) {
    (let k in obj) {
        console.log(obj [k]) //エラーなし}
}

4. keyofを使用する

関数テスト(obj:Animal) {
    k: (動物のキー)とします。
    (k in obj) {
        console.log(obj [k]) //エラーなし}
}

これで、TypeScript によるオブジェクト プロパティのトラバースに関するこの記事は終了です。TypeScript によるオブジェクト プロパティのトラバースの詳細については、123WORDPRESS.COM で以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • TypeScript 列挙の基本と例
  • TypeScript の条件型に関する詳細な読書と実践記録
  • Typescript+React でモバイルと PC でシンプルなドラッグ アンド ドロップ効果を実現

<<:  ウェブページを作成する際に注意すべき点

>>:  テーブル設定の背景画像が100%表示されない解決策

推薦する

Mysql のいくつかの複雑な SQL ステートメント (重複行のクエリと削除)

1. 重複行を見つける blog_user_relation a から * を選択 WHERE (...

無効と読み取り専用の機能と違い

1: readonly は、このコントロールをロックして、インターフェイス上で変更できないようにしま...

Vue3 コンパイルプロセス - ソースコード分析

序文: Vue3 がリリースされてからかなり経ちますが、最近、会社のプロジェクトでVue3 + Ty...

MySQL の null (IFNULL、COALESCE、NULLIF) に関する知識ポイントのまとめ

この記事では、MySQL の null (IFNULL、COALESCE、NULLIF) に関連する...

フォーム要素の垂直方向の中央揃えに最適なソリューション

コードをコピーコードは次のとおりです。 <!DOCTYPE html PUBLIC "...

フロントエンド開発に必須:推奨されるブラウザ互換性テストツール 12 選

フロントエンド開発者にとって、さまざまな主要ブラウザのさまざまなバージョンでコードが適切に動作するこ...

Docker-compose インストール yml ファイルの設定方法

目次1. オフラインインストール2. オンラインインストール3. アンインストール4. ymlファイ...

HTML の基礎_一般的なタグ、共通タグ、表

パート 1 HTML <html> -- 開始タグ<ヘッド>ウェブページ上の...

Nginx設定ファイルの詳細な説明

Nginx の主な設定ファイルは nginx.conf で、グローバル ブロック、イベント ブロック...

Linux 上の MySQL 5.7 でパスワードを忘れる問題を解決する

1. 問題Linux 上の mysql5.7 のパスワードを忘れました2. 解決策• ステップ 1:...

Dockerコンテナを使用してホストネットワークにアクセスする方法

最近、nginx をリバース プロキシとして使用し、docker で nginx を実行するシステム...

CentOS 7のインストールと設定方法のグラフィックチュートリアル

この記事は、CentOS 7の詳細なインストールチュートリアルを参考のために記録します。具体的な内容...

HTML の順序なしリストタグと順序付きリストタグの使用例

1. 上部と下部のリストタグ: <dl>..</dl>:上dt下層dd: カ...

HTML での select optgroup タグの使用の概要

時々、選択した内容をグループ化する必要があります。以前はプログラム制御を使用していました。今日、se...

MySQL ストアドプロシージャの長所と短所の分析

MySQL バージョン 5.0 ではストアド プロシージャのサポートが開始されました。ストアド プロ...