Question

我正在快速进行JavaScript练习，您可以从下拉菜单中选择一个年级。假定计算机返回该特定年级以下的学生列表。等级级别是对象键。学生列表是对象值。我的代码多数有效。只是无法获得我选择打印出来的年级以下学生的名单。我试图遍历数组对象，并使用选择的键将项目存储到一个空数组中，然后输出数组列表。

var listOfStudents = {
  "Freshman": "Janice Baker",
  "Sophomore": "Leon Rashad",
  "Freshman": "Jeff Grant",
  "Freshman": "Hazel Miles",
  "Junior": "Charlene Scott",
  "Junior": "Fatima Carr",
  "Senior": "Daniel Long",
  "Sophomore": "Candice Brown",
  "Sophomore": "Brian Seal",
  "Junior": "Tiffany Williams",
  "Senior": "Aaliyah Vick",
  "Senior": "Shawn Jackson",
  "Freshman": "Renee Carter",
  "Sophomore": "Russell Crane",
} // line above closes array object

var nameOfStudents = []; // empty array to store answers

function displayStudentsUnderClass(referenceList) {
  var gradeLevelSelected = $("#select-classification option:selected").val();

  /////// code above works. Returns whatever option you selected from list

  for (i = 0; i < referenceList.length; i++) {
    nameOfStudents.push(referenceList[gradeLevelSelected]);
  } // line closes for loop
  $("#studentResults").html("List of students that are <strong>" + gradeLevelSelected + "</strong>:<br/>" + nameOfStudents);
} // line closes function

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="classificationPage">
  <select id="select-classification" name="classification-list" class="classification-list">
    <option value="" selected="selected">- None -</option>
    <option value="Freshman">Freshman</option>
    <option value="Sophomore">Sophomore</option>
    <option value="Junior">Junior</option>
    <option value="Senior">Senior</option>
  </select>
  <p id="studentResults"></p> <button class="showStudents" onclick="displayStudentsUnderClass(listOfStudents)">Show Students</button>

Answer 1

上面的代码有效

不是。 :-)例如，您的listOfStudents中没有Janice Baker。看起来像是，但是稍后在对象初始化器中使用相同的属性名称（"Freshman"），就可以用新值覆盖该属性。因此，您的对象实际上就是这样：

var listOfStudents = {
  "Freshman": "Renee Carter",
  "Sophomore": "Russell Crane",
  "Junior": "Tiffany Williams",
  "Senior": "Shawn Jackson"
};

证明：

var listOfStudents = {
  "Freshman": "Janice Baker",
  "Sophomore": "Leon Rashad",
  "Freshman": "Jeff Grant",
  "Freshman": "Hazel Miles",
  "Junior": "Charlene Scott",
  "Junior": "Fatima Carr",
  "Senior": "Daniel Long",
  "Sophomore": "Candice Brown",
  "Sophomore": "Brian Seal",
  "Junior": "Tiffany Williams",
  "Senior": "Aaliyah Vick",
  "Senior": "Shawn Jackson",
  "Freshman": "Renee Carter",
  "Sophomore": "Russell Crane",
};
console.log(JSON.stringify(listOfStudents, null, 2));

至少可以做几件事：

将listOfStudents设为一个数组，而不是一个对象，并在其中将对象存储为具有该人员所在的类及其名称的属性。
新生，大二，大三和大四的单独数组，可能在一个带有类属性名称的对象中。

您所做的完全取决于您访问数据的方式。问题末尾的代码表明您将要按年级访问列表，因此需要使用单独的数组：

var studentsByClass = {
  "Freshman": [
    "Janice Baker",
    "Jeff Grant",
    "Hazel Miles",
    "Renee Carter"
  ],
  "Sophomore": [
    "Leon Rashad",
    "Candice Brown",
    "Brian Seal",
    "Russell Crane"
  ],
  "Junior": [
    "Charlene Scott",
    "Fatima Carr",
    "Tiffany Williams"
  ],
  "Senior": [
    "Daniel Long",
    "Aaliyah Vick",
    "Shawn Jackson"
  ]
};

function displayStudentsUnderClass() {
  var gradeLevelSelected = $("#select-classification").val();
  var list = studentsByClass[gradeLevelSelected];
  if (list) {
      $("#studentResults").html("List of students that are <strong>" + gradeLevelSelected + "</strong>:<br/>" + list.join(", "));
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="classificationPage">
  <select id="select-classification" name="classification-list" class="classification-list">
    <option value="" selected="selected">- None -</option>
    <option value="Freshman">Freshman</option>
    <option value="Sophomore">Sophomore</option>
    <option value="Junior">Junior</option>
    <option value="Senior">Senior</option>
  </select>
  <p id="studentResults"></p> <button class="showStudents" onclick="displayStudentsUnderClass()">Show Students</button>

JavaScript无法从数组对象中获取价值

1 个答案: