質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

759閲覧

JavaScriptのif文内でのオプショナルチェイニングについて

takochan1192

総合スコア100

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2022/04/19 01:57

if文の条件文としてオプショナルチェイニングを使用した時の
挙動について、想定していた挙動とは異なる動きとなりました。

まず、サンプルコードとして下記のようなコードを作成しました。

js

1const hoge = [1, 2, 3, 4, 5] 2const fuga = undefined 3 4const checkArray = (item) => { 5 if (item?.length !== 0) { 6 console.log("item is array!") 7 } else { 8 console.log("item is not array!") 9 } 10} 11checkArray(hoge)

このコードの出力結果は当然下記のようになります。

item is array!

checkArrayメソッドにfugaを引数として持たせた場合は、
if文ではなく、else文へと入り、"item is not array"が
出力されると思っていました。

しかし、出力結果は最初と同様の"item is array"となりました。

今回のケースでは、なぜitemがundefinedの場合にif文内の
console.logが呼び出されてしまうのでしょうか?
ご教示いただけますと幸いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

js

1 if (item?.length !== 0) {

item が nullish の場合は、item?.length の値は undefined になります。undefined0 ではないので if が成立します。

投稿2022/04/19 02:04

int32_t

総合スコア20659

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

takochan1192

2022/04/19 02:59

int32_t様 ご回答ありがとうございました。ご指摘の通りですね。ありがとうございます。
guest

0

javascript

1if (item?.length !== 0) { 2↓↓↓ 3if (item?.length > 0) {

ちなみに文字列もlengthプロパティを持ちますし
空の配列はlengthが0になるのでこれでは配列を判断できません
やるならこう

javascript

1 if (item instanceof Array) {

投稿2022/04/19 02:01

編集2022/04/19 02:08
yambejp

総合スコア114572

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

takochan1192

2022/04/19 02:57

yambejp様 ご回答ありがとうございます。 おっしゃる通り、文字列もlengthプロパティがありました。 バカの一つ覚えのように、item.length !== 0 で配列を判定しておりました。 かなり反省しました。ご指摘ありがとうございます。 精進致します。
yambejp

2022/04/19 03:18

いい機会なのでinstanceofは覚えておいてくださいね
guest

0

ベストアンサー

オプショナルチェーン (?.) - JavaScript | MDN

?. 演算子の機能は . チェーン演算子と似ていますが、参照が nullish (null または undefined) の場合にエラーとなるのではなく、式が短絡され undefined が返されるところが異なります。

というわけで、fuga?.lengthundefinedであり、これは!==0であるためfuga?.length !==0は真です。

投稿2022/04/19 02:03

ozwk

総合スコア13512

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

takochan1192

2022/04/19 02:58

ozwk様 ご回答ありがとうございます。ご指摘の通りundefinedは0ではないですね。 よく理解できました。ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問