Video học lập trình mỗi ngày

FindIndex javascript được giới thiệu kể từ khi ES6 ra đời. Còn indexOf() đã được giới thiệu trước đó ở ES5. Nhưng thử so sánh xem , hai method này giống và khác nhau như thế nào? Hãy cùng khám phá trong bài viết nhẹ nhàng này.

FindIndex vs indexOf javascript: Giống nhau

Cả hai method trên giống nhau đều trả về index đầu tiên của một Array được tìm thấy. Bạn cũng có thể làm điều tương tự với method includes().

# Use: FindIndex ES6

var myArray = [1, 2, 2, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];

console.log(myArray.findIndex( k => k === 2)); // 1

# Use: indexOf ES5

var myArray = [1, 2, 2, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];

console.log(myArray.indexOf(2));  // 1

FindIndex vs indexOf javascript: Khác nhau về cú pháp

Sự khác nhau của hai method này đó chính là Parameters or Arguments truyền vào (phân biệt arguments và params). Nếu như FindIndex được truyền vào với các params dưới đây:

# Cú pháp findIndex

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

Trong đó: 

callback A callback function để kiểm tra từng phần tử của Array element phần tử hiện tại của Array 

index Optional. The index hiện tại 

array Optional. Original array. 

# Cú pháp indexOf

arr.indexOf(searchElement[, fromIndex])

searchElement 

Phần tử cần tìm trong mảng. fromIndex Optional Vị trí index nơi bắt đầu tìm kiếm. Nếu index lớn hơn hoặc bằng số phần tử trong mảng, -1 sẽ được trả về, việc tìm kiếm sẽ không xảy ra. 

Nếu giá trị fromIndex là một số âm, vị trí index được tính từ cuối mảng. Lưu ý: cho dù fromIndex là số âm, kết quả tìm kiếm vẫn tính từ đầu mảng trở về sau. Nếu index bằng 0, cả mảng sẽ được tìm kiếm. Mặc định: 0 (cả mảng sẽ được tìm kiếm)

FindIndex vs indexOf javascript: Khi nào nên sử dụng

Đầu tiên và quan trọng

Sử dụng indexOf() khi tìm index của một array kiểu primitive types (like string, number, or boolean).

Và ngược lại dùng FindIndex() khi tìm index của một Array() non-primitive types (e.g. objects). Và tìm kiếm những điều kiện phức tạp hơn.

Và những trường hợp sau đây.

Chúng ta nên sử dụng .indexOf () khi chúng ta muốn tìm index của lần xuất hiện đầu tiên của một giá trị cụ thể trong một mảng.

Ví dụ:

var myArrayOfStrings = ['this', 'is', 'my', 'array', 'of', 'strings'];

console.log(myArrayOfStrings.indexOf('my')); //logs `2` 

Chúng ta nên sử dụng .findIndex() khi chúng ta muốn kiểm tra một điều kiện cho từng phần tử của một mảng, cho đến khi điều kiện được đáp ứng và lấy chỉ mục của phần tử mảng đầu tiên vượt qua điều kiện đã nói.

Ví dụ:

var myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];

function isGreaterThanNine (num) {
  return num > 9; //
}

console.log(myArray.findIndex(isGreaterThanNine)); //9 

Notes: findIndex() không làm thay đổi array gốc.

Kết Luận

Có bạn nào đủ tinh ý nhận ra rằng FindIndex() và Find() có một sự giống nhau nào không? Nếu có điều đó, thì tôi nghĩ bạn là một devjs thật tuyệt vời. Bài sau or có cơ hội, chúng ta sẽ bàn luận về điều đó. 

Sự khác nhau giữa FindIndex() và Find() trong ES6.