Gộp mảng với Spread Operator trong JavaScript

Spread operator ... (ES6) gộp mảng ngắn gọn, dễ đọc hơn concat().

Cú pháp

const merged = [...arr1, ...arr2, ...arr3];

Ví dụ: Gộp 2 mảng

<script>
  const arr1 = [1, 2, 3];
  const arr2 = [4, 5, 6];
  
  // Cũ: concat()
  const merged1 = arr1.concat(arr2);
  
  // Mới: Spread
  const merged2 = [...arr1, ...arr2];
  
  document.write(merged2); // 1,2,3,4,5,6
</script>

Ví dụ: Gộp 3+ mảng

const arr1 = [1,2,3];
const arr2 = [4,5,6];
const arr3 = [7,8,9];

const merged = [...arr1, ...arr2, ...arr3];
// [1,2,3,4,5,6,7,8,9]

// concat() cần chain: arr1.concat(arr2).concat(arr3) — ít tự nhiên hơn

Chèn mảng vào giữa

const arr1 = [1, 2];
const arr2 = [3, 4];
const combined = [0, ...arr1, 2.5, ...arr2, 5];
// [0, 1, 2, 2.5, 3, 4, 5] — linh hoạt vị trí

Clone mảng (Shallow copy)

const original = [1, 2, 3];
const clone = [...original];
clone[0] = 99;
console.log(original); // [1,2,3] — không ảnh hưởng
console.log(clone);    // [99,2,3]

So sánh với concat()

Lưu ý

• Spread tạo shallow copy — nested object/array vẫn shared reference.
• Không dùng cho mảng cực lớn (stack limit ~100k-200k elements) — dùng concat hoặc loop.
• arr.push(...otherArr) thêm vào mảng hiện có (mutate) — thay vì arr = [...arr, ...otherArr].