使用下划线 _.extend 来避免覆盖嵌套对象？

Question

var obj = {
  customerInfo: {
    fname: "Tom",
    lname: "Smith",
    age: 23,
    height: 160
  },
  car: {
    color: "red",
    numWheels: 4
  }
};

我想修改这个对象为：

var obj = {
  customerInfo: {
    fname: "Sally",
    lname: "Adams",
    mname: "Tully",
    age: 23,
    height: 160
  },
  car: {
    color: "red",
    numWheels: 4
  }
};

但是，如果我这样做

_.extend(obj, {
  customerInfo: {
    fname: "Sally", 
    lname: "Adams",
    mname: "Tully"
  }
});

对象变成

{
  customerInfo: {
    fname: "Sally",
    lname: "Adams",
    mname: "Tully"
  },
  car: {
    color: "red",
    numWheels: 4
  }
};

和年龄和身高都被消灭了。

我需要做什么来保留嵌套的数据？

那么更新更复杂的对象呢？

http://jsfiddle.net/j4L18p7k/2/#share

Answer 1

直接扩展customerInfo。下划线 .extend() 替换您提到的任何键，在这种情况下，删除不在您的新对象中的任何先前的嵌套键。

_.extend(obj.customerInfo, {
  fname: "Sally", 
  lname: "Adams",
  mname: "Tully"
});

Answer 2

有更好的方法可以实现您实际正在寻找的这种深度合并行为...

您可以使用 Jquery 的 $.extend API，如下所述：http://api.jquery.com/jquery.extend/

我将这个小示例放在一起以匹配您的代码示例，因为我相信您真正需要的是这种通用的合并方法，对吧？

var o = {
  customerInfo: {
    fname: "Tom",
    lname: "Smith",
    age: 23,
    height: 160,
    paymentMethods: {
      paypal: {
        username: "sally"
      }
    }
  },
  car: {
    color: "red",
    numWheels: 4
  }
};

// this wipes out more deeply nested things (paypal disappears)
var merge = $.extend(true, {} , o.customerInfo, {
    "fname": "Sally",
    lname: "Adams",
    mname: "Tully",
    paymentMethods: {
      visa: {
        lastFour: "5555"
      }
    }
});

console.dir(merge);

http://jsfiddle.net/hrqbyd5c/9/

但是请注意 JQuery 文档

On a deep extend, Object and Array are extended, but object wrappers on primitive types such as String, Boolean, and Number are not. Deep-extending a cyclical data structure will result in an error.

For needs that fall outside of this behavior, write a custom extend method instead, or use a library like lodash.

查看 lodash 的合并 API 文档 https://lodash.com/docs#merge

希望这对您有所帮助...

使用下划线 _.extend 来避免覆盖嵌套对象？

Using underscore _.extend to avoid overwriting nested objects?

javascript

underscore.js