当前位置：首页 > news >正文

js-对象浅拷贝和深拷贝（ B复制A，看B的值对比：都变为浅，一变一不变为深）

news 来源：原创 2025/5/11 3:15:25

1.前言

js的数据类型分为

基本数据类型（number、string、boolean、null、undefined、symbol）
引用类型（object、array、function）

对象的拷贝分为浅拷贝与深拷贝。在对于对象或数组处理时不同的应用场景。

2.对象浅拷贝

基本数据类型的赋值是直接复制值本身，而不是引用，所以修改一个变量的值不会影响到另外一个变量的值。

let a = 10;
let b = a;  // 浅拷贝，b得到的是a的值
b = 20;     // 修改b的值
console.log(a); // 输出 10，a的值没有被改变
console.log(b); // 输出 20

基本数据类型，b是a的浅拷贝，修改b不会影响a。

3.对象深拷贝

引用类型直接赋值是复制的引用(内存地址)，而不是值的本身。所以当修改复制后对象的属性会影响到另外一个对向的属性。

let obj1 = { name: 'Alice' };
let obj2 = obj1;  // 浅拷贝，obj2得到的是obj1的引用
obj2.name = 'Bob'; // 修改obj2的属性
console.log(obj1.name); // 输出 'Bob'，obj1的属性被改变
console.log(obj2.name); // 输出 'Bob'

引用对象类型，直接赋值是浅拷贝复制的引用，修改obj2的属性会影响obj1。

完全独立的复制一个对象或数组时，需要使用对象深拷贝。

function deepClone(obj) {
  return JSON.parse(JSON.stringify(obj));
}

let obj1 = { name: 'Alice', details: { age: 25 } };
let obj2 = deepClone(obj1);  // 深拷贝
obj2.details.age = 30;       // 修改obj2的属性
console.log(obj1.details.age); // 输出 25，obj1的属性没有被改变
console.log(obj2.details.age); // 输出 30

引用对象类型深拷贝，修改obj2的属性不会影响obj1。。

const cloneArr = arr => {
    const result = [];
    if (isNull(arr)) {
        return result;
    }
    for (let index = 0, len = arr.length; index < len; index++) {
        result[index] = cloneObject(arr[index]);
    }
    return result;
}