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 可以确保你的代码在各种浏览器中都能正常运行。
以上就是js 如何使用findIndex查找元素的索引位置的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1516485.html
微信扫一扫 
支付宝扫一扫 
