给定对象:
var firstObject = {
key1 : 'value1',
key2 : 'value2'
};
我如何复制属性在另一个对象(secondObject)像这样:
var secondObject = {
key1 : 'value1',
key2 : 'value2',
key3 : 'value3',
key4 : 'value4'
};
使用对firstObject的引用?就像这样:
var secondObject = {
firstObject,
key3 : 'value3',
key4 : 'value4'
};
(这行不通……我把它放在大行中只是为了显示我想如何组织代码)。
不使用任何JavaScript框架的解决方案是否可行?
遍历第一个对象的属性并将它们赋值给第二个对象,如下所示:
var firstObject = {
key1 : 'value1',
key2 : 'value2'
};
var secondObject = {
key3 : 'value3',
key4 : 'value4'
};
for (var prop in firstObject) {
if (firstObject.hasOwnProperty(prop)) {
secondObject[prop] = firstObject[prop];
}
}
for-in循环是不够的;你需要hasOwnProperty。有关原因的详细解释,请参阅http://bonsaiden.github.com/JavaScript-Garden/#object.forinloop。
在这里玩死灵法师,因为ES5带来了Object.keys(),有可能将我们从所有这些. hasownproperty()检查中拯救出来。
Object.keys(firstObject).forEach(function(key) {
secondObject[key] = firstObject[key];
});
或者,将它包装成一个函数(lodash _.assign()的有限“拷贝”):
function assign(object, source) {
Object.keys(source).forEach(function(key) {
object[key] = source[key];
});
}
assign(secondObject, firstObject); // assign firstObject properties to secondObject
Object.keys()是一个相对较新的方法,最值得注意的是:在IE < 9中不可用。同样的情况也适用于. foreach()数组方法,我用它来代替常规的for循环。
幸运的是,这些古老的浏览器有ES5 -shim可用,它将填充许多ES5特性(包括这两个)。
(我完全支持填充程序,而不是拒绝使用很酷的新语言特性。)
我宁愿使用firstObject作为secondObject的原型,并添加属性描述符:
var secondObject = Object.create(firstObject, {
key3: {value: "value3", writable: true, configurable: true, enumerable: true},
key4: {value: "value4", writable: true, configurable: true, enumerable: true}
});
它当然不是一行程序,但它给了您更多的控制。如果您对属性描述符感兴趣,我建议阅读这篇文章:http://patrickdelancy.com/2012/09/property-descriptors-in-javascript/#comment-2062
和MDN页面https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create
你也可以只分配值,省略描述符,让它更短:
var secondObject = Object.create(firstObject, {
key3: {value: "value3"}
key4: {value: "value4"}
});
兼容性:ECMAScript 5,即IE9+
如果您只想获取第二个对象中存在的属性,则可以使用object。键要获取第一个对象的属性,可以做两个方法:
A.) map使用副作用将第一个对象的属性分配给第二个对象:
var a = {a:100, b:9000, c:300};
var b = {b:-1};
Object.keys(a).map(function(key, index) {
if (typeof b[key] !== 'undefined') {
console.log(key);
b[key] = a[key];
}
});
B.)或reduce来创建一个新对象并将其分配给第二个对象。注意,这个方法替换了第二个对象之前不匹配第一个对象的其他属性:
var a = {a:100, b:9000, c:300};
var b = {b:-1, d:-1}; // d will be gone
b = Object.keys(a).reduce(function(result, current) {
if (typeof b[current] !== 'undefined') {
result[current] = a[current];
}
return result;
}, {});
对象。赋值或析构可能会给您带来很大的麻烦,因为只有顶级属性被复制为值。
所有嵌套的属性都将被复制为引用,并保留对原始对象属性的引用。如果你的物体是平的,那是可以的。但如果不是,这些方法很少适用。
对于最简单有效的一行程序,我会推荐deepmerge包,它没有这个缺点。
const newObject = deepmerge({}, oldObjectWithNestedProperties);
这将给你oldObjectWithNestedProperties的完全分离和独立的newObject副本。