数组的find/findIndex详解

find() 

  • 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
  • find方法对数组中的每一项元素执行一次 callback 函数,直至有一个 callback 返回 true。当找到了这样一个元素后,该方法会立即返回这个元素的值,否则返回 undefined。
  • 注意 callback 函数会为数组中的每个索引调用即从 到 length - 1,而不仅仅是那些被赋值的索引,这意味着对于稀疏数组来说,该方法的效率要低于那些只遍历有值的索引的方法。
  • callback函数带有3个参数:当前元素的值、当前元素的索引,以及数组本身。
  • 如果提供了 thisArg参数,那么它将作为每次 callback函数执行时的this ,如果未提供,则使用 undefined。
  • find方法不会改变数组。
var inventory = [
    {name: 'apples', quantity: 2},
    {name: 'bananas', quantity: 0},
    {name: 'cherries', quantity: 5}
];

function findCherries(fruit) { 
    return fruit.name === 'cherries';
}

console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }
var arr = [
    {name: 'fx', age: 18},
    {name: 'wfd', age: 19},
]
var arrTest = arr.find((item, index, array) => {
    console.log('当前值:' + JSON.stringify(item), '当前值的索引' + index, '当前数组' + array)
    return item.age >= 18
})
console.log(arrTest)

var arr = [
    {name: 'fx', age: 18},
    {name: 'wfd', age: 19},
]
var arrTest = arr.find((item, index, array) => {
    console.log('当前值:' + JSON.stringify(item), '当前值的索引' + index, '当前数组' + array)
    return item.name === 'wfd'
})
console.log(arrTest)

下面的例子展示了如何从一个数组中寻找质数(如果找不到质数则返回 undefined)

function isPrime(element, index, array) {
  var start = 2;
  while (start <= Math.sqrt(element)) {
    if (element % start++ < 1) {
      return false;
    }
  }
  return element > 1;
}

console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found
console.log([4, 5, 8, 12].find(isPrime)); // 5

当在回调中删除数组中的一个值时,当访问到这个位置时,其传入的值是 undefined:

findIndex()

  • 返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。
  • findIndex方法对数组中的每个数组索引0..length-1(包括)执行一次callback函数,直到找到一个callback函数返回真实值(强制为true)的值。
  • 如果找到这样的元素,findIndex会立即返回该元素的索引。
  • 如果回调从不返回真值,或者数组的length为0,则findIndex返回-1。
  • 与某些其他数组方法(如Array#some)不同,在稀疏数组中,即使对于数组中不存在的条目的索引也会调用回调函数。
  • 回调函数调用时有三个参数:元素的值,元素的索引,以及被遍历的数组。
  • 如果一个 thisArg 参数被提供给 findIndex, 它将会被当作this使用在每次回调函数被调用的时候。如果没有被提供,将会使用 undefined。findIndex不会修改所调用的数组。

以下示例查找数组中素数的元素的索引(如果不存在素数,则返回-1)。

function isPrime(element, index, array) {
  var start = 2;
  while (start <= Math.sqrt(element)) {
    if (element % start++ < 1) {
      return false;
    }
  }
  return element > 1;
}

console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, not found
console.log([4, 6, 7, 12].findIndex(isPrime)); // 2
var arr = [
    {name: 'fx', age: 18},
    {name: 'wfd', age: 19},
]
var arrTest = arr.findIndex((item, index, array) => {
    console.log('当前值:' + JSON.stringify(item), '当前值的索引' + index, '当前数组' + array)
    return item.name === 'wfd'
})
console.log(arrTest)

 

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
### 回答1: 方法的作用是什么? js数组find方法和findindex方法都是用来查找数组中符合条件的元素的方法。 find方法返回第一个符合条件的元素,如果没有符合条件的元素则返回undefined。 findindex方法返回第一个符合条件的元素的索引,如果没有符合条件的元素则返回-1。 两个方法的区别是返回值不同,一个返回元素,一个返回索引。 ### 回答2: JavaScript中的数组提供了许多内置方法,其中包括find方法和findIndex方法。这两种方法可以用来查找数组中的元素,但它们具有不同的用途和功能。 首先,让我们来了解一下find方法。该方法可以在数组中查找符合特定条件的第一个元素,并返回该元素的值。以下是find方法的语法: ``` array.find(function(element, index, array) { //条件判断语句 }); ``` 该方法接受一个回调函数作为参数,该回调函数的作用是对数组中的每个元素进行条件判断。如果回调函数返回值为真,则该元素符合条件,find方法将停止遍历并返回该元素的值。如果遍历完整个数组都没有符合条件的元素,find方法将返回undefined。 使用find方法的一个示例是查找数组中的第一个奇数。可以使用以下代码: ``` const arr = [2, 4, 1, 6, 8, 3]; const odd = arr.find(num => num % 2 === 1); console.log(odd); //输出1 ``` 接下来,我们来了解一下findIndex方法。这个方法的功能类似于find方法,但不同的是它返回的是符合条件的元素在数组中的索引,而不是返回该元素的值。以下是findIndex方法的语法: ``` array.findIndex(function(element, index, array) { //条件判断语句 }); ``` 同样,该方法也接受一个回调函数作为参数。如果回调函数返回值为真,则该元素符合条件,findIndex方法将返回该元素在数组中的索引。如果遍历完整个数组都没有符合条件的元素,findIndex方法将返回-1。 对于上面查找数组中的第一个奇数的示例,可以很容易地修改为查找数组中第一个奇数的位置。以下是代码: ``` const arr = [2, 4, 1, 6, 8, 3]; const oddIndex = arr.findIndex(num => num % 2 === 1); console.log(oddIndex); //输出2 ``` 总的来说,find方法和findIndex方法是非常有用的数组方法,可以帮助我们快速找到想要的数组元素。如果需要查找元素的值,使用find方法,如果需要查找元素的索引,使用findIndex方法。 ### 回答3: JS数组中的find()和findIndex()方法是ES6新增的数组方法,它们提供了一种比较简单的查找元素的方式。 find()方法用来查找数组中符合指定条件的第一个元素,并返回该元素的值,如果数组中没有符合条件的元素,则返回undefined。它的语法如下: array.find(function(item, index, array){ // 操作,返回boolean值 }, thisArg); 其中,function(item, index, array)是一个回调函数,用来对数组的每个元素进行处理的。它可以接收三个参数,分别代表当前元素的值、当前元素的索引以及数组本身。不过第二个参数thisArg是可选的,表示指定回调函数中this指向的对象,默认为undefined。 下面是使用find()方法的示例代码: let arr = [1, 2, 3, 4, 5]; let result = arr.find(function(item){ return item > 3; }); console.log(result); // 4 findIndex()方法与find()方法类似,也是根据指定条件查找数组中符合条件的第一个元素,但它返回的是符合条件的元素在数组中的索引,如果找不到则返回-1。它的语法如下: array.findIndex(function(item, index, array){ // 操作,返回boolean值 }, thisArg); 其中,回调函数的用法和find()方法一样,只是它的返回值是元素的索引。 下面是使用findIndex()方法的示例代码: let arr = [1, 2, 3, 4, 5]; let index = arr.findIndex(function(item){ return item > 3; }); console.log(index); // 3 以上就是JS数组中find()和findIndex()方法的详细介绍,它们在实际开发中经常用来查询数组中符合条件的元素,可以大大提高开发效率。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

wflynn

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值