Mảng (Array) trong JavaScript: Các phương thức cần biết 2026

Trong lập trình JavaScript, rất hiếm khi bạn làm việc với một giá trị đơn lẻ. Hầu hết trường hợp thực tế đều liên quan đến tập hợp dữ liệu — danh sách sản phẩm, mảng điểm số, kết quả từ API. Đó là lúc Array (mảng) phát huy vai trò.

Bài này hướng dẫn toàn diện Array trong JavaScript — từ cú pháp cơ bản đến các phương thức quan trọng như map, filter, reduce.

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

const fruits = ["táo", "chuối", "xoài"];
const numbers = [1, 2, 3, 4, 5];
const mixed = [1, "hello", true, null, { name: "An" }];

// Truy cập phần tử
console.log(fruits[0]);               // "táo"
console.log(fruits[fruits.length - 1]); // "xoài" — phần tử cuối

Thêm và xóa phần tử

push() và pop() — Thao tác ở cuối

const arr = ["a", "b", "c"];

arr.push("d");       // Thêm vào cuối
console.log(arr);    // ["a", "b", "c", "d"]

const last = arr.pop(); // Xóa và trả về phần tử cuối
console.log(last);      // "d"
console.log(arr);       // ["a", "b", "c"]

unshift() và shift() — Thao tác ở đầu

const arr = ["b", "c"];

arr.unshift("a");    // Thêm vào đầu
console.log(arr);    // ["a", "b", "c"]

const first = arr.shift(); // Xóa và trả về phần tử đầu
console.log(first);        // "a"

splice() — Thêm/xóa linh hoạt

const arr = ["a", "b", "c", "d"];

arr.splice(1, 2);          // Xóa 2 phần tử từ index 1
console.log(arr);          // ["a", "d"]

arr.splice(1, 0, "X", "Y"); // Chèn không xóa
console.log(arr);           // ["a", "X", "Y", "d"]

Tìm kiếm trong Array

const nums = [10, 20, 30, 20, 50];

console.log(nums.indexOf(20));     // 1 (lần xuất hiện đầu)
console.log(nums.lastIndexOf(20)); // 3 (lần xuất hiện cuối)
console.log(nums.includes(30));    // true

// find — phần tử đầu tiên thỏa điều kiện
const found = nums.find(n => n > 25);
console.log(found); // 30

// findIndex — index của phần tử đầu tiên thỏa điều kiện
const idx = nums.findIndex(n => n > 25);
console.log(idx); // 2

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 mảng

map() tạo ra array mới bằng cách áp dụng hàm lên từng phần tử, không thay đổi array gốc:

const numbers = [1, 2, 3, 4, 5];

const doubled = numbers.map(n => n * 2);
console.log(doubled); // [2, 4, 6, 8, 10]

// Biến đổi từ chuỗi thành object
const names = ["An", "Bình", "Cường"];
const people = names.map(name => ({
    name: name,
    length: name.length
}));
// [{ name: "An", length: 2 }, ...]

filter() — Lọc phần tử

filter() trả về array mới chỉ chứa phần tử thỏa điều kiện:

const scores = [45, 72, 88, 35, 91, 60];

const passing = scores.filter(score => score >= 70);
console.log(passing); // [72, 88, 91]

// Kết hợp map và filter
const diem_gioi_lam_tron = scores
    .filter(s => s >= 70)
    .map(s => Math.round(s / 10) * 10);
// [70, 90, 90]

reduce() — Tích lũy thành một giá trị

const numbers = [1, 2, 3, 4, 5];

// Tính tổng
const sum = numbers.reduce((acc, cur) => acc + cur, 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

Sắp xếp Array

const nums = [3, 1, 4, 1, 5, 9, 2, 6];

// Sắp xếp tăng dần — PHẢI dùng callback với số
nums.sort((a, b) => a - b);
console.log(nums); // [1, 1, 2, 3, 4, 5, 6, 9]

// Sắp xếp giảm dần
nums.sort((a, b) => b - a);

// Sắp xếp chuỗi
const fruits = ["chuối", "táo", "xoài"];
fruits.sort(); // Theo thứ tự UTF-16

slice() — Cắt Array (không thay đổi gốc)

const arr = ["a", "b", "c", "d", "e"];

console.log(arr.slice(1, 4)); // ["b", "c", "d"]
console.log(arr.slice(2));    // ["c", "d", "e"]
console.log(arr.slice(-2));   // ["d", "e"]
console.log(arr);             // ["a", "b", "c", "d", "e"] — không đổi

Spread và Destructuring

// Spread: gộp array
const a = [1, 2, 3];
const b = [4, 5, 6];
const merged = [...a, ...b]; // [1, 2, 3, 4, 5, 6]
const copy = [...a];          // Sao chép

// Destructuring: gán biến
const [first, second, ...rest] = [10, 20, 30, 40, 50];
console.log(first); // 10
console.log(rest);  // [30, 40, 50]

join() và split()

const words = ["Xin", "chào", "Việt", "Nam"];
console.log(words.join(" ")); // "Xin chào Việt Nam"

// Ngược lại: chuỗi → array
const str = "táo,chuối,xoài";
const arr = str.split(","); // ["táo", "chuối", "xoài"]

Bảng tổng hợp phương thức Array

Phương thức	Mục đích	Thay đổi gốc?
push(x)	Thêm vào cuối	Có
pop()	Xóa phần tử cuối	Có
unshift(x)	Thêm vào đầu	Có
shift()	Xóa phần tử đầu	Có
splice(i, n)	Thêm/xóa linh hoạt	Có
slice(i, j)	Cắt array	Không
map(fn)	Biến đổi từng phần tử	Không
filter(fn)	Lọc phần tử	Không
reduce(fn)	Tích lũy thành 1 giá trị	Không
forEach(fn)	Lặp qua từng phần tử	Không
find(fn)	Tìm phần tử đầu thỏa ĐK	Không
includes(x)	Kiểm tra tồn tại	Không
sort(fn)	Sắp xếp	Có
join(sep)	Ghép thành chuỗi	Không

Kết luận

Array là cấu trúc dữ liệu bạn sẽ dùng nhiều nhất trong JavaScript. Nắm vững map, filter, reduce — ba phương thức quan trọng nhất — sẽ giúp code của bạn gọn hơn và dễ đọc hơn đáng kể so với vòng lặp for thông thường.