Làm Thế Nào Để Sao Chép Một Đối Tượng Trong JavaScript

Sao chép một đối tượng trong JavaScript có thể thực hiện theo nhiều cách, từ đơn giản đến phức tạp, tùy thuộc vào độ sâu của cấu trúc đối tượng. Dưới đây là các phương pháp phổ biến:

1. Sao Chép Nông (Shallow Copy)

Sao chép nông tạo một bản sao của đối tượng ban đầu, nhưng các đối tượng con vẫn là tham chiếu đến đối tượng gốc.

Sử Dụng Toán Tử Spread (...)

• Cú pháp:

  let copy = { ...original };
  

• Ví dụ:

  let original = { name: "Alice", age: 25, address: { city: "New York" } };
  let copy = { ...original };
  
  console.log(copy);
  // Output: { name: 'Alice', age: 25, address: { city: 'New York' } }
  
  copy.name = "Bob";
  copy.address.city = "Los Angeles";
  
  console.log(original);
  // Output: { name: 'Alice', age: 25, address: { city: 'Los Angeles' } }
  

Sử Dụng Object.assign()

• Cú pháp:

  let copy = Object.assign({}, original);
  

• Ví dụ:

  let original = { name: "Alice", age: 25, address: { city: "New York" } };
  let copy = Object.assign({}, original);
  
  console.log(copy);
  // Output: { name: 'Alice', age: 25, address: { city: 'New York' } }
  
  copy.name = "Bob";
  copy.address.city = "Los Angeles";
  
  console.log(original);
  // Output: { name: 'Alice', age: 25, address: { city: 'Los Angeles' } }
  

2. Sao Chép Sâu (Deep Copy)

Sao chép sâu tạo một bản sao của đối tượng ban đầu cùng với tất cả các đối tượng con của nó.

Sử Dụng JSON

• Cú pháp:

  let deepCopy = JSON.parse(JSON.stringify(original));
  

• Ví dụ:

  let original = { name: "Alice", age: 25, address: { city: "New York" } };
  let deepCopy = JSON.parse(JSON.stringify(original));
  
  console.log(deepCopy);
  // Output: { name: 'Alice', age: 25, address: { city: 'New York' } }
  
  deepCopy.name = "Bob";
  deepCopy.address.city = "Los Angeles";
  
  console.log(original);
  // Output: { name: 'Alice', age: 25, address: { city: 'New York' } }
  

• Lưu ý: Phương pháp này không sao chép được các hàm và các thuộc tính không liệt kê được.

Sử Dụng Thư Viện lodash

• Cài đặt:

  npm install lodash
  

• Sử dụng:

  const _ = require('lodash');
  let deepCopy = _.cloneDeep(original);
  

• Ví dụ:

  const _ = require('lodash');
  
  let original = { name: "Alice", age: 25, address: { city: "New York" } };
  let deepCopy = _.cloneDeep(original);
  
  console.log(deepCopy);
  // Output: { name: 'Alice', age: 25, address: { city: 'New York' } }
  
  deepCopy.name = "Bob";
  deepCopy.address.city = "Los Angeles";
  
  console.log(original);
  // Output: { name: 'Alice', age: 25, address: { city: 'New York' } }
  

Tổng Kết

• Sao chép nông (Shallow Copy):

  • Sử dụng toán tử spread (...): { ...original }
  • Sử dụng Object.assign(): Object.assign({}, original)
  • Phù hợp cho các đối tượng đơn giản hoặc khi các đối tượng con không cần sao chép độc lập.

• Sao chép sâu (Deep Copy):

  • Sử dụng JSON: JSON.parse(JSON.stringify(original))
  • Sử dụng thư viện lodash: _.cloneDeep(original)
  • Phù hợp cho các đối tượng phức tạp có các đối tượng con cần sao chép độc lập.
  • Lưu ý các hạn chế của phương pháp JSON như không sao chép được các hàm và các thuộc tính không liệt kê được.

Việc chọn phương pháp sao chép nào phụ thuộc vào độ phức tạp của đối tượng và yêu cầu cụ thể của bạn.