Tại sao việc sử dụng toán tử spread (...) để sao chép mảng đa chiều (Nested Arrays) lại không tạo ra một bản sao hoàn toàn độc lập (Deep Copy) và giải pháp tiêu chuẩn để khắc phục là gì?

Question

Accepted Answer

Bản chất của toán tử Spread (...) trong JavaScript
Toán tử spread (...) thực hiện việc sao chép nông (Shallow Copy). Điều này có nghĩa là nó tạo ra một mảng mới, nhưng các phần tử bên trong mảng đó (nếu là kiểu dữ liệu tham chiếu như Object hoặc một mảng con khác) vẫn chỉ lưu giữ địa chỉ tham chiếu trỏ đến cùng một ô nhớ với mảng gốc.
Ví dụ về vấn đề tham chiếu
const originalArray = [[1, 2], [3, 4]];
const shallowCopy = [...originalArray];

// Thay đổi dữ liệu bên trong mảng con
shallowCopy[0][0] = 99;

console.log(originalArray[0][0]); // Kết quả: 99 (Mảng gốc bị ảnh hưởng ngoài ý muốn)
Giải pháp khắc phục tiêu chuẩn

Sử dụng cấu hình Deep Copy đệ quy thủ công hoặc thư viện:
Trong môi trường Enterprise, để đảm bảo an toàn trạng thái (State Immutability), người ta thường sử dụng hàm đệ quy tùy chỉnh hoặc các tiện ích từ thư viện chuẩn.

Sử dụng API hiện đại structuredClone():
Các trình duyệt hiện đại và Node.js đã hỗ trợ hàm native structuredClone() giúp sao chép sâu toàn bộ cấu trúc mảng và đối tượng một cách an toàn.

const originalArray = [[1, 2], [3, 4]];
const deepCopy = structuredClone(originalArray);

deepCopy[0][0] = 99;

console.log(originalArray[0][0]); // Kết quả: 1 (Mảng gốc được giữ nguyên an toàn)
Lưu ý kinh nghiệm thực chiến

Không sử dụng JSON.parse(JSON.stringify(array)) cho các mảng chứa hàm (Functions), đối tượng undefined, Date, hoặc RegExp vì sẽ làm mất dữ liệu hoặc sai lệch kiểu.
Luôn kiểm tra tính tương thích môi trường trước khi sử dụng structuredClone() đối với các hệ thống legacy cũ.

Tại sao việc sử dụng toán tử spread (...) để sao chép mảng đa chiều (Nested Arrays) lại không tạo ra một bản sao hoàn toàn độc lập (Deep Copy) và giải pháp tiêu chuẩn để khắc phục là gì?

Bản chất của toán tử Spread (...) trong JavaScript

Làm Chủ Phỏng Vấn & Nâng Cao Trình Độ Chuyên Nghiệp

Tải Tuyển Tập 100+ Câu Hỏi Phỏng Vấn Chuyên Sâu (PDF)

Cần Mentor Phỏng Vấn Thử 1-1 & Tối Ưu CV?

Kiểm Tra CV Chuẩn ATS Miễn Phí

Câu hỏi arrays liên quan cùng chủ đề