Mảng (Array) trong JavaScript: Các phương thức cần biết 2026
Khi lập trình JavaScript, bạn sẽ liên tục làm việc với Array (mảng) – một trong những cấu trúc dữ liệu quan trọng nhất. Array cho phép lưu trữ và xử lý nhiều giá trị trong một biến duy nhất.
Bài viết này hướng dẫn toàn diện về Array trong JavaScript, từ cơ bản đến các phương thức nâng cao như map, filter, reduce.
Array trong JavaScript là gì?
Array là tập hợp dữ liệu có thứ tự, truy cập qua index (bắt đầu từ 0), có thể chứa nhiều kiểu dữ liệu khác nhau.
// Tạo array
const fruits = ["táo", "chuối", "xoài"];
const numbers = [1, 2, 3, 4, 5];
const mixed = [1, "hello", true, null, { name: "An" }];
const empty = [];
// Truy cập phần tử
console.log(fruits[0]); // "táo"
console.log(fruits[2]); // "xoài"
console.log(fruits.length); // 3
// Phần tử cuối cùng
console.log(fruits[fruits.length - 1]); // "xoài"
Thêm và xóa phần tử
const arr = ["a", "b", "c"];
// push: thêm vào cuối
arr.push("d");
console.log(arr); // ["a", "b", "c", "d"]
// pop: xóa phần tử cuối, trả về giá trị đó
const last = arr.pop();
console.log(last); // "d"
// unshift: thêm vào đầu
arr.unshift("z");
// shift: xóa phần tử đầu
const first = arr.shift();
// splice: thêm/xóa linh hoạt
arr.splice(1, 2); // Xóa 2 phần tử từ index 1
arr.splice(1, 0, "X", "Y"); // Chèn không xóa
forEach – Lặp qua từng phần tử
const fruits = ["táo", "chuối", "xoài"];
fruits.forEach((fruit, index) => {
console.log(`${index}: ${fruit}`);
});
// 0: táo
// 1: chuối
// 2: xoài
map() – Biến đổi từng phần tử
map() tạo ra một array mới bằng cách áp dụng hàm lên từng phần tử:
const numbers = [1, 2, 3, 4, 5];
// Nhân đôi tất cả
const doubled = numbers.map(n => n * 2);
console.log(doubled); // [2, 4, 6, 8, 10]
// Tạo array object từ array chuỗi
const names = ["An", "Bình", "Cường"];
const people = names.map(name => ({
name: name,
length: name.length
}));
filter() – Lọc phần tử
filter() tạo array mới chỉ chứa những phần tử thỏa điều kiện:
const scores = [45, 72, 88, 35, 91, 60];
// Lọc điểm trên 70
const passing = scores.filter(score => score >= 70);
console.log(passing); // [72, 88, 91]
reduce() – Tính toán tích lũy
reduce() rút gọn array thành một giá trị duy nhất:
const numbers = [1, 2, 3, 4, 5];
// Tính tổng
const sum = numbers.reduce((accumulator, current) => accumulator + current, 0);
console.log(sum); // 15
// Tính tích
const product = numbers.reduce((acc, cur) => acc * cur, 1);
console.log(product); // 120
// Tìm giá trị lớn nhất
const max = numbers.reduce((acc, cur) => cur > acc ? cur : acc);
console.log(max); // 5
Tìm kiếm trong Array
const nums = [10, 20, 30, 20, 50];
console.log(nums.indexOf(20)); // 1
console.log(nums.includes(30)); // true
const found = nums.find(n => n > 25);
console.log(found); // 30
Spread Operator và Destructuring
// Spread: mở rộng array
const a = [1, 2, 3];
const b = [4, 5, 6];
const merged = [...a, ...b]; // [1, 2, 3, 4, 5, 6]
// Destructuring: gán biến từ array
const [first, second, ...rest] = [10, 20, 30, 40, 50];
console.log(first); // 10
console.log(rest); // [30, 40, 50]
Bảng tổng hợp phương thức Array
| Phương thức | Mục đích | Trả về |
|---|---|---|
| push(x) | Thêm vào cuối | Độ dài mới |
| pop() | Xóa phần tử cuối | Phần tử đã xóa |
| unshift(x) | Thêm vào đầu | Độ dài mới |
| shift() | Xóa phần tử đầu | Phần tử đã xóa |
| splice(i, n) | Thêm/xóa linh hoạt | Phần tử đã xóa |
| slice(i, j) | Cắt array | Array mới |
| map(fn) | Biến đổi từng phần tử | Array mới |
| filter(fn) | Lọc phần tử | Array mới |
| reduce(fn) | Tích lũy | Giá trị đơn |
| forEach(fn) | Lặp qua từng phần tử | undefined |
| find(fn) | Tìm phần tử đầu tiên | Phần tử hoặc undefined |
| includes(x) | Kiểm tra tồn tại | true/false |
| sort(fn) | Sắp xếp | Array đã sắp xếp |
| join(sep) | Kết hợp thành chuỗi | String |
