爲什麼我的簡單，純粹的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，淺層克隆功能不能像我期望的那樣工作？

回答

相關問題