Nhân bản
Sao chép trong javascript không gì khác ngoài việc sao chép một thuộc tính đối tượng sang một đối tượng khác để tránh tạo ra một đối tượng đã tồn tại.
Có một số cách để sao chép một đối tượng javascript.
1) Lặp lại từng thuộc tính và sao chép chúng vào một đối tượng mới.
2) Sử dụng phương thức JSON.
3) Sử dụng phương thức object.assign ().
Hãy thảo luận riêng từng phương pháp
a) Lặp lại từng thuộc tính và sao chép chúng vào một đối tượng mới.
Đây là một phương pháp cũ để sao chép một đối tượng javascript, trong đó mỗi thuộc tính sẽ được lặp lại và sao chép sang một đối tượng mới. Đây là một phương pháp đơn giản nhưng hiếm khi được sử dụng.
Ví dụ
<html>
<body>
<p id="cloning-1"></p>
<script>
const sourceObject = {name:"salman", age:23, salary:25000};
let requiredObj = {};
for (let pro in sourceObject) {
if (sourceObject.hasOwnProperty(pro)) {
requiredObj[pro] = sourceObject[pro];
}
}
document.getElementById("cloning-1").innerHTML =
"targetObject name = "+requiredObj.name+", age = " + requiredObj.age+", salary = "+requiredObj.salary;
</script>
</body>
</html> Đầu ra
targetObject name = salman, age = 23, salary = 25000
b) Phương thức JSON
Đây là một trong những phương pháp hiện đại để sao chép đối tượng JavaScript. Trong phương pháp này, đối tượng nguồn phải an toàn JSON.
Ví dụ
<html>
<body>
<p id="cloning-2"></p>
<script>
const sourceObject = {name:"salman", age:23, salary:25000};
let requiredObj = {};
requiredObj = JSON.parse(JSON.stringify(sourceObject));
document.getElementById("cloning-2").innerHTML =
"targetObject name = "+requiredObj.name+", age = " + requiredObj.age+", salary = "+requiredObj.salary;
</script>
</body>
</html> Đầu ra
targetObject name = salman, age = 23, salary = 25000
c) Object.assign ()
Đây là một phương pháp nâng cao được sử dụng rất thường xuyên hiện nay để sao chép các đối tượng javascript. Phương pháp này chỉ sao chép nông nghĩa là các thuộc tính lồng nhau vẫn được sao chép bằng tham chiếu.
Ví dụ
<html>
<body>
<p id="cloning-3"></p>
<script>
const sourceObject = {name:"salman", age:23, salary:25000};
let requiredObj = {};
requiredObj = Object.assign({}, sourceObject);
document.getElementById("cloning-3").innerHTML =
"targetObject name = "+requiredObj.name+", age = " + requiredObj.age+",salary"+requiredObj.salary;
</script>
</body>
</html> Đầu ra
targetObject name = salman, age = 23, salary = 25000