Hướng dẫn indexof javascript

• Hàm indexOf() với mảng
  • Ví dụ hàm indexOf() với mảng
• Hàm indexOf() với chuỗi
  • Ví dụ hàm indexOf() với chuỗi
• Sử dụng indexOf() để kiểm tra một giá trị có tồn tại hay không?
• Kết luận

Hàm indexOf() trong JavaScript trả về vị trí của một phần tử trong mảng hoặc chuỗi. Nếu phần tử đó xuất hiện nhiều lần, hàm indexOf() sẽ trả về vị trí xuất hiện đầu tiên của phần tử. Nếu không, trả về giá trị -1.

Thông thường, bạn muốn tìm hiểu xem chuỗi hoặc mảng có chứa một giá trị cụ thể hay không. Ví dụ: bạn có một mảng các hương vị bánh rán được bán trong cửa hàng của bạn. Bạn muốn kiểm tra xem bạn đã loại bỏ bánh rán sô cô la khỏi thực đơn hay chưa.

Đó là lúc hàm indexOf() trở nên hữu ích. Hàm indexOf() trả về phần tử đầu tiên mà tại đó một giá trị nhất định có thể được tìm thấy trong một mảng hoặc một chuỗi. Nếu không tìm thấy giá trị, giá trị -1 được trả về.

Trong bài viết này, chúng ta sẽ tìm hiểu những điều cơ bản của hàm indexOf() trong JavaScript.

Hàm indexOf() với mảng

Hàm Array.indexOf() tìm kiếm một giá trị trong một mảng. Nó sẽ tìm vị trí phần tử đầu tiên được chỉ định xuất hiện trong một mảng. Nếu một phần tử chỉ định được tìm thấy, hàm indexOf() trả về vị trí của lần xuất hiện đầu tiên của phần tử được chỉ định.

Đây là cú pháp cho hàm indexOf() trong JavaScript:

array_name.indexOf(item, start_position);
Code language: CSS (css)

Tham số item là phần tử cần được tìm kiếm trong mảng, tham số này là bắt buộc. Tham số start_position là tùy chọn, start_position là vị trí trong mảng mà hàm indexOf() bắt đầu tìm kiếm.

Ví dụ hàm indexOf() với mảng

Giả sử rằng chúng ta đã hết quế để làm bánh. Chúng ta muốn kiểm tra xem bánh rán quế có còn được liệt kê trong thực đơn của cửa hàng hay không. Nếu bánh rán có trong thực đơn, ta sẽ loại bỏ chúng. Có thể sử dụng đoạn mã sau để thực hiện hành động này:

var donut_flavors = ['Jam', 'Blueberry', 'Cinnamon', 'Apple Crumble', 'Frosted'];
console.log(donut_flavors.indexOf('Cinnamon'));
Code language: JavaScript (javascript)

Đoạn mã trả về vị trí là 2 khi chúng ta dùng hàm indexOf() tìm kiếm vị trí của Cinnamon.

Nếu xuất hiện nhiều hơn một Cinnamon thì hàm indexOf() chỉ trả về vị trí đầu tiên mà nó tìm thấy.

Giả sử rằng chúng ta làm ra một chiếc bánh rán Jam Supreme mới và thêm nó vào mảng donut_flavors. Tuy nhiên, không chắc mình gọi là bánh donut Jam hay Jam Supreme.

Vì Jam đã ở vị trí đầu tiên trong mảng nên indexOf() sẽ trả về vị trí của Jam. Tuy nhiên, nếu chúng ta sử dụng tham số start_position, chúng ta có thể bỏ qua vị trí đầu tiên và chạy tìm kiếm của mình. Đây là đoạn mã mà chúng ta có thể sử dụng để kiểm tra xem Jam có xuất hiện sau vị trí phần tử 1 trong mảng hay không:

var donut_flavors = ['Jam', 'Blueberry', 'Cinnamon', 'Apple Crumble', 'Frosted', 'Jam Supreme'];
console.log(donut_flavors.indexOf('Jam', 1));
Code language: JavaScript (javascript)

Vì Jam là phần tử đầu tiên, đoạn mã bắt đầu tìm kiếm từ sau vị trí phần tử 1 tuy nhiên không tìm thấy Jam ở phía sau mảng nên giá trị trả về sẽ là -1.

Hàm indexOf() với chuỗi

Hàm indexOf() có thể được sử dụng để tìm một chuỗi con trong một chuỗi. Hàm String.indexOf() trả về số phần tử mà tại đó một chuỗi con bắt đầu trong một chuỗi khác.

Giống như mảng, chuỗi trong JavaScript cũng có giá trị phần tử riêng của chúng. Các chuỗi được đánh số phần tử từ trái sang phải, bắt đầu từ phần tử đầu tiên. Vì vậy, đối với chuỗi ở ví dụ dưới, các giá trị phần tử sau sẽ được chỉ định:

Nếu chúng ta muốn lấy ký tự ở vị trí phần tử 4, có thể làm như vậy bằng cách sử dụng mã sau:

