Q&A
突然'repots'が出てきたのですが、'reports'と書くべきところを'repots'と書いてエラーになったということでしょうか？
ご覧になっていただき幸いです
さて、javascriptでオブジェクトを参照する処理で、存在しない項目を指定した場合、エラーになって処理が止まってしまします。
エラー原因は単純に存在しない項目を参照しているところに原因がわかっているため、PHPでいうところのエラー制御演算子的な処理で空データを設定したいと考えましたが、よくわかりません
try catch を使うということになるのでしょうか？
javascrpt
1objReports={"reports":{"author":{"id":101,"name":"人名"}}}; 2console.log(objReports); 3//レポート入力者 4$('#author_name' ).val( objReports['reports']['author']['name'] );
html
1<input id="author_name">
だと
Uncaught TypeError: Cannot read property 'name' of undefined
のようなエラーを吐き出しスクリプトが終了します。
ニュアンスが伝わるかわかりませんが、これをPHPのエラー制御演算子如くスルーする方法はないでしょうか？
php
1$author_name = @objReports['reports']['author']['name'];
ベストプラクティスをご教授ください
回答6件
0
ベストアンサー
まず、PHPの@は悪手なので使わないようにしましょう。
それエラーを無理やり握りつぶしてるだけなのでパフォーマンス的な話でちゃんと精査して取りに行く方が速度も出ます。
try catch を使うということになるのでしょうか？
try-catchの使い所さんは結構難しいのです。
基本的に完成したシステムにはバグがなくなるはずです。
tryつまり挑戦しなければならない場面で使いましょう。
具体的にはネットワークアクセス等で先方のWebサーバが生きてるかどうか保証しかねるようなケースで使用すべきです。
しかし、JavaScriptに於いて、他のシステムに問い合わせるという場面は基本的に非同期処理です。
第一引数errになるコールバック関数内でやれという思想で運用されていますから、
try-catchを使うタイミングというのは殆ど存在しません。
Promiseも.then(fn)や.catch(fn)でコントロールしますから
こちらもtry-catchの使用タイミングというのはほぼ皆無です。
Promiseの糖衣構文になるES7で追加されたasync/await構文では
try-catchを使うと自動的にPromiseのrejectを叩いて、.catch(fn)で取り出したような動作になるはずなので、そのくらいでしょうか？
原因もわかってるようなので解決策だけ、
基本はLodashやRamdaなどの値操作の達人なライブラリを使うべきです。
Lodashならばget、
Ramdaならばpathで苦労もなく取得できます。
nullやundefinedが挟まり、
これらの値はプロパティを所持出来ずアクセスするとエラーになるはずですが…
存在しないパスが間に挟まっていても難なく取ってこれるのがわかるはずです。
このようにLodashやRamdaはPHPのビルトイン関数に匹敵する便利ライブラリですから、
せめてどちらかは採用して何時でも使えるようにしておくべきでしょう。
有名で流行っているLodashがオススメです。
ですが、ライブラリを実装出来ないケースでは下記のような関数を作って対処することをすすめます。
やっつけなので動作を保証してくださいという話なら
責任持てないので上記のようなライブラリを検討してください。
JavaScript
1const get = (obj, path) => 2 path.split('.').reduce((obj, path) => 3 obj == null ? undefined : obj[path] 4 , obj); 5 6// 使い方 7var obj = { 8 taro: {id: 1, age: 18, score: 80}, 9 jiro: {id: 2, age: 17, score: 85}, 10 busaro: {id: 3, age: 16, score: 75}, 11}; 12console.log(get(obj, 'taro.age')); 13// 18 14console.log(get(obj, 'taro.hoge.piko')); 15// undefined <- 存在しないパスが途中にくるが別にエラーにはならない
投稿2019/05/17 07:33
編集2019/05/17 07:36
総合スコア21158
みなさま、ホント神様みたいな方ばかりです
PHP の@は速度面の問題とエラーとして認識できない問題等で賛否が多くあるのは存じておりますが、ご提示頂いたライブラリのようなものは一日かけても生み出せませんｗ
本当にありがとうございます。
どうもPHPで悪い癖がついているのかjavascriptにうまく馴染めません
みなさんにベストアンサーをお返ししたいのですが最上級アンサーということで
もっとも懇切丁寧に記述いただいた @miyabi-sun にお捧げします
ありがとうございました
0
今すぐは使えないですが、新機能としてoptional chainingが提案中です。
javascript
1$('#author_name' ).val( objReports?.reports?.author?.name );
投稿2019/05/17 07:11
総合スコア145183
0
可読性が悪いのと、Falsy値をどうするのか、という問題がありますが、こういう書き方はどうでしょうか。
js
1( ( objReports['reports'] || {} )['author'] || {} )['name']
js
1objReports['reports'] && objReports['reports']['author'] && objReports['reports']['author']['name']
ECMAScriptにも safe navigation operator が欲しいですね。
投稿2019/05/17 07:39
総合スコア36074
optional chainingはまだStage 1とのことで、いったいいつになるのかわからないですね…
2、3年はかかる感じなんでしょうね。パイプ演算子はいつ来るんだろう……
ありがとうございます
yambejpさんの記述に通じる構文ですね
φ(..)
0
オブジェクトのネストでどこでtypoしているかあやしいなら
try-catchなんでしょうけど、逆にどこが問題かわからないのは
気持ち悪い気がする
PHPの@エラー回避も滅多なことで使わないほうが身のため
とはいえどうしてもというならこう
javascript
1var name; 2objReports={"reports":{"author":{"id":101,"name":"人名"}}}; 3name=((objReports['repots']||{})['authr']||{})['nam']; 4console.log(name); 5name=((objReports['repots']||{})['author']||{})['name']; 6console.log(name); 7name=((objReports['reports']||{})['authr']||{})['name']; 8console.log(name); 9name=((objReports['reports']||{})['authr']||{})['nam']; 10console.log(name); 11name=((objReports['reports']||{})['author']||{})['name']; 12console.log(name); 13
投稿2019/05/17 07:30
総合スコア114784
0
その項目が存在するかどうかを判断して、存在しなければ以降の処理をスキップするように組めばよろしい
投稿2019/05/17 07:01
総合スコア87749
0
PHPのエラー制御演算子（@）は、エラーを画面に表示しないだけで、内部的にはエラーになっています。
多分、ご覧になることはないと思いますが、Apache等のWebサーバーのエラーログに大量にエラーが出力されていますよ。
投稿2019/05/21 02:55
総合スコア108
あなたの回答
tips
プレビュー
