Return values and variable scope in Javascript

Question

Im having some trouble working out how to correctly return a value within one function and pass it to another. The variable is randomQuestion, and I cant get it to appear in the functions as an integer. The idea is that the same question ID is used in both functions, so for example in the second function I can use it to determine which question was asked, and find the correct answer to match it against the user input.

$('#quiz').on('click', beginQuiz);
$('#giveanswer').on('click', nextQuestion);

var randomQuestion = Math.floor(Math.random() * questions.length);

function beginQuiz(randomQuestion) {

    $("#questions tbody tr").remove();
    document.getElementById("questions").deleteTHead();

    //Get the JSON data from our HTML and convert it to a JavaScript object
    //In the real world, this data will likely be retrieved  from the server via an AJAX request
    var questions = JSON.parse(document.getElementById('questions-json').innerHTML);



    console.log(randomQuestion);

    var quizQuestion = questions[randomQuestion];


    var tblRow = '<tr>' + '<td>' + quizQuestion.q_text + '</td>' + '</tr>'
        //Add our table row to the 'questions' <table>
    $(tblRow).appendTo('#questions tbody');

    document.getElementById('answers').style.display = 'block';
    document.getElementById('answerlabel1').innerHTML = quizQuestion.q_options_1;
    document.getElementById('answerlabel2').innerHTML = quizQuestion.q_options_2;
    document.getElementById('answerlabel3').innerHTML = quizQuestion.q_options_3;
    document.getElementById('answerlabel4').innerHTML = quizQuestion.q_options_4;

    return randomQuestion;
}

function nextQuestion(randomQuestion) {

    console.log(randomQuestion);
    //Get the JSON data from our HTML and convert it to a JavaScript object
    //In the real world, this data will likely be retrieved  from the server via an AJAX request
    var questions = JSON.parse(document.getElementById('questions-json').innerHTML);
    var score = 0;
    var playeranswer = $('input:radio[name=answer]:checked').val();
    var correctanswer = questions[randomQuestion].q_correct_option;

    if (playeranswer == questions.q_correct_option) {
        score++
        document.getElementById('score').innerHTML = score;
    }
}

using different variable name than randomQuestion will help — sam
– sam, Commented Oct 7, 2015 at 13:21

Shilly · Accepted Answer · 2015-10-07 13:20:56Z

2

Remove the randomQuestion parameter from both your function declarations, since it's a global. As written, both your functions look at their own local raqndomQuestion variable, which is undefined.

answered Oct 7, 2015 at 13:20

Shilly

8,5991 gold badge20 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user3052485 Over a year ago

Ah I see, this makes sense. If I wanted to then use the global variable within the second function, however it had changed locally, would it then be overwritten when the function is called along with the global variable?

Shilly Over a year ago

If you change the global inside a function, it will get changed globally, so the next function will use the changed value.

Collectives™ on Stack Overflow

Return values and variable scope in Javascript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related