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>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 JS find 和 findIndex 方法數組實例的find() 和 findIndex()方法 js find方法和findIndex方法 js--數組的find()和findIndex()方法的使用介紹 JavaScript數組方法--filter、find、findIndex js中find()、findIndex()、filter()方法的使用 js數組中的find(), findIndex(), filter(), forEach(), some(), every(), map(), reduce()方法的詳解和應用實例 js數組的5種查詢方式——find(),findIndex(),indexOf(),lastIndexOf(),include() javascript(基礎)_對數組的遍歷方法總結（find, findIndex, forEach,） es6 數組實例中的find() 和 findIndex() 方法.md