console.log(example_string[4]):
Code language: CSS (css)

Kết quả: p

Ví dụ hàm indexOf() với chuỗi

Hàm String.indexOf() được sử dụng để kiểm tra xem một chuỗi có chứa một chuỗi con cụ thể hay không. Nếu chuỗi con có thể được tìm thấy trong chuỗi, hàm indexOf() sẽ trả về vị trí xuất hiện đầu tiên của phần tử chuỗi. Nếu không, hàm sẽ trả về -1.

Hàm String.indexOf() sử dụng cùng một cú pháp với hàm Array.indexOf():

string_name.indexOf(substring, start_position)
Code language: CSS (css)

Tham số substring là phần tử cần được tìm kiếm trong chuỗi, tham số này là bắt buộc. Tham số start_position là tùy chọn, start_position là vị trí trong chuỗi mà hàm indexOf() bắt đầu tìm kiếm.

Giả sử rằng chúng ta có một chuỗi với tên bánh donut và muốn kiểm tra xem chuỗi đó có chứa Blueberry hay không. Chúng ta có thể sử dụng mã sau để kiểm tra:

var donut_flavors = 'Jam Blueberry Cinnamon Apple Crumble Frosted';
console.log(donut_flavors.indexOf('Blueberry'));
Code language: JavaScript (javascript)

Đoạn mã trả về vị trí của phần tử chuỗi là 4 vì chuỗi con Blueberry bắt đầu ở vị trí 4.

Tương tự, ở ví dụ dưới, hàm indexOf() sẽ bắt đầu tìm kiếm từ vị trí phần tử 10.

var donut_flavors = 'Jam Blueberry Cinnamon Apple Crumble Frosted';
console.log(donut_flavors.indexOf('Blueberry', 10));
Code language: JavaScript (javascript)

Kết quả: -1

Sử dụng indexOf() để kiểm tra một giá trị có tồn tại hay không?

Bạn có thể sử dụng câu lệnh “if” với hàm indexOf() để kiểm tra xem một giá trị có tồn tại trong một chuỗi hay một mảng hay không. Ví dụ: bạn có thể sử dụng indexOf() để kiểm tra xem menu bánh rán có chứa một giá trị cụ thể hay không. Sau đó, bạn có thể in ra nếu giá trị đó được tìm thấy.

Hãy viết một chương trình in ra thông báo nếu tìm thấy “ Chocolate” trong mảng bánh rán.

var donut_flavors = ['Jam', 'Blueberry', 'Chocolate', 'Cinnamon', 'Apple Crumble', 'Frosted'];

if (donut_flavors.indexOf("Chocolate") !== -1) {
	console.log("Chocolate donuts are on the menu!");
}



Code language: JavaScript (javascript)

Kết quả: “Chocolate donuts are on the menu!”

Trên dòng đầu tiên của mã, chúng ta khai báo mảng được gọi là “donut_flavors”, chứa sáu giá trị.

Sau đó, chúng ta tạo một câu lệnh if sử dụng hàm indexOf() để kiểm tra xem “donut_flavors” có chứa “Chocolate” hay không.

Nếu hàm indexOf() trả về “-1”, điều đó có nghĩa là không thể tìm thấy giá trị của chúng ta trong mảng. Điều này có nghĩa là câu lệnh if của chúng ta sẽ không thực thi. Nếu hàm indexOf() trả về bất kỳ giá trị nào khác, câu lệnh if của chúng ta sẽ thực thi.

Trong trường hợp này, indexOf() sẽ trả về 2. Điều này là do “ Chocolate” có trong mảng “donut_flavors” của chúng ta. Chương trình này in ra quả: “Chocolate donuts are on the menu!” bởi vì hàm indexOf() trả về giá trị không bằng -1.

Kết luận

Hàm indexOf() trong JavaScript kiểm tra xem một chuỗi hoặc một mảng có chứa một giá trị cụ thể hay không. Hàm trả về vị trí xuất hiện đầu tiên của phần tử cần tìm mà tại đó giá trị đó được tìm thấy trong chuỗi hoặc mảng. Nếu không tìm thấy giá trị được chỉ định, hàm indexOf() trả về “-1”.

Trong bài viết này, chúng ta đã thảo luận những điều cơ bản về mảng, chuỗi và cách chúng được đánh chỉ mục. Sau đó, chúng a khám phá cách sử dụng hàm indexOf() với cả chuỗi và mảng để kiểm tra xem chúng có chứa một giá trị cụ thể hay không.

Cảm ơn bạn đã theo dõi bài viết!

Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.

Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

TỔNG HỢP TÀI LIỆU HỌC LẬP TRÌNH CƠ BẢN CHO NGƯỜI MỚI BẮT ĐẦU

KHOÁ HỌC BOOTCAMP JAVA/PHP/.NET TRỞ THÀNH LẬP TRÌNH VIÊN TRONG 5-6 THÁNG