Блог

У меня есть массив, подобный этому.

 [{
  id: 1,
  name: 'Stephen',
  Team: {
    name: 'Lion',
    color: 'blue'
  },
  skills: ['allrounder', 'middleorder']
}, {
  id: 2,
  name: 'Daniel',
  Team: {
    name: 'Panther',
    color: 'green'
  },
  skills: ['batsman', 'opener']
}, {
  id: 3,
  name: 'Mark',
  Team: {
    name: 'Lion',
    color: 'blue'
  },
  skills: ['bowler', 'fielder']
}]
  

Я предоставляю средство поиска по каждому полю.

• Имя: inputbox
• Название команды: dopdownlist (для выбора названия команды)
• Цвет команды: выпадающий список (для выбора цвета команды)
• Навыки: флажки

Пользователь может указать только Name поле и нажать на Поиск, или может использовать несколько вариантов, таких как только навыки или комбинация любого из входных данных. Каков наилучший способ фильтрации массива на основе этих условий. например

 myArr.filter(item => item.Name.toLowerCase().startsWith(searchData.name.toLowerCase())
                      amp;amp; / || item.skills.include(searchData.skillsArr)  
  

Ожидаемый результат основан на любом отдельном или комбинации предоставленных входных данных.

Вы могли бы написать функцию, используя filter вот так:

• Проверьте, есть ли значение в name параметре. Если да, проверьте, соответствует ли name свойству объекта массива includes имя
• Если нет, проверьте наличие teamName и color параметра аналогичным образом
• Затем проверьте наличие массива выбранных skills . Проверьте, есть ли some какие-либо навыки included в skills свойстве array объекта

 const input=[{id:1,name:'Stephen',Team:{name:'Lion',color:'blue'},skills:['allrounder','middleorder']},{id:2,name:'Daniel',Team:{name:'Panther',color:'green'},skills:['batsman','opener']},{id:3,name:'Mark',Team:{name:'Lion',color:'blue'},skills:['bowler','fielder']}]

function filter(array, name, teamName, color, skills) {
  return array.filter(a =>
    (!name || a.name.toLowerCase().includes(name.toLowerCase())) amp;amp;
    (!teamName || a.Team.name.toLowerCase().includes(teamName.toLowerCase())) amp;amp;
    (!color || a.Team.color.toLowerCase().includes(color.toLowerCase())) amp;amp;
    (!skills || skills.length === 0 || skills.some(s => a.skills.includes(s)))
  )
}

console.log(filter(input, "Mark"))
console.log(filter(input, null, "Panther"))
console.log(filter(input, null, null, "blue", ["bowler"]))