Làm việc với mảng trong JavaScript (ESMAScript)

Mảng trong JavaScript là một dạng đối tượng đặc biệt, có thể chứa cả dữ liệu nguyên thủy lẫn các đối tượng phức tạp.

const list = new Array("x", "y", "z");
console.log(list[1]); // in ra: y

Truy cập phần tử qua chỉ số

Bên cạnh cách truy cập truyền thống, bạn có thể dùng phương thức at() để truy cập từ cuối mảng bằng chỉ số âm:

const list = ["x", "y", "z", "w", "v", "u"];
console.log(list[1]);      // in ra: y
console.log(list.at(-1));  // in ra: u

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

  • push(): thêm vào cuối mảng
  • pop(): xóa phần tử cuối
  • unshift(): thêm vào đầu mảng
  • shift(): xóa phần tử đầu
let data = ["x", "y", "z", "w", "v", "u"];

data.push("9");           // ['x','y','z','w','v','u','9']
data.pop();               // quay lại ban đầu
data.unshift("8", "7");   // ['8','7','x','y','z','w','v','u']
data.shift();             // ['7','x','y','z','w','v','u']

Sử dụng splice() để thao tác linh hoạt

Phương thức này cho phép thêm, xóa hoặc thay thế phần tử tại vị trí bất kỳ:

let data = ["x", "y", "z", "w", "v", "u"];

data.splice(1, 2);        // xóa 2 phần tử từ vị trí 1 → ['x','w','v','u']
data.splice(1, 0, "A", "B"); // chèn tại vị trí 1 → ['x','A','B','w','v','u']
data.splice(1, 1, "Z");   // thay thế → ['x','Z','B','w','v','u']

Cắt ngắn mảng bằng thuộc tính length

let items = ["x", "y", "z", "w", "v", "u"];
items.length = 1;
console.log(items); // ['x']

// Muốn xóa toàn bộ: gán length = 0

Duyệt mảng với 3 cách for

const items = ["x", "y", "z", "w", "v", "u"];

// 1. Vòng lặp for cổ điển
for (let i = 0; i < items.length; i++) {
  console.log(items[i]);
}

// 2. for...in (trả về chỉ số)
for (let idx in items) {
  console.log(idx, items[idx]);
}

// 3. for...of (trả về giá trị)
for (let val of items) {
  console.log(val);
}

Trích xuất mảng với slice()

Không làm thay đổi mảng gốc:

const source = ["x", "y", "z", "w", "v", "u"];
const subset = source.slice(1, 3); // từ index 1 đến trước index 3
console.log(subset); // ['y', 'z']

Gộp mảng

Dùng push() với spread operator

let base = ["x", "y", "z"];
let extra = ["1", "2", "3"];

base.push(...extra); // gộp từng phần tử
console.log(base); // ['x','y','z','1','2','3']

Dùng concat()

let part1 = ["x", "y", "z"];
let part2 = ["1", "2", "3"];
let part3 = ["!", "@", "#"];

let merged = part1.concat(part2, part3);
console.log(merged); // ['x','y','z','1','2','3','!','@','#']

Chuyển mảng thành chuỗi với join()

let letters = ["x", "y", "z"];
console.log(letters.join("-")); // "x-y-z"

Tìm kiếm phần tử

indexOf() - tìm vị trí

let values = ["x", "y", "z"];
console.log(values.indexOf("y")); // 1

includes() - kiểm tra sự tồn tại

let pool = ["x", "y", "z", "w", "v", "u", "t", "s"];
console.log(pool.includes("x")); // true

find() - tìm đối tượng theo điều kiện

const people = [
  { name: "Lê Văn A", age: 20 },
  { name: "Nguyễn Thị B", age: 25 },
  { name: "Trần Văn C", age: 30 }
];

const target = people.find(person => person.name === "Lê Văn A");
console.log(target);

findIndex() - tìm chỉ số của đối tượng

console.log(people.findIndex(p => p.age === 20)); // 0

Sắp xếp mảng

Dùng sort() cho số và đối tượng

// Sắp xếp số
let nums = [30, 5, 9, 70, 12, 40, 1];
nums.sort((a, b) => a - b); // tăng dần
nums.sort((a, b) => b - a); // giảm dần

// Sắp xếp đối tượng theo trường id
const records = [
  { id: 300, name: "Lê Văn A", age: 20 },
  { id: 298, name: "Nguyễn Thị B", age: 25 },
  { id: 299, name: "Trần Văn C", age: 30 }
];

records.sort((a, b) => a.id - b.id);

Đảo ngược thứ tự với reverse()

let sequence = [30, 5, 9, 70, 12, 40, 1];
sequence.reverse();
console.log(sequence); // [1, 40, 12, 70, 9, 5, 30]

Thẻ: JavaScript array es6

Đăng vào ngày 14 tháng 7 lúc 10:30