Sự khác biệt giữa bản sao nông và bản sao sâu với các mảng JavaScript là gì?

Question

Theo tài liệu MDN, hãy gọi array.slice() sẽ tạo bản sao nông của mảng.

Xem điều này MDN link for slice().

Tuy nhiên, nếu tôi chạy một thử nghiệm đơn giản như vậy trong giao diện điều khiển:

var test = [[1,2,3],7,8,9]; 
var shallow_copy = test.slice(); 

và kiểm tra shallow_copy, tôi có thể thấy rằng toàn bộ 2 mảng chiều dường như được sao chép.

Sự khác nhau giữa bản sao nông và bản sao sâu? Nếu tôi đoán, tôi sẽ gọi đây là một bản sao sâu.

Answer 1

Để thấy sự khác biệt, hãy thử:

shallow_copy[0][2] = 4; 
console.dir(test); 

Bạn sẽ thấy rằng test đã được sửa đổi! Điều này là do trong khi bạn có thể đã sao chép các giá trị vào mảng mới, mảng lồng nhau vẫn là một mảng giống nhau.

Bản sao sâu sẽ đệ quy đệ quy các bản sao nông cho đến khi mọi thứ đều là bản sao mới của bản gốc.

Answer 2

Về cơ bản, bạn chỉ nhận được tham chiếu đến biến/mảng ban đầu. Thay đổi tham chiếu cũng sẽ thay đổi mảng ban đầu. Bạn cần lặp lại các giá trị của mảng ban đầu và tạo một bản sao.

Hãy xem xét ví dụ sau:

var orig = { a: 'A', b: 'B', c: 'C' }; 

Hãy nói rằng bạn muốn tạo một bản sao của này, do đó ngay cả khi bạn thay đổi các giá trị ban đầu, bạn luôn có thể quay trở lại với bản gốc.

tôi có thể làm điều này:

var dup = orig; //Shallow copy! 

Nếu chúng ta thay đổi một giá trị:

dup.a = 'Apple'; 

Tuyên bố này cũng sẽ thay đổi a từ orig, vì chúng ta có một bản sao cạn, hoặc một tham chiếu đến var orig. Điều này có nghĩa là bạn cũng đang mất dữ liệu gốc.

Tuy nhiên, việc tạo biến hoàn toàn mới bằng cách sử dụng các thuộc tính từ biến số orig gốc, bạn có thể tạo bản sao sâu.

var dup = { a: orig.a, b: orig.b, c: orig.c }; //Deep copy! 

Bây giờ nếu bạn thay đổi dup.a, nó sẽ chỉ ảnh hưởng đến dup và không orig.