深拷贝和浅拷贝的区别及实现

最新推荐文章于 2025-06-11 20:13:45 发布

原创最新推荐文章于 2025-06-11 20:13:45 发布 · 345 阅读

0 ·

CC 4.0 BY-SA版权

笔记专栏收录该内容

3 篇文章

订阅专栏

本文深入解析JavaScript中的基本数据类型与引用数据类型的存储方式，重点阐述闭包变量的内存管理，以及深拷贝与浅拷贝的区别和实现方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

js分两大数据类型：

基本数据类型：Number，String，Boolean，Undefined，Null。（栈内存）

引用数据类型：Date，Function，RegExp等（堆内存）

注意：闭包中的变量并不保存在栈内存中，而是保存在堆内存中。如果闭包中的变量保存在了栈内存中，随着外层中的函数从调用栈中销毁，变量也会被销毁，但是如果保存在了堆内存中，内存函数仍能访问外层已销毁函数中的变量。

区别：

深拷贝：从堆内存中开辟一个新的区域存放新对象,新对象跟原对象不共享内存，修改新对象不会改到原对象。

例如：B复制了A，修改A，B的值不改变，为浅拷贝。

浅拷贝：从栈内存中开辟一个新的区域存放新对象,新对象跟原对象共享内存，修改新对象会改到原对象。

例如：B复制了A，修改A，B的值也发生了改变，为深拷贝。

实现深拷贝：

方法一：

    // 深拷贝
    deepClone (obj) {
      const objClone = Array.isArray(obj) ? [] : {}
      if (obj && typeof obj === 'object') {
        for (const key in obj) {
          if (obj.hasOwnProperty(key)) {
            // 判断obj子元素是否为对象，如果是，递归拷贝
            if (obj[key] && typeof obj[key] === 'object') {
              objClone[key] = this.deepClone(obj[key])
            } else {
              objClone[key] = obj[key]
            }
            objClone[key] = obj[key]
          }
        }
      }
      return objClone
    }

方法二：

    // 深拷贝2
    deepClone2 (obj) {
        return JSON.parse(JSON.stringify(obj))
    }

方法三：

$.extend(true,object1, object2);

实现浅拷贝：

slice()，push()，unshift()等方法就是拷贝。