F . R . I . N . D . Sクイズの構築


このチュートリアルでは、我々の最初のプロジェクトを作成することを学ぶRepl.it
もう待たずに始めましょう.

必要条件:
  • アカウントを作成するRepl.it .
  • あなたのクイズの質問、オプションと質問の正しい答えを準備します.
  • マーキングスキームを含む青写真を作成し、含まれるレベルの構造.(オプション)

  • REPLを理解する
    REPLにおける「REPL」これは対話型プログラミング環境です.私たちは、最も人気のあるプログラミング言語でワークスペースを作成することができます.それは私たちがコードを作成し、ブラウザを使用してアプリやウェブサイトを構築することができます.また、様々な方法でプロジェクトを共有することもできます.

    パッケージのインポート
    これは私たちのプロジェクトの作成のための最も重要なコマンドです.パッケージをインポートするreadline-sync and chalk .
  • readline-sync - 我々のコンソールがユーザーとの「会話」を持つのを許します.基本的に、ユーザーからの入力を取るために使用します.入力は任意のデータ型Eg - String、整数等である.
  • chalk パッケージは、プロジェクトの美化に使用されます.チョークの助けを借りて様々なテキストの色、背景色やスタイルを私たちのテキストを紹介することができます.
  • これらのパッケージをコマンドを使ってインポートします.
    var readline = require('readline-sync');
    var chalk = require('chalk');
    

    ユーザからの入力
    次に、私たちは自分の名前を表示し、クイズをよりインタラクティブにするためにユーザーからの入力としてユーザー名を取る.
    readlineの同期パッケージを使用してユーザー名を入力して表示します(チョークパッケージによって色を少し高めます).
    var Username = myVar.question(chalk.red("Hi! What is your name?\n"));
    console.log(chalk.cyanBright("Welcome " + Username));
    
    注意console.log() は出力をコンソールに出力する.

    質問銀行紹介
    さて、変数名を定義しますquestionBank これには様々なJavaScriptオブジェクトが含まれます.
    オブジェクトはプロパティのコレクションであり、プロパティは名前(またはキー)と値の間の関連です.
    以下は、クイズで尋ねられる様々な質問と答えの初期化を示している例です
    var questionBank = [{
      question : "Which of the actors on Friends unfortunately decides 
    to whiten his teeth\n before going out on a first date with a girl\n
    he's had a crush on for some time?\n",
      answer : "Ross"
    },
    {
      question : "Who was Ross's second wife?\n",
      answer : "Emily"
    },
    {
      question : "Who is Gunther's roommate?\n",
      answer : "Jasmine"
    }]
    
    注意-ここで'\n 'は行を変更するために使用されます.

    機能の定義、ユーザーの確認を確認するには、実際の答えに答えます.
    関数を定義するには、キーワードを使用しますfunction , 関数の名前に続いて、それに渡されるパラメータが続きます.
    ここでは、' checkkanswer 'という関数を定義し、質問と回答を質問バンクからそのパラメータとして渡します.
    我々は、ユーザーにそれぞれの質問を出力し、我々の事前定義された答えに自分の答えを確認してください.
    function checkAnswer(question , answer){
      var userAnswer = myVar.question(chalk.cyanBright(question));
        if(userAnswer == answer){
        console.log(chalk.green("Correct."));
        score ++;
        }
    
        else{
        console.log(chalk.red("Wrong."));
        }
    }
    

    すべての質問にアクセスするためのループquestionBank -
    今、我々はループのすべてのオブジェクトにアクセスするために、ループを実行しますquestionBank それから使用function checkAnswer() ユーザーの回答を確認する.
    また、ユーザーの合計スコアをチェックし続けることができる変数スコアをご紹介します.
    var score = 0;
    for(var i = 0; i<questionBank.length; i++){
        current = questionBank[i];
        checkAnswer(current.question,current.answer);
      }
      console.log(chalk.yellowBright("Total = " + score + " out of " 
    + questionBank.length));
    
    注意questionBank.length は、questionBank リスト、以前定義しました.
    私たちのクイズが完了です!を押して実行コマンドを自分でクイズを再生します.

    お友達とクイズを共有-
    追加?EMBED = 1 &出力= 1あなたのプロジェクトのURLでクイズを共有します.EG用
    初期URLhttps://repl.it/@your-username/Project-name共有するURLhttps://repl.it/@your-username/Project-name?embed=1&output=1
    次は何ですか.
    あなたがここまでこの記事に従ったならば、私はあなたが正常にクイズをつくることができたと確信します.あなたがどんな困難に直面したならば、あなたは常に私のことを参照することができますcode .
    また、クイズの私のバージョンを再生する場合は、それを行うことができますhere .
    このチュートリアルが好きなら、あなたの友人と共有し、それらを学ぶのを助ける!
    また!これらの有益なチュートリアルの詳細については、