เมธอด Array.findIndex() ใน JavaScript: ค้นหาดัชนีขององค์ประกอบ

เมธอด findIndex() ใช้สำหรับ คืนค่าดัชนี (index) ขององค์ประกอบแรก ในอาร์เรย์ที่ทำให้ฟังก์ชันทดสอบ (callback) คืนค่า true หากไม่พบจะคืนค่า -1

ไวยากรณ์ (Syntax)

array.findIndex(callback(element[, index[, array]])[, thisArg])

ตัวอย่างการใช้งาน

ตัวอย่างที่ 1: ค้นหาดัชนีของคะแนนสูงสุด

<!DOCTYPE html>
<html>
<body>
  <h2>คะแนนอันดับ</h2>
  <button onclick="display()">ค้นหาดัชนี</button>
  <p id="demo"></p>
  <p>ค้นหาดัชนีของผู้เล่นที่มีคะแนน >= 400</p>
  <script>
    const points = [100, 150, 200, 250, 300, 400];
    
    function topRank(points) {
      return points >= 400;
    }
    
    function display() {
      const index = points.findIndex(topRank);
      document.getElementById("demo").innerHTML = "ดัชนี = " + index;
      // ผลลัพธ์: 5
    }
  </script>
</body>
</html>

ตัวอย่างที่ 2: ค้นหาค่าที่กำหนด

<!DOCTYPE html>
<html>
<body>
  <h2>คะแนนอันดับ</h2>
  <button onclick="display()">ค้นหาดัชนี</button>
  <p id="demo"></p>
  <p>ค้นหาดัชนีของผู้เล่นที่มีคะแนนเท่ากับ 200</p>
  <script>
    const points = [100, 150, 200, 250, 300, 400];
    
    function exactRank(points) {
      return points === 200;
    }
    
    function display() {
      const index = points.findIndex(exactRank);
      document.getElementById("demo").innerHTML = "ดัชนี = " + index;
      // ผลลัพธ์: 2
    }
  </script>
</body>
</html>

ความแตกต่างระหว่าง findIndex, find, indexOf

// findIndex หา NaN ได้
[NaN, 1, 2].findIndex(x => Number.isNaN(x)); // 0
[NaN, 1, 2].indexOf(NaN); // -1 ❌