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

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

ただいまの
回答率

90.47%

  • JavaScript

    17018questions

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

  • if

    210questions

    if文とは様々なプログラミング言語で使用される制御構文の一種であり、条件によって処理の流れを制御します。

JavaScriptのif入れ子について

解決済

回答 7

投稿

  • 評価
  • クリップ 0
  • VIEW 1,092

unix-yuto

score 1

初心者なので拙い文章ですいませんm(_ _)m
JavaScriptでifの中にifを入れる場合、中に入れるif、else ifの数に制限などはあるのでしょうか?

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • Lhankor_Mhy

    2018/06/14 09:12

    そうですか? これはよい質問だと思いますが。

    キャンセル

  • mts10806

    2018/06/14 09:21 編集

    「調べてこういう記事を見つけた(やってみた)が分からない(その内容が質問に書いてある)」ならまだ分かりますが。

    キャンセル

  • think49

    2018/06/14 21:42

    「範囲が広すぎる」「自分の意見をいわない」という意味では回答者のリスクが不本意に高い質問だとは思います。 最悪のケースとして「それは私が求めている答えではありません」「それは知っていました(別の回答をBA)」「やっぱり、そうなるんですね(その回答を仕方なくBA)」な返信が想像できます。

    キャンセル

回答 7

checkベストアンサー

+8

JavaScriptでifの中にifを入れる場合、中に入れるif、else ifの数に制限などはあるのでしょうか?

技術的制約はありませんが、可読性の観点から深いネストは敬遠されます。

Re: unix-yuto さん

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/06/14 09:28

    > ネストの深さは闇の深さ
    覚えがありすぎる。。。

    キャンセル

  • 2018/06/14 09:37

    > mts10806さん
    禿同です笑
    あと僕の場合、三項演算子使いすぎで、わかりにくいって言われた逆パターンもあります 笑

    キャンセル

+5

var i = 0
if (++i)
if (++i)
if (++i)
//...
if (++i) 1;
console.log(i);


試してみたところ、当方の環境(win7、Firefox60)ですと、3010を超えるとスタックが溢れてエラーになりました。
また、

var i = 0
if (++i)
if (++i)
if (++i)
//...
if ( (++i) ) 1;
console.log(i);


としてみたところ、3010でもエラーになりましたので、if文以外のスタックやその他メモリの状況に左右されるかと思います。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

+3

まず、最近のコンピュータは性能が高いので、何か上限があったとしても実用上問題が起こることはまずありません。

その上で、原理的に上限がありうるかという点について考えます。
if文のネスト(入れ子)ですが、単純に考えると、内部的にそのようなものは存在しません。
if文の開始部分が「条件判定し、満たされないなら、if文の終了地点へ飛ぶ(goto)」という動作で、if文の終了地点には何もありません。
なのでif文にネストになるような構造はそもそも無いのです。

ただ、スコープを切り替えたり何らかの最適化のためにif文のネストが何らかの意味を持つことも考えられます。
その場合であっても、JavaScriptが動くレベルのCPUなら、固定のスタックを食いつぶしてメモリ全体の制限より早く限界が来るみたいなことはないのではないかと思います。


【追記】
上記のように考えていたわけですが3000程度で上限に達するとは予想外でした。すみません。
私も試してみましたが数は違うもののどのブラウザでも(Firefox,Chrome,IE,Edge)千や万単位でメモリ不足や再帰の上限でエラーになりました。
この程度のネスト数でメモリ不足になる理由は私には分かりません。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/06/14 10:38

    横槍失礼します。
    やってみて動き確認してみましたが、そういうことなんですね。
    ブロックで分けるのは、あくまで後の処理に影響を及ぼさないためにつけるだけであって、
    本来的には、ifの仕様としては入れ子の概念は存在しないんですね。
    大変勉強になりました。

    キャンセル

+2

あまり意識していない方も多いですがjavascriptにはelseifという構文がありませんので
常に真偽のどちらかの判定しかしていません。
「else if」は実際には「else{if(){ ・・・}}」というelseのブロックの中でifを
ネストしているにすぎません。
なので論理的にはネストを気にするのはあまり意味がなく、あくまでも見た目上のネストだけ
気にしたほうがいいという認識がよいと思います

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/06/14 10:21

    し、知らなかった・・・。
    確かに、{}でブロック分けしなくても動くってことは、そういうことですもんね。
    勉強になりました。
    横槍失礼しました。

    キャンセル

  • 2018/06/14 21:37 編集

    > 「else if」は実際には「else{if(){ ・・・}}」というelseのブロックの中でifを
    > ネストしているにすぎません。

    ネストしているわけではありません。
    この事例では BlockStatement -> IfStatement 内の BlockStatement の形でネストしていますが、IfStatement の構文は

    if (Expression) Statement else Statement

    であり、else に後続する Statement が IfStatement を含むことが出来る事で、再帰的に IfStatement を呼び出し、

    if (Expression) Statement else IfStatement

    となり、

    if (a) {} else if {}

    が成立します。
    おそらく、yambejp さんは理解しているのであろうと思いますが、-評価の理由は「ネスト」という単語を使ったことにあるようにも感じています。
    http://www.ecma-international.org/ecma-262/8.0/#sec-if-statement

    キャンセル

  • 2018/06/14 21:48

    TO:think49さん、解説ありがとうございます。
    MDNではelseにifはネストしていくと読み取ったのですが
    どうも私の解釈がオカシイのかもしれません
    ご指摘をもとによくよく噛み砕いて解釈をしてみます

    https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/if...else

    キャンセル

+1

試してみてはいかがでしょうか。

動くサンプル:https://jsfiddle.net/eb23wszf/


【Chrome DevToolsを使いこなそう! Web開発に必須なブラウザ開発ツールによるデバッグの基本 - エンジニアHub|若手Webエンジニアのキャリアを考える!】
https://employment.en-japan.com/engineerhub/entry/2017/05/30/110000#Consoleパネル

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

+1

ifやelseの数や制限については、他の方が答えてらっしゃるので、別角度から。

else if を複数以上使う場合、switch構文の方が、よかったりします。
例えば下記のようなパターン

変数juiceに、なんのジュースが入ってるかを判別する時とかです。

var juice = 'オレンジ'
// ↑ここでは決め打ちですが、juiceに何が入ってるかわからないとします。

switch(juice){
  case 'オレンジ':
    console.log('うーまいー!');
    break;
  case '抹茶':
    console.log('苦い・・・');
    break;
  case 'レッドブル':
    console.log('飲みすぎないように');
    break;
  default:
    console.log('なんだこれ?');
    break;
}

あと、ifが一行で値だけが変化するって時は三項演算子を使うと、ネストが抑えられるかと思います。

var hogehoge = true
// ↑trueかfalseが入ってる変数とします。

var message = hogehoge ? 'ほげほげいるよ' : 'ほげほげいない!';
// hogehogeがtrueだと左側、falseだと右側を使います。

if (message.indexOf('いない') != -1) {
  // messageに”いない”って文字列が入ってると、下記が実行されます
  console.log('いないらしい・・・');
  return false;
}

ちょっと、質問と趣旨が変わってしまってすみませんが、
switch構文や、三項演算子をうまく使えば、else ifも、ifのネストもけっこう抑えられるかと思います。

お役に立てられれば幸いです。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

+1

構文チェックをしてくれるeslintの中にcomplexityというルールがあり、
そのデフォルト設定は『20』となっています。
もしかしたらこの数字は、世界のエンジニアの心の叫びを集約した数字かもしれません。
日頃から他人に優しいコードを書くように心掛けたいと思います。
(他人というのは1年後の自分も含みます・・・)

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

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

  • ただいまの回答率 90.47%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • JavaScript

    17018questions

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

  • if

    210questions

    if文とは様々なプログラミング言語で使用される制御構文の一種であり、条件によって処理の流れを制御します。