두 가지 기능 (동적 퀴즈)

Question

배경

나는이 course에 절정으로 자바 스크립트로 작성된 동적, 객관식 퀴즈를 만드는 오전의 반환 값을 비교한다. 나는 과정의 저자에 의해 후속 조치 post에서 개략적으로 설명 된 기생적인 상속 패턴을 따르고 있으며 프로젝트를 완료하는 데 어려움을 겪고 있습니다.

문제

이 JSBIN을 참조하면, 당신은 내가 loadQuestion, displayQuestion, getUserAnswer, getCorrectAnswer 및 checkAnswer에 기능을 만든 것을 볼 수 있습니다. checkAnswer는 내가 붙어있는 곳입니다. 이 함수에서 getUserAnswer의 반환 값이 현재로드 된 질문의 getCorrectAnswer 반환 값과 같은지 확인하고, 그렇다면 지금은 콘솔에 문자열을 기록하는 것과 같습니다.

Question.prototype.displayQuestion = function(){ 
    var questionToDisplay = '<div class="question">' + this.question + '</div><ul>'; 
    choiceCounter = 0; 
    var quizDiv = document.getElementById('quiz'); 
    this.choices.forEach(function(eachChoice){ 
     questionToDisplay += '<li><input type="radio" name="choice" value="' + choiceCounter + '">' + eachChoice + '</li>'; 
     choiceCounter++; 
    }); 
    questionToDisplay += '</ul>'; 
    quizDiv.innerHTML = questionToDisplay; 
}; 

var i = 0; 
Question.prototype.loadQuestion = function(){ 
    if(i < allQuestions.length){ 
     var quest = new MultipleChoiceQuestion(allQuestions[i].question, allQuestions[i].choices, allQuestions[i].correctAnswer); 
     quest.displayQuestion(); 
     i++; 
     return quest.getCorrectAnswer(); 
    } 
}; 

Question.prototype.getCorrectAnswer = function() { 
    return this.correctAnswer; 
}; 

Question.prototype.getUserAnswer = function(){ 
    var radio = document.getElementsByName('choice'); 
    for(var i=0; i < radio.length; i++){ 
     if(radio[i].checked){ 
      return radio[i].value; 
     } 
    } 
}; 

//Non-functioning code, this is what im trying to figure out. 

/*Question.prototype.checkAnswer = function(){ 
    if(Question.prototype.loadQuestion() == Question.prototype.getUserAnswer()){ 
     console.log('it worked!'); 
    } else { 
     console.log('keep trying!'); 
    } 
};*/ 

//Load the first question 
Question.prototype.loadQuestion(); 

var button = document.getElementById('next'); 
button.onclick = function(){ 
    //get the user-selected radio input. 
    Question.prototype.getUserAnswer(); 

    //Question.prototype.checkAnswer(); 

    //load next question 
    Question.prototype.loadQuestion(); 
}; 

나는 자바 스크립트 (및 프로그래밍)을 처음 사용하고 있으며, 그 문제는 반환 값의 작동 방식에 대한 오해에서 비롯된 것이라고 생각합니다.

감사합니다.

Answer 1

발견.

당신은 radio [i]의 값에 1을 더하지 않을 것입니다. 나는 문제가 내 접근 방식을 더했습니다 지금 실현

Question.prototype.getUserAnswer = function(){ 
    var radio = document.getElementsByName('choice'); 
    for(var i=0; i < radio.length; i++){ 
     if(radio[i].checked){    
      return +(radio[i].value) + 1; 
     } 
    } 
}; 

Answer 2

:이 배열이며, 우리가 여기에

0부터 계산을 시작하기 때문에 그래서 모든 인덱스가 1 감소 될 것을 기억하면 기능입니다 어느 한 오류보다. 나는 다른 학생의 모범을 따라 갔다. 프로젝트는 그대로 repo입니다. 내가 배운 가장 중요한 것은 모든 기능에 액세스가 필요한 변수를 캡슐화하는 방법입니다. 이 경우, 증가하고 모든 기능에 사용할 수있는 currentQuestionIndex라는 변수가 솔루션에 중요했습니다.