javascript - 使用 jQuery.extend 合并现有元素

Question

jQuery.extend()有助于以如下方式合并对象:

var a = {
    'x': 2,
    'y': 3,
    'etc': {
        'm': 3,
        'n': 5
    }
};
var b = {
    'x': 4,
    'z': 1,
    'etc': {
        'm': 2,
        'p': 3
    }
};

$.extend(true, a, b); // true for recursively merge
/* Result:
    a = {
        'x': 4,
        'y': 3,
        'z': 1,
        'etc': {
            'm': 2,
            'n': 5,
            'p': 5
        }
    };
*/

但我感兴趣的只是 a 中已经存在的属性，这意味着，例如，如果 z 不是 a 的属性，它不应该出现在结果中。所以预期的结果应该是:

a = {
    'x': 4,
    'y': 3,
    'etc': {
         'm': 2,
         'n': 5,
     }
};

我想知道是否有一种简单的方法可以使用 jQuery 来实现这一点，或者只能使用像这样的强力方法来实现(在 a 最多有 2 层的情况下):

for (var i in b) {
    if (a.hasOwnProperty(i)) {
        if (typeof a[i] === 'object') {
            for (var j in b[i]) {
                if (a[i].hasOwnProperty(j)) {
                    a[i][j] = b[i][j];
                }
            }
        } else {
            a[i] = b[i];
        }
    }
}

演示:http://jsfiddle.net/hUkAS/3/

Answer 1

我不知道这样的函数，但我编写了一个通用函数，它将合并任意层数的两个对象(哈希)宽度。

//The function
function leftMerge(a, b) {
    for (var i in b) {
        if (a.hasOwnProperty(i)) {
            console.log(typeof a[i]);
            if (typeof a[i] == 'object' && typeof b[i]== 'object')
                leftMerge(a[i], b[i]);
            else
                a[i] = b[i]
        }
    }
}

// a test
var obj_a = {
    'x': 2,
    'y': 3,
    'etc': {
        'm': 3,
        'n': 5,
        'j': {
            'h': 15,
            'i':16
        }
    }
};
var obj_b = {
    'x': 4,
    'z': 1,
    'etc': {
        'm': 2,
        'p': 3,
        'j': {
            'i':2,
            'l':22
        }
    }
};

leftMerge(obj_a, obj_b);
console.log(obj_a);

希望对您有所帮助。