微信扫一扫打赏支持

JS数组常用方法---18、find()和findIndex()

JS数组常用方法---18、find()和findIndex()

一、总结

一句话总结：

find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。参数是回调函数。
findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。参数是回调函数。
find()方法
作用：find() 方法返回数组中满足提供的测试函数的第一个元素的值。
参数：回调函数（回调函数参数必带element（当前元素）、可选index（当前元素下标）、可选array（当前数组））
返回值：数组中第一个满足所提供测试函数的元素的值，否则返回 undefined。

//1、find()方法基本使用
let arr=[12,32,43,2,4,11,55,12];
let val=arr.find(function (ele,index) {
  return ele>32;
});
console.log(val);

findIndex()
作用：findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。
参数：回调函数（回调函数参数必带element（当前元素）、可选index（当前元素下标）、可选array（当前数组））
返回值：数组中通过提供测试函数的第一个元素的索引。否则，返回-1

//1、findIndex()方法基本使用
let arr=[12,32,43,2,4,11,55,12];
let val=arr.findIndex(function (ele,index) {
  return ele>32;
});
console.log(val);

 

 

1、find()和findIndex()方法的参数是什么？

是回调函数，像forEach、map等方法那样的回调函数，因为find()和findIndex()也是遍历数组
//1、find()方法基本使用
let arr=[12,32,43,2,4,11,55,12];
let val=arr.find(function (ele,index) {
  return ele>32;
});
console.log(val);

 

 

 

二、find()和findIndex()

博客对应课程的视频位置：

 

1、find()

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>find()和findIndex()</title>
 6 </head>
 7 <body>
 8 <!--
 9 
10 find()方法
11 作用：find() 方法返回数组中满足提供的测试函数的第一个元素的值。
12 参数：回调函数（回调函数参数必带element（当前元素）、可选index（当前元素下标）、可选array（当前数组））
13 返回值：数组中第一个满足所提供测试函数的元素的值，否则返回 undefined。
14 
15 -->
16 <script>
17     //1、find()方法基本使用
18     // let arr=[12,32,43,2,4,11,55,12];
19     // let val=arr.find(function (ele,index) {
20     //     return ele>32;
21     // });
22     // console.log(val);
23 
24     //2、用对象的属性查找数组里的对象
25     // var inventory = [
26     //     {name: 'apples', quantity: 2},
27     //     {name: 'bananas', quantity: 0},
28     //     {name: 'cherries', quantity: 5}
29     // ];
30     // function findCherries(fruit) {
31     //     return fruit.name === 'cherries';
32     // }
33     // console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }
34 
35     //3、寻找数组中的质数
36     // function isPrime(element, index, array) {
37     //     var start = 2;
38     //     while (start <= Math.sqrt(element)) {
39     //         if (element % start++ < 1) {
40     //             return false;
41     //         }
42     //     }
43     //     return element > 1;
44     // }
45     // console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found
46     // console.log([4, 5, 8, 12].find(isPrime)); // 5
47 
48 </script>
49 </body>
50 </html>

 

 

 

2、findIndex()

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>findIndex()</title>
 6 </head>
 7 <body>
 8 <!--
 9 findIndex()
10 作用：findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。
11 参数：回调函数（回调函数参数必带element（当前元素）、可选index（当前元素下标）、可选array（当前数组））
12 返回值：数组中通过提供测试函数的第一个元素的索引。否则，返回-1
13 -->
14 <script>
15     //1、findIndex()方法基本使用
16     let arr=[12,32,43,2,4,11,55,12];
17     let val=arr.findIndex(function (ele,index) {
18         return ele>32;
19     });
20     console.log(val);
21 </script>
22 </body>
23 </html>

 

 

 
posted @ 2020-04-12 05:41  范仁义  阅读(5229)  评论(0)  编辑  收藏  举报