Một số phương thức xử lý mảng trong Javascript

Một số phương thức xử lý mảng trong Javascript

Trong lập trình, việc biết vận dụng các kiến thức về mảng đặc biệt là nắm rõ cơ chế hoạt động của các hàm xử lý mảng sẽ giúp bạn xử lý dữ liệu phức tạp một cách dễ dàng và nhanh chóng. Ở bài viết này, chúng ta sẽ tìm hiểu một số phương thức để xử lý mảng trong Javascript hay dùng như dưới đây:

1. forEach

forEach được sử dụng để lặp qua các phần tử của một mảng. Nó thực hiện một hàm callback cho mỗi phần tử trong mảng.

Ví dụ:

const menu = ["Cơm","Canh","Cá","Rau"]
console.log(`MENU`);
menu.forEach((item,index,array)=>{
  console.log(`${index+1}. ${item}`);  
})

Trong đó:

  1. item: Là giá trị của phần tử hiện tại trong mảng.
  2. index (không bắt buộc): Là chỉ số của phần tử hiện tại
  3. array (không bắt buộc): Là mảng gốc mà chúng ta đang lặp qua

Điểm đặc biệt của forEach là không thể sử dụng break hoặc continue như trong vòng lặp for, for of thông thường.

2. Phương thức map của mảng trong Javascript

Phương thức map của mảng trong javascript dùng để tạo ra một mảng mới dựa vào việc xử lý logic lên từng pần tử của mảng ban đầu nhưng không làm thay đổi mảng gốc.

Cú pháp:

const newArray = array.map((item, index, array)=>
{ // code để xử lý từng phần tử
return newValue; // return giá trị
});

Trong đó:

  1. currentValue: Là giá trị của phần tử hiện tại
  2. index (không bắt buộc): Là chỉ số của phần tử hiện tại
  3. array (không bắt buộc): Là mảng gốc mà chúng ta đang lặp qua

Ví dụ: cho mảng a như sau: const a = [5,6,10,8,9]. Tạo ra mảng b với phần tử có giá trị là phần tử mảng a + 5 đơn vị

Cách làm:

const b = a.map((item,index)=>item+5)
console.log(b); // [10,11,15,13,14]

3. Phương thức filter của mảng trong Javascript

Cũng giống như phương thức map, filter cũng tạo ra mảng mới nhưng mảng này sẽ chỉ chứa những phần tử thoải mãn điều kiện nào đó trong hàm callback và cũng không làm thay đổi mảng gốc.

Cú pháp:

const newArray = array.filter((currentValue, index, array)=> {
// trả về true hoặc false để quyết định có giữ phần tử không
return (condition) // return điều kiện
});


Trong đó:

  1. currentValue: Là giá trị của phần tử hiện tại
  2. index (không bắt buộc): Là chỉ số của phần tử hiện tại
  3. array (không bắt buộc): Là mảng gốc mà chúng ta đang lặp qua

Ví dụ: cho mảng a như sau const a = [5,6,10,8,9]. Tạo ra mảng b với phần tử có các phần tử là lẻ từ mảng a.

Cách làm

const b = a.filter((item,index)=>{
  return item%2==1 //return điều kiện và phần tử của mảng c là những phần tử thỏa mã điều kiện return
})
console.log(b); // [5,9]

4. Phương thức reduce của mảng trong Javascript

Phương thức reduce của mảng trả về một giá trị duy nhất được tích lũy dựa trên việc thực hiện một hàm lên từng phần tử của mảng, từ trái sang phải.

Cú pháp:

let result = array.reduce((accumulator, currentValue, index, array)=>{
// code xử lý
return newAccumulator;
}, initialValue);

Trong đó:

  1. accumulator: Giá trị tích lũy sau mỗi lần lặp (nó là kết quả trả về từ lần gọi hàm trước đó).
  2. currentValue: Giá trị của phần tử hiện tại.
  3. index (không bắt buộc): Chỉ số của phần tử hiện tại.
  4. array (không bắt buộc): Mảng mà bạn đang lặp qua.
  5. initialValue (không bắt buộc): Giá trị khởi tạo cho accumulator. Nếu không có initialValue,giá trị khởi tạo sẽ mặc định = 0.

Ví dụ: cho mảng a như sau const a = [5,6,10,8,9]. Hãy tính tổng các phần tử của mảng a

Cách làm:

const result = a.reduce((tong,item,index)=>tong+item,0)
console.log(result); // Output: 37
Được viết bởi: Ngọc Ngô

Bài viết cùng chuyên mục

Vote 0