浅拷贝以及四种深拷贝的方法

it2024-12-12  15

浅拷贝:仅仅是指针给了另一个对象 深拷贝 两个对象之间没有任何关系

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> // 浅拷贝:仅仅是指针给了另一个对象 var obj = { name: '小甜甜', age: 24, say() { console.log('bebebeautiful'); } } // var obj1 = obj; // console.log(obj1); // obj1.name = 'xiaolajiao'; // console.log(obj); // 深拷贝 两个对象之间没有任何关系 // 1. 通过json实现 属性可以深拷贝 但是会造成方法丢失 // var obj1 = JSON.stringify(obj); // obj1 = JSON.parse(obj1); // // console.log(obj1); //小甜甜 // obj1.name = '小番茄'; // 此时打印obj 它感受不到变化 // console.log(obj); //小甜甜 // //2. 通过for-in遍历循环 实现 // var obj1 = {}; // for (var attr in obj) { // obj1[attr] = obj[attr] // } // console.log(obj1); // obj1.say(); // 修改obj1 obj不能感受到 // obj1.name = '呵呵'; // console.log(obj); // 3.使用Object.assign()实现 var obj1 = {}; Object.assign(obj1, obj); // 这是将obj合并到obj1上 console.log(obj1); obj1.age = 66; //obj感受不到变化 console.log(obj); // 4.用...实现对象的深拷贝 //...叫做扩展运算符 ES6新增 // 使用场景 在函数调用 或数组构造时,将数组表达式或者string在语法层面展开 var obj = { name: 'xtt', age: 18 }; // console.log(...obj); //报错 var obj1 = { ...obj }; // console.log(obj1); obj1.age = 66; //改变obj1,不影响obj // console.log(obj); </script> </body> </html>

以上就是今天的分享,欢迎补充探讨~~

最新回复(0)