Question

这是我第一次尝试在JS上的数组中使用filer方法。谁能告诉我我在做什么错？当我执行console.log时，我在const drinksChecklist（过滤器行）之后的清单变得不确定。我不知道为什么。另外，在返回行之后是否需要最后一部分（调试器行之后）？我找不到在线上任何地方，包括MDN站点，它提供了整个功能的完整示例。请帮忙，谢谢！

function filterChecklists() {
    $('.beverages_button').on('click', function(event) {
      //console.log('click')
      event.preventDefault()
      fetch(`/checklists.json`)
      .then(resp => resp.json())
      .then(checklists => {
         $('#checklist_container').html('')
         //console.log(checklists)
         const beveragesChecklist = checklists.filter(checklist => {
           return checklist.item === 'beverages';
           //console.log(beveragesChecklist)
            //console.log(checklist)
            debugger;

           let newChecklist = new Checklist(checklist)
           let checklistHtml = newChecklist.newChecklistForm()
            $('#checklist_container').append(checklistHtml)
         });
       })
     })
 }

Answer 1

我想您正在尝试执行以下操作：

function filterChecklists() {
  $('.beverages_button').on('click', function(event) {
    event.preventDefault()
    fetch(`/checklists.json`)
    .then(resp => {
       resp.json()
         .filter(checklist => checklist.item === 'beverages')
         .map(checklist => new Checklist(checklist))
         .forEach(checklist => $('#checklist_container').html(checklist.newChecklistForm()));
    });
  });
}

Answer 2

您可以这样考虑：

const beveragesChecklist = checklists.filter(checklist => {
  return checklist.item === 'beverages';
}

与“相同”：

let tempArr = [];
for(let i = 0; i < checklists.length; i++) {
  let checklist = checklists[i];
  if(checklist.item === 'beverages') {
   tempArr.push(checklist);
  }
}
const beveragesChecklist = tempArr;

因此，最后您将在清单清单中包含符合条件的清单中的所有项目。之后，您可以根据需要使用该结果。

Answer 3

这是行得通的-谢谢你扭地狱！

 function filterChecklists() {
    $('.beverages_button').on('click', function(event) {
      //console.log('click')
      event.preventDefault()
      fetch(`/checklists.json`)
      .then(resp => {
        resp.json()
      .then(checklists => {
         $('#checklist_container').html('')
         //console.log(checklists)
           const beveragesChecklist = checklists.filter(checklist => checklist.item === 'beverages')
         .map(checklist => new Checklist(checklist))
         .forEach(checklist => $('#checklist_container').html(checklist.newChecklistForm()));
         });
      });
    })
  }

我无法使用Javascript进行过滤

3 个答案: