遍历对象数组

时间:2019-08-07 16:00:10

标签: javascript

我需要遍历对象数组,并提示用户输入学生的姓名。如果名称存在,我需要将学生的数据打印到屏幕上,或者继续进行迭代,直到用户键入退出为止。

我遇到的问题是,如果键入最后一个对象的学生的姓名,则在循环完成之前,不会打印学生的记录。

请参见下面的代码:

var students = [{
    name: 'hacene',
    track: 'Full Stack JavaScript',
    achievements: 12,
    points: 1226
  },
  {
    name: 'dave',
    track: 'PHP Development',
    achievements: 128,
    points: 14868
  },
  {
    name: 'layla',
    track: 'iOS Development',
    achievements: 8,
    points: 901
  },
  {
    name: 'mika',
    track: 'Front-End Development',
    achievements: 15,
    points: 1666
  },
  {
    name: 'heisenberg',
    track: 'Blue Meth Manufacturing',
    achievements: 99,
    points: 9999
  }
];

var student;
var records = '';
var search;

// Print function to print the content
function print(message) {
  var outputDiv = document.getElementById('output');
  outputDiv.innerHTML = message;
}

// Access each students records in the array / a loop is needed to achieve this
for (var i = 0; i < students.length; i++) {
  student = students[i];
  console.log(student);
  search = prompt('Please enter a student\'s name to see his records: ');
  search = search.toLocaleLowerCase();
  console.log(search);
  if (search === student.name) {
    records += '<h2><strong>Student: ' + student.name + '</strong><h2>';
    records += '<p>Track: ' + student.track + '</p>';
    records += '<p>Points: ' + student.points + '</p>';
    records += '<p>Achievements: ' + student.achievements + '</p>';
    break;
  } else if (search === 'quit') {
    break;
  }
}

// Print the students' name; track, achievments and points
print(records);

我需要的是,即使学生是列表中的最后一个,也能从第一个提示打印学生的记录。

3 个答案:

答案 0 :(得分:2)

您所做的更像是一个猜谜游戏:“在for循环中找到当前学生的姓名” 我不知道您是否仍然需要答案,但是您可以:

您只需要将提示放在for循环之前。 提示后,您进行循环,如果找到结果,则停止。

var students = [{
    name: 'hacene',
    track: 'Full Stack JavaScript',
    achievements: 12,
    points: 1226
  },
  {
    name: 'dave',
    track: 'PHP Development',
    achievements: 128,
    points: 14868
  },
  {
    name: 'layla',
    track: 'iOS Development',
    achievements: 8,
    points: 901
  },
  {
    name: 'mika',
    track: 'Front-End Development',
    achievements: 15,
    points: 1666
  },
  {
    name: 'heisenberg',
    track: 'Blue Meth Manufacturing',
    achievements: 99,
    points: 9999
  }
];

var student;
var records = '';
var search;

// Print function to print the content
function print(message) {
  var outputDiv = document.getElementById('output');
  outputDiv.innerHTML = message;
}
  search = prompt('Please enter a student\'s name to see his records: ');
// Access each students records in the array / a loop is needed to achieve this
for (var i = 0; i < students.length; i++) {
  student = students[i];
  search = search.toLocaleLowerCase();

  if (search === student.name) {
    records += '<h2><strong>Student: ' + student.name + '</strong><h2>';
    records += '<p>Track: ' + student.track + '</p>';
    records += '<p>Points: ' + student.points + '</p>';
    records += '<p>Achievements: ' + student.achievements + '</p>';
    break;
  }
}

// Print the students' name; track, achievments and points
print(records);
<div id="output"></div>

您可以在循环中添加if语句。

if( search != "quit") {
for (var i = 0; i < students.length; i++) {
  student = students[i];
  search = search.toLocaleLowerCase();

  if (search === student.name) {
    records += '<h2><strong>Student: ' + student.name + '</strong><h2>';
    records += '<p>Track: ' + student.track + '</p>';
    records += '<p>Points: ' + student.points + '</p>';
    records += '<p>Achievements: ' + student.achievements + '</p>';
    break;
  }
}
}

使用它,如果您键入quit,您将不会进入循环。

即使它不能满足您的要求,更好的方法还是使用find方法。

var students = [{
    name: 'hacene',
    track: 'Full Stack JavaScript',
    achievements: 12,
    points: 1226
  },
  {
    name: 'dave',
    track: 'PHP Development',
    achievements: 128,
    points: 14868
  },
  {
    name: 'layla',
    track: 'iOS Development',
    achievements: 8,
    points: 901
  },
  {
    name: 'mika',
    track: 'Front-End Development',
    achievements: 15,
    points: 1666
  },
  {
    name: 'heisenberg',
    track: 'Blue Meth Manufacturing',
    achievements: 99,
    points: 9999
  }
];

var student;
var records = '';
var search;



// Print function to print the content
function print(message) {
  var outputDiv = document.getElementById('output');
  outputDiv.innerHTML = message;
}
function write(student) {
    records += '<h2><strong>Student: ' + student.name + '</strong><h2>';
    records += '<p>Track: ' + student.track + '</p>';
    records += '<p>Points: ' + student.points + '</p>';
    records += '<p>Achievements: ' + student.achievements + '</p>';
    print(records);
}


search = prompt('Please enter a student\'s name to see his records: ');
student = students.find((element) => {
  if (element.name == search) {
    return true;
  }
})
if (student) {
  write(student);
  
};

// Print the students' name; track, achievments and points
<div id="output"></div>

答案 1 :(得分:0)

  

我需要遍历对象数组,并提示用户输入学生的姓名。如果名称存在,我需要将学生的数据打印到屏幕上,或者继续进行迭代,直到用户键入退出为止。

您需要重新考虑算法:

get input from user
while user does not enter "quit"
    for each object in list
       if name is the same as input
           output the record
    get input from user

请注意,您需要从用户那里获取输入,然后遍历列表以搜索正确的对象。

或者,您可以使用对象而不是列表。该外部对象将以学生的姓名为键,而对象记录为值。现在,您可以为用户输入的学生姓名建立索引,以直接获取记录,而无需搜索列表。

答案 2 :(得分:0)

您需要继续提示用户,直到他们输入quit或您有一个匹配项为止,而不是绕过学生提示用户。

类似这样的东西:

var quit = false
while(!quit) {
    search = prompt('Please enter a student\'s name to see his records: ');
    search = search.toLocaleLowerCase();

    if (search === 'quit') {
        quit = true;
        continue;
    }

    // search for student here and if match is found then set quit to true
}