Hướng dẫn javascript includes and indexof - javascript bao gồm và indexof

Trong bài này chúng ta sẽ tìm hiểu hàm Array indexOf trong javascript, đây là hàm dùng để tìm kiếm phần tử trong mảng javascript.indexOf trong javascript, đây là hàm dùng để tìm kiếm phần tử trong mảng javascript.

Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.freetuts.net, không được copy dưới mọi hình thức.

Hàm indexOf sẽ tìm kiếm một phần tử trong mảng dựa vào giá trị của phần tử, hàm sẽ trả về vị trị[ khóa] của phần tử nếu tìm thấy và trả về -1 nếu không tìm thấy.

1. Array indexOf javascript là gì?

Array indexOf trong javascript là một phương thức của đối tượng mảng, nó dùng để tìm kiếm một phần tử trong mảng dựa vào giá trị truyền vào tham số của hàm.

• Việc tìm kiếm sẽ bắt đầu từ vị trí xác định, nếu không truyền vào thì mặc định sẽ tìm từ đầu.
• Nếu có nhiều hơn một phần tử được tìm thấy, phần tử tìm thấy đầu tiên sẽ được trả về.
• Vị trí các phần tử của mảng bắt đầu từ: 0, 1, 2 ..vv.
• Nếu bạn muốn tìm từ cuối mảng, sử dụng hàm lastIndexOf.

Cú pháp của array indexOf như sau:

Bài viết này được đăng tại [free tuts .net]

 array.indexOf[item, start]

Trong đó::

• var scores = [10, 20, 30, 10, 40, 20];

  5 là giá trị của phần tử cần tìm.

• var scores = [10, 20, 30, 10, 40, 20];

  6 là vị trí bắt đầu tìm kiếm.

Ví dụ: Cho mảng gồm 6 phần tử như sau.: Cho mảng gồm 6 phần tử như sau.

var scores = [10, 20, 30, 10, 40, 20];

Mình sẽ thực hiện thao tác tìm kiếm trên mảng này như sau:

console.log[scores.indexOf[10]]; // 0
console.log[scores.indexOf[30]]; // 2
console.log[scores.indexOf[50]]; // -1
console.log[scores.indexOf[20]]; // 1

Trong dòng code thứ 3 trả về -1 tại vì giá trị 50 không tìm thấy trong mảng.

Mặc định thì hàm này sẽ sử dụng thuật toán tìm kiếm tuyến tính, tức là nó sẽ dò từ đầu mảng đến cuối mảng, phần tử nào bằng với giá trị truyền vào thì sẽ được trả về.

Nếu bạn muốn bắt đầu tìm từ một vị trí nào đó thì hãy sử dụng tham số

var scores = [10, 20, 30, 10, 40, 20];

6 nhé.

Như ví dụ trên, mình chắc chắn 3 phần tử đầu là không có giá trị 40, vì vậy mình sẽ yêu cầu hàm indexOf tìm từ phần tử thứ 4 [tức là chỉ mục 3] trở đi.

console.log[scores.indexOf[40, 3]]; // 4

2. Một ví dụ về hàm indexOf trong javascript

Ví dụ: Sử dụng hàm indexof để tìm kiếm vị trí xuất hiện của phần tử PHP. Sử dụng hàm indexof để tìm kiếm vị trí xuất hiện của phần tử PHP.

demoP = document.getElementById["demo"];

function myFunction[item, index] {
    var subject = ["html", "php", "php", "c#"];
    var a = subject.indexOf["php"];
    document.getElementById["demo"].innerHTML = a;
}

3. Sử dụng hàm array indexOf với mảng chứa các object

Nếu các phần tử trong mảng là các object thì lúc này bạn không thể sử dụng hàm indexOf được.

Ví dụ dưới đây mặc dù trong mảng

var scores = [10, 20, 30, 10, 40, 20];

8 và giá trị cần tìm truyền vào hàm có trùng nhau nhưng kết quả vẫn trả về -1. Lý do là javascript đã xem đây là hai đối tượng khác nhau.

var guests = [
    {name: 'John Doe', age: 30},
    {name: 'Lily Bush', age: 20},
    {name: 'William Gate', age: 25}
];

console.log[guests.indexOf[{
    name: 'John Doe',
    age: 30
}]]; // -1

Như bạn thấy, phần tử đầu tiên và giá trị mình truyền vào hàm indexOf hoàn toàn giống nhau nhưng kết quả trả về vẫn là -1.

Để khắc phục vấn đề này thì ta sẽ kết hợp một vài hàm khác nữa như sau:

• Sử dụng hàm map để duyệt qua từng phần tử của mảng, sau đó trả về một mảng mới và các phần tử là giá trị cần tìm.
• Sử dụng hàm indexOf để tìm trên mảng mới đó.

var guests = [
    {name: 'John Doe', age: 30},
    {name: 'Lily Bush', age: 20},
    {name: 'William Gate', age: 25}
];

// Tìm theo key name
let flag = guests.map[function[e]{
    return e.name;
}].indexOf["John Doe"];

console.log[flag]; // 0

// Tìm theo key age
let flag = guests.map[function[e]{
    return e.age;
}].indexOf[30];

console.log[flag]; // 0

Trên là cách dùng hàm array indexOf trong Javascript. Hàm này rất hữu ích trong trường hợp bạn muốn kiểm tra một giá trị nào đó có tồn tại trong mảng hay không.

• 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 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àm indexOf[] với mảng

Ví dụ hàm indexOf[] với mảng

Hàm indexOf[] với chuỗi

array_name.indexOf[item, start_position];
Code language: CSS [css]

Ví dụ hàm indexOf[] với chuỗi

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

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.

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:

E	x	a	m	p	l	e	!
	1	2	3	4	5	6	6

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:

var scores = [10, 20, 30, 10, 40, 20];

0

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[]:

var scores = [10, 20, 30, 10, 40, 20];

1

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 scores = [10, 20, 30, 10, 40, 20];

2

Đ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 scores = [10, 20, 30, 10, 40, 20];

3

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 scores = [10, 20, 30, 10, 40, 20];

4

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.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.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