我需要根据过滤器在数组中搜索数据，并将起始形式索引设置为1

Question

我需要根据过滤器在数组中搜索数据，这样我才能做到这一点。我根据名称和id搜索数据，但在索引0的后端，我没有得到，名称和id只得到一个数字，所以当我搜索数据时，我得到了一个未定义的错误，所以我的任务是设置过滤器，从索引1开始搜索，平均忽略索引0

来自后端的即将到来的数据示例

[
2,
{
search_id: "10000107",
name: "dev name",

},
{
search_id: "10000106",
name: "alberto",

},
]

function handleSearch(term) {
const dummy = props.new_alert_list.filter((item) =>
item.name.toLowerCase().includes(term)
);
const dummy1 = props.new_alert_list.filter((item) =>
item.search_id.includes(term)
);
const no = parseInt(term);
if (isNaN(no)) setItems(dummy);
else setItems(dummy1);
}

Answer 1

是的，您可以从索引1的元素开始，但我认为您也可以使用hasOwnProperty。类似于：

let data = [
2,
{
id: "10000107",
name: "dev name",

},
{
id: "10000106",
name: "alberto",

},
]
data.filter(x => {
if (x.hasOwnProperty("id") && x.hasOwnProperty("name")) {
console.log(x.id, " ", x.name); // if object in array has id and name properties then do stuff...
}
});

Answer 2

.filter()有第二个参数"索引"；，您可以使用。

例如：

[1,2,3].filter((element, index) => { return index != 0 });

来源：https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

Answer 3

您可以在filter()中传递另一个参数index

function handleSearch(term) {
const dummy = props.new_alert_list.filter((item, index) =>
index !== 0 ? item.name.toLowerCase().includes(term) : false
);
const dummy1 = props.new_alert_list.filter((item, index) =>
index !== 0 ? item.search_id.includes(term) : false
);
const no = parseInt(term);
if (isNaN(no)) setItems(dummy);
else setItems(dummy1);

Answer 4

从索引1中对数组进行切片，以创建一个新的数组进行筛选。

function handleSearch(term) {
const dummy = props.new_alert_list.slice(1).filter((item) =>
item.name.toLowerCase().includes(term)
);
const dummy1 = props.new_alert_list.slice(1).filter((item) =>
item.search_id.includes(term)
);
const no = parseInt(term);
if (isNaN(no)) setItems(dummy);
else setItems(dummy1);
}

或者，您可以访问正在迭代的当前索引(filter的第二个参数(，并添加非零(即truthy(索引的条件。

function handleSearch(term) {
const dummy = props.new_alert_list.filter((item, index) =>
index && item.name.toLowerCase().includes(term)
);
const dummy1 = props.new_alert_list.filter((item, index) =>
index && item.search_id.includes(term)
);
const no = parseInt(term);
if (isNaN(no)) setItems(dummy);
else setItems(dummy1);
}

如果第一个元素在前端UI中不相关，那么您可能应该在发送道具之前将其清除，或者更好的是，在将其保存到任何本地组件状态之前将其删除。

Answer 5

您只需探查迭代器中的项是否具有属性。如果是，则过滤

function handleSearch(term) {
setItems(props.new_alert_list
.filter(item => 
(typeof item === "object" && 
(item.hasOwnProperty('name') && item.name.toLowerCase().includes(term.toLowerCase())) 
|| 
(item.hasOwnProperty('search_id') && item.search_id.includes(term)) 
));
}

let data = [
2, {
search_id: "10000107",
name: "dev name",
},
{
search_id: "10000106",
name: "alberto",
},
{},
{
name: "Joe"
}
]
let term = 'alberto';
let filtered = data.filter(item => (typeof item === "object" && (item.hasOwnProperty('name') && item.name.toLowerCase().includes(term.toLowerCase())) || (item.hasOwnProperty('search_id') && item.search_id.includes(term))));
console.log(filtered);