为什么我的简单，纯粹的JavaScript，浅层克隆功能不能像我期望的那样工作？

我需要JavaScript文字对象的克隆函数，它甚至不需要现在递归地克隆。该功能需要是纯粹的JavaScript没有库可以使用。我已经做了一些研究，并作为一些最简化的answers到this问题建议，在这种情况下，我需要的所有内容都是for for循环hasOwnProperty检查。问题是假定复制的对象表现得好像我已经将引用复制到新对象中的原始属性。这不是我的目标。克隆功能的方式是，源对象的任何更改都不会影响目标对象，反之亦然。下面是代码：为什么我的简单，纯粹的JavaScript，浅层克隆功能不能像我期望的那样工作？

... 
function clone(from,to){ 
    for (var key in from){ 
     if(from.hasOwnProperty(key)){ 
      to[key]=from[key]; 
     } 
    } 
    return to; 
} 
... 
var newComponent = clone(component,{}); 
var defaultComponentDrawParams = clone(component.drawParams,{}); 
if(params.type==="button"){ 
    console.info('new component'); 
    component.drawParams.subType="chinga chunga"; 
    console.info(defaultComponentDrawParams.subType); 
    console.info(newComponent.drawParams.subType); 
}

和控制台显示：

new component 
saveFile 
chinga chunga

如果我两个输出后的“新组件”应为“不确定的”，因为我的目标是不断变化的组件时，正确理解.drawParams不能更改newComponent.drawParams。请告诉我我错过了什么。

来源

2014-03-25 DNikolov

我的猜测是你有多个component其中一个是“saveFile”component。问题是你的克隆不克隆对象/数组，它只是创建对它们的引用。因此，当您更新一个component时，所有参照这些相同对象的component也都会更新。

下面是您可能需要添加的检测类型的示例。但是，这可能不是一个绝对完整的答案，可以捕获所有方案。

function clone(from,to){ 
    for (var key in from){ 
     if(from.hasOwnProperty(key)){ 
      var val = from[key]; 

      if(typeof val === 'object') { 
       to[key] = clone(from[key], {}); 
      } else { 
       to[key] = from[key]; 
      } 
     } 
    } 
    return to; 
}

我毫不犹豫地提出这一点，但另一种选择是使用JavaScript库如Underscore.js：http://underscorejs.org/

它的重量极轻（5KB，几乎没有大如jQuery的），有很多这些类型的东西是为你想出来的。

来源

2014-03-25 17:25:48 ArrayKnight

我不想使用外部库，并且就我所知的'if（typeof val ==='object'）'而言，我将它简单地调用函数本身，以防其中一个对象属性是对象本身。换句话说，我没有看到属性复制方式的任何改变，但我会尝试。 – DNikolov

为什么我的简单，纯粹的JavaScript，浅层克隆功能不能像我期望的那样工作？

回答

相关问题