findindex 方法返回数组中第一个满足测试函数条件的元素索引,若无则返回-1;1. 它在找到首个匹配元素后立即停止,相比循环更高效;2. 支持复杂条件判断,如对象属性匹配;3. 与 indexof 不同,findindex 可自定义搜索逻辑而非仅严格相等;4. 在空数组上调用始终返回-1;5. 对于不支持的老浏览器,可通过 polyfill 实现兼容。

findIndex 查找元素索引,简单来说,就是给你一个数组,让你找到第一个符合特定条件的元素的下标。
解决方案
findIndex() 方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回 -1。
const array1 = [5, 12, 8, 130, 44]; const isLargeNumber = (element) => element > 13; console.log(array1.findIndex(isLargeNumber)); // Expected output: 3
上面的例子很简单,
isLargeNumber就是我们的测试函数,它检查元素是否大于 13。
findIndex找到第一个大于 13 的元素(130),然后返回它的索引 3。
findIndex 的性能考量:为什么它比循环查找更快?
findIndex 在找到符合条件的第一个元素后就会停止搜索,这意味着在大型数组中,如果目标元素位于数组的前面部分,findIndex 的效率会非常高。而传统的循环查找可能需要遍历整个数组才能找到目标元素,或者直到循环结束才能确定元素不存在。当然,如果目标元素位于数组末尾,或者根本不存在,findIndex 的性能可能与循环查找差不多。但是,通常情况下,findIndex 的平均性能更好。
findIndex 的高级用法:不仅仅是简单的相等比较
findIndex 的测试函数可以非常灵活,不仅仅局限于简单的相等比较。你可以使用复杂的逻辑来定义搜索条件。
const inventory = [
{name: 'apples', quantity: 2},
{name: 'bananas', quantity: 0},
{name: 'cherries', quantity: 5}
];
function findCherries(fruit) {
return fruit.name === 'cherries';
}
console.log(inventory.findIndex(findCherries)); // 2在这个例子中,我们查找
inventory数组中
name属性为 'cherries' 的对象的索引。
findCherries函数定义了复杂的搜索条件,findIndex 能够轻松应对。
findIndex 与 indexOf 的区别:选择哪个更合适?
indexOf 只能查找数组中是否包含某个特定的值,并返回第一个匹配项的索引。它使用严格相等(===)进行比较。findIndex 则更加灵活,它允许你通过一个测试函数来定义搜索条件,可以进行更复杂的匹配。
- 如果你只需要查找数组中是否存在某个特定的值,并且使用严格相等进行比较,那么 indexOf 是一个不错的选择,它更简单直接。
- 如果你需要根据复杂的条件来查找元素,或者需要查找对象数组中符合特定属性值的元素,那么 findIndex 更加适合。
findIndex 在空数组中的行为:会发生什么?
如果在空数组上调用
findIndex,无论你提供什么测试函数,它总是会立即返回 -1。 因为空数组没有任何元素可以进行测试。
const emptyArray = []; const alwaysTrue = () => true; console.log(emptyArray.findIndex(alwaysTrue)); // -1
findIndex 的兼容性问题:老版本浏览器怎么办?
findIndex 是 ES5 中引入的,这意味着在一些老版本的浏览器中可能不支持。为了解决兼容性问题,可以使用 polyfill。 Polyfill 是一段代码,用于在不支持某个功能的浏览器中提供该功能的实现。
if (!Array.prototype.findIndex) {
Array.prototype.findIndex = function(predicate) {
if (this == null) {
throw new TypeError('Array.prototype.findIndex called on null or undefined');
}
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
var list = Object(this);
var length = list.length >>> 0;
var thisArg = arguments[1];
var value;
for (var i = 0; i < length; i++) {
value = list[i];
if (predicate.call(thisArg, value, i, list)) {
return i;
}
}
return -1;
};
}这段代码检查浏览器是否支持
findIndex,如果不支持,则提供一个
findIndex的实现。使用 polyfill 可以确保你的代码在各种浏览器中都能正常运行。










