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

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

ただいまの
回答率

90.33%

  • JavaScript

    17587questions

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

for文とif文を組み合わせたクイズアプリを作っています。

解決済

回答 3

投稿

  • 評価
  • クリップ 0
  • VIEW 277

mo__fumi

score 3

 前提・実現したいこと

JavaScriptの課題でfor文とif文を組み合わせたクイズアプリを製作しています。

<1>alertで1から5までの数値を当てるよう指示する(答えは2)
<2>okを押すとpromptで1から5までのどれかを入力するよう出てくる
<3>外れると、間違っているので再度答えを入力するようにというpromptが出てくる
<4>当たればalertで「おめでとう!」などのメッセージが現れゲームが終了する

という流れを作りたいです。

 発生している問題・エラーメッセージ

for文についてどうしても理解が追いつかないのですが、for文は繰り返す回数が決まっている時に使うものですよね?この課題の場合確かに選択肢は5つしかないですが、2が当たるまでは無限に続くはずですよね?それをどうやってfor文で表せばいいのかさっぱりわかりません。
またfor/for in/for ofのどれを使うべきなのかも不明で、なんとなくforではないのかな?と思っています・・・

下に自力で書いてみたコードがありますが全然違う気がしてるので都度指摘して頂けると助かります;

 該当のソースコード

// alertで'You got 5 guesses. Guess 1 to 5'と言うメッセージを表示させ、1から5までの数値を当てるよう指示する。
        alert ('You got 5 guesses. Guess 1 to 5');

// 答えの数値を2で用意
        const correctAnswer = 2; // こういうことでしょうか?そしていつ使う??

// promptで'What do you guess?'と言うメッセージとともに、記入欄を表示させる
        prompt('What do you guess?');

// forループで1から5までの数値で、答えの2が当たるまで推測を促すpromptを表示させる。
// ヒント1:if文とも組み合わせて、推測が当たった場合はalertで'Good job! See what happens next :)'を表示。当たったらゲーム終了にする。
// ヒント2:外れたらpromptで'Ops! Maybe, another try?'のメッセージとともに記入欄を表示。
        let numbers = [1, 2, 3, 4, 5]

        for (/*ここに何を書けばいいのかわからない*/) {
            if (numbers === 2) {
                alert ('Good job! See what happens next :)');
                break;
            } else {
                prompt ('Ops! Maybe, another try?');
            }
        }

 試したこと

2が出るまでは無限に続くはず!と思いfor(;;)などと書いて見ましたが永遠に外れた場合のpromptが繰り返されるだけでした・・・

 補足情報(FW/ツールのバージョンなど)

ATOMを使用しています。

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

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

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

    クリップを取り消します

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

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

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

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

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

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

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

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

    質問の評価を下げる

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

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

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

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

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

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

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

    詳細な説明はこちら

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

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

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

回答 3

checkベストアンサー

+2

2が出るまでは無限に続くはず!と思いfor(;;)などと書いて見ましたが永遠に外れた場合のpromptが繰り返されるだけでした・・・

かなり惜しい!
ここはfor文の中に書き込むルールを押さえれば完璧に書けそう

