java回顾第七天

Java基础练习题(数组)2

  返回  

js的浅拷贝和深拷贝

2021/8/21 18:18:26 浏览:

问题:直接用 = 把一个对象赋值给另一个对象,修改新对象时,原对象也发生变化。
原因:JavaScript 中对象的赋值默认是引用赋值(两个对象指向相同的内存地址)
关于js的浅拷贝和深拷贝的理解

  1. 浅拷贝赋值时,基本数据类型按值传递,对象按引用传递(只复制指向某个对象的指针,而不复制对象本身),新对象和原对象共享同一块内存,修改新对象会改变原对象。
  2. 深拷贝会另外创造一个和原对象一模一样新对象,新对象跟原对象不共享内存,修改新对象不会改变原对象。

浅拷贝的实现方式

  1. = 直接赋值
Object.assign(target, ...sources)

Object.assign是ES6的新函数。可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。
3. 展开语法

let objClone = { ...obj };

深拷贝实现方式

  1. 手动复制
var obj1 = { a: 1, b: 2, c: 3 };
var obj2 = { 
   a: obj1.a, 
   b: obj1.b, 
   c: obj1.c 
};
  1. JSON序列化
var obj1={a:2,b{c:0}}
var obj2=JSON.parse(JSON.stringify(obj1))

缺点:
1.取不到值为undefined的键
2.NaN和无穷转变为null
3.原型内容
4.date对象转为date字符串
function、RegExp等,使用JSON序列化时会造成属性丢失

  1. 原生JS实现深拷贝
// 定义一个深拷贝函数  接收目标target参数
function deepClone(target) {
    // 定义一个变量
    let result;
    // 如果target是对象
    if (typeof target === 'object') {
        // 如果是一个数组的话
        if (Array.isArray(target)) {
            result = []; // 将result赋值为一个数组,执行遍历
            for (let i in target) {
                // 递归拷贝数组中的每一项
                result.push(deepClone(target[i]))
            }
         // 如果target是null;直接赋值为null
        } else if (target === null) {
            result = null;
         // 如果target是一个RegExp对象,直接赋值 
        } else if (target.constructor === RegExp) {
            result = target;
        } else {
            // 否则target是普通对象,直接for in循环,递归赋值对象的所有值
            result = {};
            for (let i in target) {
                result[i] = deepClone(target[i]);
            }
        }
    } else {
        // 如果不是对象,就是基本数据类型,直接赋值
        result = target;
    }
    // 返回最终结果
    return result;
}

联系我们

如果您对我们的服务有兴趣,请及时和我们联系!

服务热线:18288888888
座机:18288888888
传真:
邮箱:888888@qq.com
地址:郑州市文化路红专路93号