js深度合并对象

最新推荐文章于 2025-06-18 15:21:29 发布

CSGO_888

最新推荐文章于 2025-06-18 15:21:29 发布

阅读量715

点赞数 1

CC 4.0 BY-SA版权

文章标签：前端 javascript

本文链接：https://blog.youkuaiyun.com/CSGO_888/article/details/129055531

该文章提供了两个JavaScript函数，分别用于实现对象的深度合并和深度克隆。深度合并函数处理了目标对象与源对象的属性合并，尤其在属性是对象时进行递归处理。深度克隆函数则用于复制复杂对象，确保新对象与原对象独立。这两个函数对于处理和操作JavaScript中的复杂数据结构非常有用。

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

// JS对象深度合并
function deepMerge(target = {}, source = {}) {
    target = deepClone(target);//深度克隆
    if (typeof target !== 'object' || typeof source !== 'object') return false;//判断类型
    for (var prop in source) {
        if (!source.hasOwnProperty(prop)) continue; //检测属性是否为对象的自有属性
        if (prop in target) { //prop 中是否有 target 属性
            if (typeof target[prop] !== 'object') {
                target[prop] = source[prop];
            } else {
                if (typeof source[prop] !== 'object') {
                    target[prop] = source[prop];
                } else {
                    if (target[prop].concat && source[prop].concat) {
                        target[prop] = target[prop].concat(source[prop]); //合并
                    } else {
                        target[prop] = deepMerge(target[prop], source[prop]);//递归
                    }
                }
            }
        } else {
            target[prop] = source[prop];
        }
    }
    return target;
}


// 深度克隆
function deepClone (obj) {
    // 对常见的“非”值，直接返回原来值
    if([null, undefined, NaN, false].includes(obj)) return obj;
    if(typeof obj !== "object" && typeof obj !== 'function') {
        //原始类型直接返回
        return obj;
    }
    var o = isArray(obj) ? [] : {};
    for(let i in obj) {
        if(obj.hasOwnProperty(i)){
            o[i] = typeof obj[i] === "object" ? deepClone(obj[i]) : obj[i];
        }
    }
    return o;
}

function isArray (arr) {
    return Object.prototype.toString.call(arr) === '[object Array]';
}