for文は3つのルールを;で区切って配置するループ文
よくある10回のループを回す場合の書き方はこうfor (int i = 0; i < 10; i++) {

  • 初期設定: (例)int i = 0 <- iという変数を宣言する
  • 継続条件: (例)i < 10 <- trueに評価され続ける限り実行
  • 1ループ毎の処理: (例)i++ <- for文の最後に来るたびにこれが実行される

今回のケースは無限に続くはずなので、2つ目にはtrueという固定値を設定する。
これで無限ループの完成。
今度は無限ループの抜け方だけどbreakという文がJSには用意されてて、コレを実行すれば抜けられる。

for (; true; ) {
  if (numbers === 2) {
    alert ('Good job! See what happens next :)');
    break;
  } else {
    prompt ('Ops! Maybe, another try?');
  }
}

breakは質問文の時点で既に使ってるね、Good!


じゃあダメな所を見ていこう。
if (numbers === 2)が今回のダメな所。

ループの上を見ればlet numbers = [1, 2, 3, 4, 5]とnumbersを宣言しているね。
これってそもそも配列だからnumbers === 2を比較してもfalseになる。
そしてelseの方に入るわけだ。

でもprompt ('Ops! Maybe, another try?')は実行されるとどうなるの?
MDNのサイトでpromptに関して調べると…

result = window.prompt( text, value );
result は、ユーザによって入力されたテキスト、または、null 値を含む文字列です。

この質問文を見る限り、numbers[1, 2, 3, 4, 5]は一生変化しないね。
そして次のループでも変化しない[1, 2, 3, 4, 5] === 2を比較してelseに入るってわけ。

じゃあ、どうすればいいか?
例えばlet number = prompt('What do you guess?');みたいな書き方で入力値を受け取り、
numberを確認すればいい。

でもpromptの戻り値は必ず文字列になるから、`number === 2だとfalseになるので、
if (parseInt(number) === 2)みたいにすればいいんじゃない?

投稿

  • 回答の評価を上げる

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

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

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

  • 回答の評価を下げる

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

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

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

  • 2018/07/30 18:13

    わああ〜〜優しく丁寧に書いてくださってありがとうございます;;
    for文について勉強になりました!(; true;)という書き方もあるんですね。
    parseInt()というもの初めて見ました・・・文字列を整数に変換してくれるんですね。今の自分に上手く扱える自信がないのですが覚えておきます><
    実は他のサイトでもアドバイスいただいていまして、miyabi-sunさんからいただいたアドバイスとの合作で正常に動くようになりましたので上の自己解決方法にてコードupさせていただきますね!本当にありがとうございました^^

    キャンセル

+2

<2>でpromptで入力を促していますね?
では、そこで入力された値はどうなりましたか?
prompt の使い方をまず確認してみてください。

投稿

  • 回答の評価を上げる

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

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

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

  • 回答の評価を下げる

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

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

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

  • 2018/07/29 18:35

    値を入力しても何も起きず、prompt ('Ops! Maybe, another try?');が延々と繰り返されるだけです・・・この答え方で合ってるでしょうか?? prompt('What do you guess?');の下にconsole.log(this.prompt)と打って見ましたがconsoleには何も表示されず白紙でした。

    キャンセル

  • 2018/07/29 18:42

    prompt は戻り値を持ちます。
    var result = prompt("Question");
    とすれば、resultに入力された値が入ります。
    prompt で入力された値を得ることが出来たら、次はどうすればいいのか考えましょう。

    キャンセル

  • 2018/07/30 00:47

    ご指摘いただいたpromptの部分を
        let result = prompt('What do you guess?');
        console.log(result);
    に変更し、if文の部分を
    if (result === 2) {
    alert ('Good job! See what happens next :)');
    break;
    } else {
    prompt ('Ops! Maybe, another try?');
    }
    として見ました!おっしゃりたかったこととあってますでしょうか??

    キャンセル

  • 2018/07/30 08:02

    おはようございます。
    返事が来るまでにだいぶ時間がかかったようなのでいろいろ試したのでしょうか?
    自分も大したことはできないのですが、少し偉そうな書き方をすることをご了承ください。
    もし、いろいろ試したのであれば、最初に正解すれば正しくメッセージを出力して終了するが、一度間違えてから正解しようとしてもうまくいかないことに気付いているはずです。
    指摘されたところを変更したら動いた、ではなく、なぜ指摘されたところを変更したら動くようになったのかを考えるよう心がけてください。

    出された料理を食べているだけではいけません。自分で料理ができるようにならないといつまでたっても自立できませんよ。

    キャンセル

  • 2018/07/30 16:02

    おはようございます!はい、おっしゃっていただいた部分はすぐ直せたのでそこからどうやって完成に導けるかググったりして考えたのですが・・・全然進まずでした。
    そしてメッセージですが永遠にprompt ('Ops! Maybe, another try?');が出力されるのみで、入力された数字が正解か不正解かも判断できていないコードになっているようです;

    こういう場所に質問させていただくと厳しい意見もいただくであろうこと重々承知して書いております。しかし1時間考えて「わかんないわ〜」と書いたわけではなく2日経っても3日経ってもこれ以上自力でコードを書き進められなかったという背景でして・・・いつもならメンターさんに聞くのですが彼女がホリデーのためこちらで質問させていただきましたm(_ _)m

    キャンセル

0

        alert ('You got 5 guesses. Guess 1 to 5');

        let number = prompt('What do you guess?');
        console.log(number);

        let correctAnswer = '2';
        let wrongAnswers = ['1', '3', '4', '5'];

        for (; true;) {
            if (number === correctAnswer) {
                alert ('Good job! See what happens next :)');
                break;
            } else if (wrongAnswers.indexOf(number) >= 0) {
                number = prompt('Ops! Maybe, another try?');
            } else {
                number = prompt('Please guess 1 to 5!');
            }
        }

投稿

  • 回答の評価を上げる

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

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

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

  • 回答の評価を下げる

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

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

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

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

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

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

  • JavaScript

    17587questions

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