Javascript 在数组中显示下一个对象值

我有一个由两个对象组成的数组。当用户按下按钮时，我希望显示特定对象属性的下一个值

这是我的阵列：

var allQuestions = [{
    question: "This is question number one",
    choices: ["one", "two", "three", "four"],
    correctAnswer: "two"
}, {
    question: "This is question number two",
    choices: ["dog", "cat", "bear", "lion"],
    correctAnswer: "bear"
}];

按下按钮时，我希望显示下一个“问题”实例

以下是我的功能，用于转换问题：

function switchQuestion() {

    var singleQuestion = 0;

    if(singleQuestion >= allQuestions.length) {
        singleQuestion == 0;
    } else {
        singleQuestion == ""; // not sure what should go here
    }

    document.getElementById('question').innerHTML = allQuestions[singleQuestion].question;

}

在此代码中：

if(singleQuestion >= allQuestions.length) {
        singleQuestion == 0;
    } else {
        singleQuestion == ""; // not sure what should go here
    }

作业是用

=

而不是

=

完成的：

if (singleQuestion >= allQuestions.length) {
    singleQuestion = 0;
} else {
    singleQuestion = singleQuestion + 1; // increment
}

增量也可以通过以下简短形式实现：

singleQuestion++;

也可以使用模量计算替换整个表达式：

singleQuestion = (singleQuestion + 1) % allQuestions.length;

最后，变量singleQuestion必须在函数之外定义

在此代码中：

if(singleQuestion >= allQuestions.length) {
        singleQuestion == 0;
    } else {
        singleQuestion == ""; // not sure what should go here
    }

作业是用

=

而不是

=

完成的：

if (singleQuestion >= allQuestions.length) {
    singleQuestion = 0;
} else {
    singleQuestion = singleQuestion + 1; // increment
}

增量也可以通过以下简短形式实现：

singleQuestion++;

也可以使用模量计算替换整个表达式：

singleQuestion = (singleQuestion + 1) % allQuestions.length;

---

最后，变量singleQuestion必须在函数之外定义

您需要在函数之外确定问题索引的范围，每次单击按钮时递增，并在超出数组边界时将其重新分配回0：

var questionIndex = 0;
function switchQuestion() {
  if(++questionIndex >= allQuestions.length) {
    questionIndex = 0;
  }

  document.getElementById('question').innerHTML = allQuestions[singleQuestion].question;
}

---

您需要在函数外部确定问题索引的范围，每次单击按钮时递增，并在超出数组边界时将其重新分配回0：

var questionIndex = 0;
function switchQuestion() {
  if(++questionIndex >= allQuestions.length) {
    questionIndex = 0;
  }

  document.getElementById('question').innerHTML = allQuestions[singleQuestion].question;
}

---

您需要将currentQuestion存储在某个位置，然后在单击时将其递增

  var singleQuestion = 0;

  function switchQuestion() {

  if(singleQuestion >= allQuestions.length) {
      singleQuestion == 0;
   } else {
    singleQuestion +=1; 
   }

document.getElementById('question').innerHTML = allQuestions[singleQuestion].question;

 }

---

目前，您每次单击时都会将其重置为0，而不管如何，并且只会根据长度显示第一个或第二个问题。您需要将当前问题存储在某个位置，然后在单击时将其递增

  var singleQuestion = 0;

  function switchQuestion() {

  if(singleQuestion >= allQuestions.length) {
      singleQuestion == 0;
   } else {
    singleQuestion +=1; 
   }

document.getElementById('question').innerHTML = allQuestions[singleQuestion].question;

 }

目前，您每次单击时都会将其重置为0，而不管如何，并且只会根据长度显示第一个或第二个问题。下面的示例显示了脚本的可能实现

我建议只使用一个全局对象。
并使用

.createElement（）

而不是

.innerHTML（）

。这是一本书

简言之：

var myGlobalVar = {
    singleQuestion: 0,
    nextButton: document.getElementById("nextQstBtn"),
    questionHolder: document.getElementById("questionHolder"),
    allQuestions: [qstObjOne, qstObjTwo, qstObjThree],

    switchQuestion: function () {
        myGlobalVar.singleQuestion += 1;
        if (myGlobalVar.singleQuestion === myGlobalVar.allQuestions.length) {
                myGlobalVar.singleQuestion = 0;
        }
        myGlobalVar.showQuestion(myGlobalVar.singleQuestion);
    },
    showQuestion: function (qstNum) {
        // Implementation
    },
    init: function () {
        // Script initialisation
        // Attaching events, etc.
};

myGlobalVar.init();

下面的示例显示了脚本的可能实现

我建议只使用一个全局对象。
使用

.createElement（）

而不是

.innerHTML（）

。这是一本书

简言之：

var myGlobalVar = {
    singleQuestion: 0,
    nextButton: document.getElementById("nextQstBtn"),
    questionHolder: document.getElementById("questionHolder"),
    allQuestions: [qstObjOne, qstObjTwo, qstObjThree],

    switchQuestion: function () {
        myGlobalVar.singleQuestion += 1;
        if (myGlobalVar.singleQuestion === myGlobalVar.allQuestions.length) {
                myGlobalVar.singleQuestion = 0;
        }
        myGlobalVar.showQuestion(myGlobalVar.singleQuestion);
    },
    showQuestion: function (qstNum) {
        // Implementation
    },
    init: function () {
        // Script initialisation
        // Attaching events, etc.
};

myGlobalVar.init();

---

好的，太好了，谢谢你。你能解释一下为什么我需要在函数之外定义问题索引，或者给我指一些阅读资源吗？另外，我五分钟内不能接受你的答案。我会尽快接受它。@user2137425如果每次调用时都不在函数外定义问题索引的范围，则上一个

questionIndex

将被遗忘（即您当前显示的问题的知识将丢失），因此您永远无法移动到下一个问题确定，很好，谢谢。你能解释一下为什么我需要在函数之外定义问题索引，或者给我指一些阅读资源吗？另外，我五分钟内不能接受你的答案。我会尽快接受它。@user2137425如果每次调用时都不在函数外定义问题索引的范围，则上一个

questionIndex

将被遗忘（即您当前显示的问题的知识将丢失）因此，您永远不能移动到下一个问题您还需要在函数外部设置范围

singleQuestion

，否则它将始终为零或一您还需要在函数外部设置范围

singleQuestion

，否则它将始终为零或一