javascript - 未定义传递给数组

Question

我有测验应用程序的代码。问题是，undefined 以某种方式传递给数组 choices。

'use strict';

var quiz,
  actualQuestion = 1,
  getChoices,
  generateHtml,
  html = '',
  choices = [];

quiz = [{
  question: "Who is Prime Minister of the United Kingdom?",
  choices: ["David Cameron", "Gordon Brown", "Winston Churchill", "Tony Blair"],
  correctAnswer: 0
}, {
  question: "Who is Prime Minister of the United Kingdom2?",
  choices: ["David Cameron", "Gordon Brown", "Winston Churchill", "Tony Blair"],
  correctAnswer: 0
}];

getChoices = function() {
  for (var i = 0; i < quiz[actualQuestion].choices.length; i++) {
    choices[i] += quiz[actualQuestion].choices[i];
    console.log(choices[i]);
  }
}

generateHtml = function() {
  for (var i = 0; i < choices.length; i++) {
    html += '<label>' +
      '<input type="radio" name="answer">' +
      choices[i] +
      '</label>';
  }
}

getChoices();
generateHtml();

document.getElementById('answers').innerHTML = html;
console.log(
  html
);

<form id="quiz">
  <div id="question">

  </div>
  <div id="answers">

  </div>
  <input type="button" value="Next">
</form>

Answer 1

问题是 choices[i] += quiz[actualQuestion].choices[i];，choices[i] 的值未定义，因为您正在定义一个空数组，所以你有 choices[i] = undefined + quiz[actualQuestion].choices[i];

只需将其更改为 choices[i] = quiz[actualQuestion].choices[i];

'use strict';

var quiz,
  actualQuestion = 1,
  getChoices,
  generateHtml,
  html = '',
  choices = [];

quiz = [{
  question: "Who is Prime Minister of the United Kingdom?",
  choices: ["David Cameron", "Gordon Brown", "Winston Churchill", "Tony Blair"],
  correctAnswer: 0
}, {
  question: "Who is Prime Minister of the United Kingdom2?",
  choices: ["David Cameron", "Gordon Brown", "Winston Churchill", "Tony Blair"],
  correctAnswer: 0
}];

getChoices = function() {
  for (var i = 0; i < quiz[actualQuestion].choices.length; i++) {
    choices[i] = quiz[actualQuestion].choices[i];
    console.log(choices[i]);
  }
}

generateHtml = function() {
  for (var i = 0; i < choices.length; i++) {
    html += '<label>' +
      '<input type="radio" name="answer">' +
      choices[i] +
      '</label>';
  }
}

getChoices();
generateHtml();

document.getElementById('answers').innerHTML = html;
console.log(
  html
);

<form id="quiz">
  <div id="question">

  </div>
  <div id="answers">

  </div>
  <input type="button" value="Next">
</form>