js深拷贝常用的方法

不爱吃糖的程序媛

发布于 2024-03-28 09:17:00

6230

发布于 2024-03-28 09:17:00

在JavaScript中，实现深拷贝（deep copy）有多种方法。以下是一些常用的方法：

1. 使用JSON方法（局限性大）：

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

这个方法简单易用，但对于循环引用、特殊对象（如Date、RegExp、Set、Map等）以及函数等类型无法正确处理。

2.使用递归函数：

function deepClone(obj, hash = new WeakMap()) {
    if (obj === null) return null;
    if (typeof obj !== 'object') return obj;
    if (hash.has(obj)) return hash.get(obj);

    let cloneObj = new obj.constructor();
    hash.set(obj, cloneObj);

    for (const key in obj) {
        if (obj.hasOwnProperty(key)) {
            cloneObj[key] = deepClone(obj[key], hash);
        }
    }
    return cloneObj;
}

这个方法可以处理大多数情况，包括循环引用，但可能不支持某些特殊对象和函数。

3.使用库： lodash库的_.cloneDeep方法：

import _ from 'lodash';
const newObj = _.cloneDeep(oldObj);

ramda库的cloneDeep方法：

import R from 'ramda';
const newObj = R.cloneDeep(oldObj);

这些库提供了许多实用的函数，但会增加项目的依赖。

4.使用Proxy（ES2018+）：

function deepClone(obj, hash = new WeakMap()) {
    if (obj === null) return null;
    if (typeof obj !== 'object') return obj;
    if (hash.has(obj)) return hash.get(obj);

    let handler = {
        get(target, prop, receiver) {
            if (prop in target) {
                return Reflect.get(target, prop, receiver);
            } else if (typeof prop === 'symbol' && prop in Object.getOwnPropertySymbols(target)) {
                return Reflect.get(target, prop, receiver);
            }
            let cloneObj = new target.constructor();
            hash.set(target, cloneObj);
            return deepClone(target[prop], hash);
        }
    };

    let cloneObj = new Proxy(obj, handler);
    return cloneObj;
}

这种方法是最强大的，可以处理大多数特殊情况，包括函数和循环引用，但也最复杂。每种方法都有其优点和局限性，应根据具体需求选择合适的方法。

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2024-03-26，如有侵权请联系 cloudcommunity@tencent.com 删除

hash