[解決済み] cannot read property of undefined" エラーを回避する方法は?
2022-04-27 12:33:21
質問
私のコードでは、多くのオブジェクトが互いに入れ子になっているエントリーがある配列と、そうでないエントリーがある配列を扱います。それは以下のようなものです。
// where this array is hundreds of entries long, with a mix
// of the two examples given
var test = [{'a':{'b':{'c':"foo"}}}, {'a': "bar"}];
このため、配列を繰り返し処理する必要があり、不整合によって次のようなエラーが発生します。
for (i=0; i<test.length; i++) {
// ok on i==0, but 'cannot read property of undefined' on i==1
console.log(a.b.c);
}
と言えるように意識しています。
if(a.b){ console.log(a.b.c)}
しかし、これは5つまたは6つのオブジェクトが互いに入れ子になっている場合、非常に面倒です。私はそれが存在する場合、console.logを行うだけで、エラーをスローしないようにすることができる他の(より簡単な)方法はありますか?
解決方法は?
更新情報 :
- ECMAScript 2020以降に準拠したJavaScriptを使用する場合、以下を参照してください。 オプションチェイニング .
- TypeScript は、バージョンアップでオプショナルチェイニングをサポートしました。 3.7 .
// use it like this
obj?.a?.lot?.of?.properties
ECMASCript 2020以前のJavaScript、またはバージョン3.7より古いTypeScriptに対する解決策 :
簡単な回避策は、ES6でtry/catchヘルパー関数を使用することです。 矢印機能 :
function getSafe(fn, defaultVal) {
try {
return fn();
} catch (e) {
return defaultVal;
}
}
// use it like this
console.log(getSafe(() => obj.a.lot.of.properties));
// or add an optional default value
console.log(getSafe(() => obj.a.lot.of.properties, 'nothing'));
関連
-
[解決済み] テスト
-
[解決済み】リソースの読み込みに失敗した:Bind関数でサーバーが500(Internal Server Error)のステータスで応答した【非公開
-
[解決済み] JavaScriptで空文字列/未定義文字列/null文字列をチェックするにはどうすればよいですか?
-
[解決済み] 変数が「未定義」または「NULL」であるかどうかを判断するにはどうすればよいですか?
-
[解決済み] JavaScript でオブジェクトが特定のプロパティを持つかどうかを確認するにはどうすればよいですか?
-
[解決済み] オブジェクトの配列を日付のプロパティでソートする方法は?
-
[解決済み] オブジェクトのプロパティが存在するかどうかを、プロパティ名を持つ変数で確認するには?
-
[解決済み] JavaScriptでオブジェクトの配列から明確な値を取得する方法は?
-
[解決済み] React - uncaught TypeError: 未定義のプロパティ 'setState' を読み取れない
-
[解決済み】未定義のオブジェクトプロパティを検出する
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
vue3.0プロジェクトのアーキテクチャを構築するための便利なツール
-
vueはopenlayersを使用してスカイマップとガオードマップをロードする
-
VUEグローバルフィルターの概念と留意点、基本的な使い方
-
[解決済み】JavaScriptの配列でforEachが関数でない不具合
-
[解決済み】TypeScript-のAngular Frameworkエラー - "exportAsがngFormに設定されたディレクティブはありません"
-
[解決済み】ExpressJS : res.redirect()が期待通りに動かない?
-
[解決済み】React-Redux: アクションはプレーンオブジェクトでなければならない。非同期アクションにはカスタムミドルウェアを使用する
-
HTML5 LocalStorage ローカルストレージとセッションストレージの使用法
-
フロントエンド非同期(アシンク)ソリューション(全ソリューション)
-
OSSアップロードエラーを解決する: net::ERR_SSL_PROTOCOL_ERROR