Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/371.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在另一个对象中复制对象属性?_Javascript - Fatal编程技术网

Javascript 如何在另一个对象中复制对象属性?

Javascript 如何在另一个对象中复制对象属性?,javascript,Javascript,鉴于目标: var firstObject = { key1 : 'value1', key2 : 'value2' }; 如何将属性复制到另一个对象中(secondObject),如下所示: var secondObject = { key1 : 'value1', key2 : 'value2', key3 : 'value3', key4 : 'value4' }; var secondObject = { firstObject

鉴于目标:

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};
如何将属性复制到另一个对象中(
secondObject
),如下所示:

var secondObject = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3',
    key4 : 'value4'
};
var secondObject = {
    firstObject,
    key3 : 'value3',
    key4 : 'value4'
};
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];
    }
}
使用对
第一个对象的引用
?大概是这样的:

var secondObject = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3',
    key4 : 'value4'
};
var secondObject = {
    firstObject,
    key3 : 'value3',
    key4 : 'value4'
};
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];
    }
}
(这不起作用……我把它放在大行中只是为了显示我希望如何构造代码)


如果不使用任何JavaScript框架,解决方案是否可能

循环第一个对象的属性并将其分配给第二个对象,如下所示:

var secondObject = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3',
    key4 : 'value4'
};
var secondObject = {
    firstObject,
    key3 : 'value3',
    key4 : 'value4'
};
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
-
是不够的;您需要
hasOwnProperty
。有关原因的详细解释,请参见。

不幸的是,您不能在这样的对象中放置对变量的引用。但是,可以创建一个函数,将对象的值复制到另一个对象中

for(var k in firstObject) secondObject[k]=firstObject[k];
function extend( obj1, obj2 ) {
    for ( var i in obj2 ) {
        obj1[i] = obj2[i];
    }
    return obj1;
}

var firstObject = {
    key1: "value1",
    key2: "value2"
};

var secondObject = extend({
    key3: "value3",
    key4: "value4"
}, firstObject );
这应该是可行的,经过测试

注意:这不会复制
firstObject

注2:要在较旧的浏览器中使用,您需要一个

注3:通过引用赋值是一个可行的选项,尤其是当
firstObject
包含方法时。相应地调整了给定的JSFIDLE示例

Necro'ing,以便人们可以找到具有hasOwnProperty和实际对象检查的深度复制方法:

var extend = function (original, context, key) {
  for (key in context)
    if (context.hasOwnProperty(key))
      if (Object.prototype.toString.call(context[key]) === '[object Object]')
        original[key] = extend(original[key] || {}, context[key]);
      else
        original[key] = context[key];
  return original;
};

在这里扮演亡灵巫师,因为ES5带来了我们,有可能将我们从所有这些
.hasOwnProperty()
检查中拯救出来

Object.keys(firstObject).forEach(function(key) {
  secondObject[key] = firstObject[key];
});
或者,将其包装成函数(lodash的有限“副本”):

Object.keys()
是一种相对较新的方法,最明显的是:在IE<9中不可用。实际上,数组方法也是如此,我用它代替了常规的
for
循环

幸运的是,这些古老的浏览器可以使用,这将填充许多ES5特性(包括这两个)


(我完全支持polyfills,而不是阻止使用酷的、新的语言功能。)

借鉴@Bardzuśny的回答,ES6提供了一个本机解决方案:函数

用法很简单:

Object.assign(secondObject, firstObject);
就这样

现在的支持显然很差;只有Firefox(34+)支持开箱即用,而Chrome(45+)和Opera(32+)则需要设置“实验标志”


支持正在提高,最新版本的Chrome、Firefox、Opera、Safari和Edge都支持它(IE明显不支持)。Transpiler也可以使用,如Babel和Traceur。有关更多详细信息。

我宁愿使用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}
      });
这当然不是一个班轮,但它给你更多的控制。如果您对属性描述符感兴趣,我建议您阅读本文: 和MDN页

您也可以只分配值,省略描述符,使其略短一些:

var secondObject = Object.create(firstObject, {
      key3: {value: "value3"}
      key4: {value: "value4"}
  });
兼容性:ECMAScript 5,因此IE9+

符合:

您可以简单地使用:

const thirdObject = {
   ...firstObject,
   ...secondObject   
}
这避免了通过引用传递这些对象的问题


此外,它还负责具有深嵌套的对象。

如果您只想获取第二个对象中存在的属性,可以使用
对象。键来获取第一个对象的属性,可以使用两种方法:

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;
}, {});
可以使用来组合对象。它将从右向左组合并覆盖公共属性,即,左侧的相同属性将被右侧覆盖

重要的是,首先提供一个空对象,以避免源对象发生变异。源对象应该保持干净,因为
Object.assign()
本身会返回一个新对象

希望这有帮助

var firstObject={
键1:‘值1’,
键2:“值2”
};
var secondObject={
键3:‘值3’,
键4:“值4”
};
var finalObject=Object.assign({},firstObject,secondObject)
console.log(finalObject)
改进idea和OP idea(浅拷贝)-我只在OP“示例”中添加了3点:

var firstObject={
键1:‘值1’,
键2:“值2”
};
var secondObject={
…第一个目标,
键3:‘值3’,
键4:“值4”
};
console.log(第二个对象)
使用以下方法将复制属性

secondObject.copy(firstObject)

我对javascript非常陌生,但发现它可以工作。我想有点太长了,但它可以工作。

使用属性排列符号。它是在ES2018中添加的(阵列/iterables的价差早于ES2015), {…firstObject}将所有可枚举属性作为离散属性展开

let secondObject = {
      ...firstObject,
      key3 : 'value3',
      key4 : 'value4'
    }

为了记录在案,现在也可以使用

var firstObject={
键1:‘值1’,
键2:“值2”
};
var secondObject={
…第一个目标,
键3:‘值3’,
键4:“值4”
};

这里回答:问题是,你想要浅拷贝还是深拷贝?如果很深,有多深?FWIW,它们被称为“属性”,而不是“属性”。尽管如此,这里还是有一些非常难看的东西(实际上不推荐!只是一行概念证明):
secondObject=JSON.parse('{'+JSON.stringify(firstObject).match(/^....*.$/)[1]+'+JSON.stringify(secondObject).match(/^...$/)[1]+})@T.J.Crowder:我更正了这个问题。。。谢谢。@RobW,我不认为OP在技术意义上使用了
reference
。我想他只是指自然语言“指”。@RobW:OP实际上说了“复制”。这也会复制本地属性。那么那些本身就是对象的属性呢?@BenLee,你在这里缺少的是Igor已经展示了他对它的确切用途,
hasOwnProperty
是无用的。而我