js代码,如何利用find查找数组元素?检测元素是否存在
发布于 作者:苏南大叔 来源:程序如此灵动~
本文描述在js的数组中查找某一条数据?解决方案是使用数组自带的find方法。这里需要特别强调的是:这个find方法只能找到符合条件的第一条数据,注意是第一条数据,而不是所有数据。如果没有找到,就返回一个undefined。

大家好,这里是苏南大叔的程序如此灵动博客,这里记录苏南大叔和计算机代码的故事。本文描述js的数组查找某一条元素功能,方法的名字是find,不过从实际的使用结果上来说,更像是一个测试的作用,测试某一特征的元素是否存在。因为它find的结果只是会返回符合要求的第一条数据。理论上来说,这个.find可以在node和浏览器环境下,都可以运行。测试环境:node@16.14.2,chrome@105.0.5195.102。
在下面的文章里面,还列举了几个在数组中查找元素的方式,请点击:
测试用例
这里做了两个测试的数组变量,用来查找一下目标元素的演示。
let var1 = [0, 1, 2, 3, 4, 5];
let var2 = [{ id: 0, name: "a0" }, { id: 1, name: "a1" }, { id: 2, name: "a2" }]标准写法
let result0 = var1.find(item => item >= 1)
console.log("result0", result0);
let result1 = var2.find(item => item.id >= 1)
console.log("result1", result1);
let result2 = var2.find(item => item.id >= 3)
console.log("result2", result2);
输出结果:
result0 1
result1 { id: 1, name: 'a1' }
result2 undefined注意:这里可以看到,符合要求的元素实际上是很多的,但是输出结果却仅仅是符合要求的第一条数据,并不是符合要求的所有数据!并且当没有找到数据的时候,返回的是undefined。
另外的写法
let result3 = var2.find(function (item, index, arr) {
return item.id >= 1;
})
console.log("result3", result3);
function check(item, index, arr) {
return item.id >= 1;
}
let result4 = var2.find(check)
console.log("result4", result4);结果输出:
result3 { id: 1, name: 'a1' }
result4 { id: 1, name: 'a1' }循环的次数
let result5 = var2.find(function (item, index, arr) {
console.log(item, index, arr);
return item.id >= 3;
})
console.log("result5", result5);结果输出:
{ id: 0, name: 'a0' } 0 [ { id: 0, name: 'a0' }, { id: 1, name: 'a1' }, { id: 2, name: 'a2' } ]
{ id: 1, name: 'a1' } 1 [ { id: 0, name: 'a0' }, { id: 1, name: 'a1' }, { id: 2, name: 'a2' } ]
{ id: 2, name: 'a2' } 2 [ { id: 0, name: 'a0' }, { id: 1, name: 'a1' }, { id: 2, name: 'a2' } ]
result5 undefined可以看到:在没有找到目标数据之前(return之前),循环是一直继续的。并且传入了3个参数,分别是:item元素/index索引/arr数组本身。
元素是否存在
如果从对应特征的元素是否存在的角度来看的话,判断语句如下:
let var2 = [{ id: 0, name: "a0" }, { id: 1, name: "a1" }, { id: 2, name: "a2" }]
let result6 = var2.find(function (item, index, arr) {
return item.id >= 2;
})
let result7 = var2.find(function (item, index, arr) {
return item.id >= 3;
})
console.log("id大于等于2,"+(!!result6));
console.log("id大于等于3,"+(!!result7));输出内容:
id大于等于2,true
id大于等于3,false相关链接
总结
如果你需要找出所有符合特征的数据,您可能需要的不是.find,而是.filter。更多js的经验文章,请点击: