Hướng dẫn cách lấy phần tử trong mảng JavaScript. Bạn sẽ học được 4 cách cơ bản để lấy phần tử trong mảng JavaScript sau bài học này.

Chúng ta có 4 cách lấy phần tử trong mảng JavaScript như sau:

• Sử dụng index: lấy phần tử trong mảng JavaScript tại vị trí chỉ định
• Phương thức indexOf và lastIndexOf: Lấy vị trí của phần tử trong mảng JavaScript
• Phương thức find: Lấy phần tử trong mảng JavaScript theo điều kiện
• Phương thức findIndex: lấy vị trí của phần tử trong mảng JavaScript theo điều kiện

Lấy phần tử trong mảng JavaScript tại vị trí chỉ định

Để lấy phần tử trong mảng JavaScript tại vị trí chỉ định, chúng ta sẽ sử dụng tới Index trong JavaScript.

Trong bài Index trong Javascrip chúng ta đã biết Index trong JavaScript là một giá trị đại diện cho vị trí hoặc số thứ tự của một phần tử trong mảng chứa nó. Bằng cách chỉ định index của phần tử, chúng ta có thể truy cập và lấy giá trị của phần tử đó, hoặc là thay đổi giá trị của nó.

Ví dụ, chúng ta lấy phần tử đầu tiên trong mảng JavaScript bằng cách chỉ định index bằng 0 như sau:

let prov = ["Hà Nội", "Thanh Hóa", "Sài Gòn", "Đà Nẵng"];
console.log("Phần tử đầu tiên: "+ prov[0]);
//> Phần tử đầu tiên: Hà Nội

Một cách tương tự, chúng ta cũng có thể lấy phần tử cuối cùng của mảng JavaScript bằng cách chỉ định index bằng với độ dài mảng (tính bằng thuộc tính length) trừ đi 1 đơn vị như sau:

let num = [48, 75, 92, 61, 54, 83, 76];
console.log("Phần tử cuối cùng: "+ num[num.length-1]);
// Phần tử cuối cùng: 76

Lấy vị trí của phần tử trong mảng JavaScript

Để lấy vị trí của phần tử trong mảng JavaScript, chúng ta có thể sử dụng đến một trong hai phương thức là indexOf và lastIndexOf.

Trong bài Tìm phần tử trong mảng JavaScript (indexOf,lastIndexOf) chúng ta đã biết cách sử dụng indexOf để tìm kiếm phần tử từ đầu mảng, và lastIndexOf để tìm kiếm phần tử từ cuối mảng đã cho.

Trong trường hợp chỉ tồn tại duy nhất một phần tử cần tìm trong mảng thì việc tìm từ đầu hay cuối mảng cũng sẽ chỉ đưa ra 1 kết quả duy nhất, do vậy 2 phương thức này đều đưa ra vị trí của phần tử giống nhau. Ví dụ, chúng ta lấy vị trí của phần tử trong mảng JavaScript bằng indexOf và lastIndexOf như sau:

let num = [48, 75, 92, 61, 75, 83, 76];
let ele = 61;

let vitri1 = num.indexOf(ele);
console.log(vitri1);
// 3

let vitri2 = num.lastIndexOf(ele);
console.log(vitri2);
// 3

Tuy nhiên cần lưu ý là nếu có nhiều hơn 1 phần tử được tìm thấy, thì kết quả phép lấy vị trí của phần tử trong mảng JavaScript bằng indexOf và lastIndexOf sẽ khác nhau như sau:

let num = [48, 75, 92, 61, 75, 83, 76];
let ele = 75;

let vitri1 = num.indexOf(ele);
console.log(vitri1);
// 1

let vitri2 = num.lastIndexOf(ele);
console.log(vitri2);
// 4

Lấy phần tử trong mảng JavaScript theo điều kiện

Để lấy phần tử trong mảng JavaScript theo điều kiện, chúng ta sẽ dùng tới phuơng thức find trong JavaScript.

Trong bài Tìm kiếm theo điều kiện trong mảng JavaScript chúng ta đã biết phương thức find có tác dụng tìm kiếm và trả về giá trị của phần tử đầu tiên thỏa mãn điều kiện trong một mảng JavaScript.

Ứng dụng phương thức find, chúng ta có thể lấy phần tử trong mảng JavaScript theo điều kiện như dưới đây:

let num = [48, 75, 91, 61, 75, 82, 76];

/**Lấy phần tử lớn hơn 80 đầu tiên được tìm thấy trong mảng*/
let vitri1 = num.find(function(element){
  return element > 80;
});
console.log(vitri1);
// 91


/**Lấy phần tử lớn hơn 80 và là số chẵn đầu tiên được tìm thấy trong mảng*/
let vitri2 = num.find(function(element){
  return element > 80 && (element % 2 == 0);
});
console.log(vitri2);
//82

Lấy vị trí của phần tử trong mảng JavaScript theo điều kiện

Để lấy vị trí của phần tử trong mảng JavaScript theo điều kiện, chúng ta sẽ dùng tới phuơng thức findIndex trong JavaScript.

Trong bài Tìm kiếm theo điều kiện trong mảng JavaScript chúng ta đã biết phương thức findIndex có tác dụng tìm kiếm và trả về index của phần tử đầu tiên thỏa mãn điều kiện trong một mảng JavaScript.

Ứng dụng phương thức findIndex, chúng ta có thể lấy vị trí của phần tử trong mảng JavaScript theo điều kiện như dưới đây:

let num = [48, 75, 91, 61, 75, 82, 76];

/**Lấy vị trí phần tử lớn hơn 80 đầu tiên được tìm thấy trong mảng*/
let vitri1 = num.findIndex(function(element){
  return element > 80;
});
console.log(vitri1);
// 2


/**Lấy vị trí phần tử lớn hơn 80 và là số chẵn đầu tiên được tìm thấy trong mảng*/
let vitri2 = num.findIndex(function(element){
  return element > 80 && (element % 2 == 0);
});
console.log(vitri2);
//5

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về các cách Lấy phần tử trong mảng JavaScript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.

URL Link

https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/mang-trong-javascript/lay-phan-tu-trong-mang-javascript/