【问题标题】:Javascript Array Index not working properlyJavascript 数组索引无法正常工作
【发布时间】:2015-10-30 18:41:58
【问题描述】:

我目前正在尝试制作一个小提示游戏,它会根据用户选择的类别和难度显示问题。我正在尝试使用最少的代码来做到这一点,因此它最有效。

目前正在发生的事情是,我将类别保存在一个名为类别的变量中,并将难度值保存在一个名为难度的变量中。当我尝试访问我的数组时,我使用category[difficulty].question,因为我根据数组的类别命名了我的数组。

但是,它不是索引正确的元素,而是尝试拼写类别的单词。即如果类别是地理并且难度很简单,我正在尝试使用category[difficulty].question 访问geography[0].question。但相反,我得到了 geography 的第一个字母,所以控制台日志中显示的只是字符串字母 g。

谁能解释为什么会发生这种情况,并提出解决方案。

附言我知道 switch 语句不再常用,但这是一个作业,我必须使用它们。

//Set up variables

var difficulty;
var geography = [

  {
    question: 'What is the captial of Canada? ',
    answer: 'ottawa',
  },

  {
    question: 'Where are the oil sands located? ',
    answer: 'alberta',
  },

  {
    question: 'What is the capital of Nunavut?',
    answer: 'iqaluit',
  },

  {
    question: 'What is the capital of the Northwest Territories?',
    answer: 'yellowknife',
  },

];

var history = [

  {
    question: 'What year was Canada founded?',
    answer: '1867',
  },

  {
    question: 'What year did we engage in war against the United States?',
    answer: '1812',
  },

  {
    question: 'Difficult history question',
    answer: 'Difficult history answer',
  },

  {
    question: 'Fiendish history question',
    answer: 'Fiendish history answer',
  },

];

var artsAndCulture = [

  {
    question: 'Easy Arts and Culture Question',
    answer: 'Easy Arts and Culture Answer',
  },

  {
    question: 'Medium Arts and Culture Question',
    answer: 'Medium Arts and Culture Answer',
  },

  {
    question: 'Difficult Arts and Culture Question',
    answer: 'Difficult Arts and Culture Answer',
  },

  {
    question: 'Fiendish Arts and Culture Question',
    answer: 'Fiendish Arts and Culture Answer',
  },

];



//Sets up first user prompt and sets the value of category to the value the user entered

var category = prompt("Please select a category:\n\ngeography\nhistory\narts and culture\n");
switch (category) {
  case "geography":
    console.log('You have selected the geography category');
    console.log('The value of category is ' + category);
    break;
  case "history":
    console.log('You have selected the history category');
    console.log('The value of category is ' + category);
    break;
  case "artsAndCulture":
    console.log('You have selected the arts and culture category');
    console.log('The value of category is ' + category);
    break;
  default:
    console.log('default');
}


//Sets up second user prompt and sets the value of difficulty based on the user selection

var input2 = prompt("Please select a difficulty:\n\neasy\nmedium\ndifficult\nfiendish\n");
switch (input2) {
  case "easy":
    console.log('You have selected the easy difficulty');
    difficulty = 0;
    console.log('The value of difficulty is ' + difficulty);
    compareAnswer();
    break;
  case "medium":
    console.log('You have selected the medium difficulty');
    difficulty = 1;
    console.log('The value of difficulty is ' + difficulty);
    compareAnswer();
    break;
  case "difficult":
    console.log('You have selected the difficult difficulty');
    difficulty = 2;
    console.log('The value of difficulty is ' + difficulty);
    compareAnswer();
    break;
    case "fiendish":
    console.log('You have selected the fiendish difficulty');
    difficulty = 3;
    console.log('The value of difficulty is ' + difficulty);
    compareAnswer();
    break;
  default:
    console.log('default');
}


//compares user answer to actual answer
function compareAnswer() {

  var x = prompt(category[difficulty].question);
  console.log(category[difficulty]);
  console.log('You answered ' + x);
  console.log('The correct answer is ' + category[difficulty].answer);
  if (x == category[difficulty].answer) {
    console.log('You answered correctly!');
  } else {
    console.log('You answered incorrectly, the correct answer was ' + category[difficulty].answer);
  }
}

【问题讨论】:

标签: javascript arrays object switch-statement


【解决方案1】:

我想把类别数组变成一个对象:

var selection={
  'geography': [{
    question: 'What is the captial of Canada? ',
    answer: 'ottawa'
  },{
    question: 'Where are the oil sands located? ',
    answer: 'alberta'
  },{
    question: 'What is the capital of Nunavut?',
    answer: 'iqaluit'
  },{
    question: 'What is the capital of the Northwest Territories?',
    answer: 'yellowknife'
  }],
'history':[{
    question: 'What year was Canada founded?',
    answer: '1867'
  },
  {
    question: 'What year did we engage in war against the United States?',
    answer: '1812'
  },{
    question: 'Difficult history question',
    answer: 'Difficult history answer'
  },{
    question: 'Fiendish history question',
    answer: 'Fiendish history answer'
  }],
'artsAndCulture': [{
    question: 'Easy Arts and Culture Question',
    answer: 'Easy Arts and Culture Answer'
  },{
    question: 'Medium Arts and Culture Question',
    answer: 'Medium Arts and Culture Answer'
  },{
    question: 'Difficult Arts and Culture Question',
    answer: 'Difficult Arts and Culture Answer'
  },{
    question: 'Fiendish Arts and Culture Question',
    answer: 'Fiendish Arts and Culture Answer'
}]};

然后去质疑用户使用:

var x = prompt(selection[category][difficulty].question);

【讨论】:

  • 请注意,此答案还修复了 OP 在右方括号之前的尾随逗号的语法错误。 IOW,数组中的最后一个元素后面不应该有逗号。
  • @Jared 尾随逗号在 ES5 对象和数组中有效,但在 JSON 数据字符串中无效。
【解决方案2】:

您为category 分配了一个字符串值,但将其用作数组引用。

假设您的 javascript 是在全局上下文中编写的:

var x = prompt(window[category][difficulty].question);

其他问题包括答案的大小写可能存在差异以及\narts and culture\n");case "artsAndCulture": 不匹配。

【讨论】:

  • 打败了我。作为解释:window[string value] 会将字符串值转换为变量;如果存在。
  • 非常感谢,我不知道在我的数组索引前使用窗口会将其转换为变量。我选择了列为最佳答案的另一个答案,但仍然给你一个赞成票,因为它非常有用,我只是认为另一个答案在这个特定情况下对我最有用
  • @KyleBing - 它不是“前面的窗口”,而是使用 [] 中的名称(作为字符串)访问 javascript 对象属性的不同方式。此处使用window 是因为在全局上下文中定义的变量成为全局window 对象的属性。编码愉快。
  • @Igor 感谢您的澄清,我还是个 js 新手,但我正在尽我所能改进,祝您编码愉快
【解决方案3】:

尝试将类别合并到一个对象中,例如 var categories = {geo:[], history:[]};并从此对象中选择类别,例如类别 [类别] [难度]。在您的示例类别中只是一个字符串,从 promt 返回,未链接到数组或对象。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-11-09
    • 1970-01-01
    • 1970-01-01
    • 2022-01-06
    相关资源
    最近更新 更多