javascript - 我可以通过使用该对象中的另一个值来获取数组中对象内部的特定值吗？

Question

我有多个数组，其中包含三个键/值对、姓名、电话号码和首字母缩写的对象。我有一个循环，它创建一个复选框列表并将初始值设置为它的类。我试图弄清楚如何在选中该框时从相应的对象中提取电话号码值并将其保存到一个单独的数组中。例如:如果选中类为“.BRJ”的框，则将该对象中的 1222222222 编号保存到新数组中。

我知道我可以在输入中运行 onclick 函数，但我终究无法弄清楚如何找到与该复选框匹配的电话号码。

const management = [
  { name: 'Bob Jones', number: 12222222222, initials: 'BRJ',},
  { name: 'Peter Jones', number: 1333333333, initials: 'PRJ',},   
];

const operatorLoop = (shift, list) => {

  for (var i = 0; i < shift.length; i++) {
    list.innerHTML += `
    <li><input type = 'checkbox' class ='${shift[i].initials}' 
    >${shift[i].name}</input></li>
  `}
}

operatorLoop(management, mgmtUl);

Answer 1

您实际上可以在 <li> 的数据属性中设置电话号码元素，并在单击复选框时获取数据属性值并将其推送到电话号码数组。

const selectedPhoneNumbers = [];
function clickHandler(e) {
  const phoneNumber = e.target.getAttribute('data-phone');
  selectedPhoneNumbers.push(phoneNumber);
}
const operatorLoop = (shift, list) => {
  for (var i = 0; i < shift.length; i++) {
    list.innerHTML += `
      <li><input type = 'checkbox' data-phone='${shift[i].number}' class ='${shift[i].initials}'>
        ${shift[i].name}</input>
      </li>`
   }
}

这样，您就不必 find对象中的点击项(在数组内部是另一个循环)。