Trong quá trình phát triển JavaScript, chúng ta thường cần chuyển đổi mảng sang đối tượng có định dạng cụ thể. Ví dụ, chuyển đổi mảng sau:

["quyen-1", "quyen-con-51", "quyen-con-52", "quyen-con-53"]

Thành một đối tượng trong đó **mỗi phần tử mảng làm khóa**, **giá trị đều là `true`**:

{
  "quyen-1": true,
  "quyen-con-51": true,
  "quyen-con-52": true,
  "quyen-con-53": true
}

Bài viết này sẽ giới thiệu 5 phương pháp thực hiện và đưa ra đề xuất thực hành tốt nhất.

Phương pháp 1: Sử dụng Object.fromEntries + map

(Khuyến nghị cho ES2019+)

const danhSachPhanTu = ["quyen-1", "quyen-con-51", "quyen-con-52", "quyen-con-53"];
const ketQua = Object.fromEntries(danhSachPhanTu.map(phanTu => [phanTu, true]));

• Nguyên lý: Ánh xạ mảng sang định dạng [[khóa, giá trị], ...], sau đó chuyển đổi thành đối tượng.
• Lợi ích: Code ngắn gọn, hoàn thành trong một dòng.

Phương pháp 2: Sử dụng reduce

(Tương thích tốt)

const ketQua = danhSachPhanTu.reduce((bienTichLuy, phanTu) => {
  bienTichLuy[phanTu] = true;
  return bienTichLuy;
}, {});

• Nguyên lý: Duyệt qua mảng, thêm mỗi phần tử làm khóa vào đối tượng tích lũy.
• Lợi ích: Tương thích với trình duyệt cũ, không cần polyfill.

Phương pháp 3: Vòng lặp for…of

(Cách sử dụng vòng lặp truyền thống)

const ketQua = {};
for (const phanTu of danhSachPhanTu) {
  ketQua[phanTu] = true;
}

• Nguyên lý: Duyệt qua mảng một cách rõ ràng, thao tác trực tiếp với đối tượng.
• Lợi ích: Trực quan, dễ hiểu, hiệu suất tốt.

Phương pháp 4: forEach

(Phong cách hàm)

const ketQua = {};
danhSachPhanTu.forEach(phanTu => (ketQua[phanTu] = true));

• Nguyên lý: Duyệt mảng thông qua forEach, sửa đổi đối tượng bằng tác dụng phụ.
• Lưu ý: Code gọn gàng nhưng phụ thuộc vào biến bên ngoài.

Phương pháp 5: Object.assign + toán tử spread

(Không khuyến nghị, chỉ để tham khảo)

const ketQua = Object.assign({}, ...danhSachPhanTu.map(phanTu => ({ [phanTu]: true })));

• Nguyên lý: Chuyển đổi mảng thành nhiều đối tượng {khóa: true}, sau đó hợp nhất.
• Nhược điểm: Khả năng đọc code kém, hiệu suất thấp hơn một chút.

Phương pháp được đề xuất

• Trình duyệt/Node.js hiện đại: Ưu tiên sử dụng Object.fromEntries (phương pháp 1).
• Môi trường tương thích cũ: Chọn reduce (phương pháp 2) hoặc for…of (phương pháp 3).

Ví dụ hoàn chỉnh

const danhSachPhanTu = ["quyen-1", "quyen-con-51", "quyen-con-52", "quyen-con-53"];
const ketQua = Object.fromEntries(danhSachPhanTu.map(phanTu => [phanTu, true]));

console.log(JSON.stringify(ketQua, null, 2));
// Kết quả:
// {
//   "quyen-1": true,
//   "quyen-con-51": true,
//   "quyen-con-52": true,
//   "quyen-con-53": true
// }

Xử lý tương thích

Nếu cần sử dụng phương pháp 1 trong các môi trường **không hỗ trợ** `Object.fromEntries`, có thể thêm polyfill:

if (!Object.fromEntries) {
  Object.fromEntries = function(nhap) {
    const doiTuong = {};
    nhap.forEach(([khoa, giaTri]) => (doiTuong[khoa] = giaTri));
    return doiTuong;
  };
}

Tóm tắt

Chọn giải pháp phù hợp nhất với nhu cầu của bạn!