タイプエラーと短絡の評価？

Question

TSコード

image = this.selectedItem.image.url || null; 

ない理由

TypeError: Cannot read property 'url' of null 

私の質問は、あるエラー||型のエラーを投げるのではなく、代わりにキックインしますか？

Answer 1

あなたが持っている最も短いオプションは次のとおりです。&&のいずれかが失敗した場合は、代わりにnullを取得します

image = this.selectedItem && this.selectedItem.image && this.selectedItem.image.url || null; 

が、あなたはすべての「レベルを確認する必要がありますアクセスしようとしているオブジェクトの名前です。

&&が操作の順番で||より優先されるため、これが機能します。上記の文は次のようになりますa.bプロパティcを持っていない場合は、urlを取得することはできません

x = (a.b.c.url) || null; 

：あなたが持っていた何

x = (((a.b) && (a.b.c)) && (a.b.c.url)) || null; 

、一方で、と同様でした。それはエラーがスローされたものであり、それは最終的に「または」が捕捉できるものではありません。

Answer 2

this.selectedItem.image.urlをチェックしていますが、それが可能であることを確認するには、this.selectedItemとthis.selectedItem.imageが最初に存在することを確認する必要があります。

次の操作を試みることができる：

image = this.selectedItem && this.selectedItem.image ? this.selectedItem.image.url || null : null; 

Answer 3

あなたはフィールドimageは、私が思う存在するかどうかもチェックする必要があります。代わりに三項演算子を使用してみてください：

image = this.selectedItem.image ? this.selectedItem.image.url : null; 

Answer 4

this.selectedItem.image.url自体が評価されたときにエラーが発生したためです。私はあなたが何を"short-circuit"手段について混乱だと思う

this.selectedItem.image = this.selectedItem.image || {} 
image = this.selectedItem.image.url || null; 

Answer 5

：あなたはこのようにそれを修正することができます。ブール演算子は、結果が間違いなく真実か真実かを評価するまで左から右へと評価されます（他の場合は||より前は&&ですが、左から右へ）。あなたのケースでは、this.selectedItem.image.urlが評価されている間にエラーが発生し、||演算子には決して到達しません。

JavaScriptは、そのようなあなたがundefined値を逆参照防ぐためにthis.selectedItem?.image?.urlような何かを聞かせElvis operator「?.」としてnull/undefined-coalescingオペレータを欠いています。彼らは未定義することは可能である場合

代わりに、あなたは、存在する可能性のある各ネストされたプロパティをチェックする必要があります。

image = (this.selectedItem && this.selectedItem.image && this.selectedItem.image.url) || null; 

（私は他の回答は次のようなものに言及していると確信しています...ああ、はい、@Cerbrusはそれを持っています）このはあなたを助ける方法で短絡しています。それらのアイテムの1つが虚偽であるとすぐに、括弧で囲まれた用語全体が誤りを投げずに偽と評価されます。それから、nullとなるかわいそう - || nullになります。

希望があれば、がんばろう！