javascript - 如何复制对象数组的数组并能够操作复制的数组而不影响原始数组

Question

这是我的数据集:

dfg= [[{"key":"Product_Description","value":"$49.95 Plan"},{"key":">20MB/30","value":44555},{"key":">200MB/30","value":36599},{"key":">2048MB/30","value":16173},{"key":">5120MB/30","value":6380},{"key":">10240MB/30","value":2178}],[{"key":"Product_Description","value":"$39.95 Plan"},{"key":">20MB/30","value":54832},{"key":">200MB/30","value":42988},{"key":">2048MB/30","value":14826},{"key":">5120MB/30","value":4742},{"key":">10240MB/30","value":1567}]]

我想通过这个函数传递它，以便我将上面的值更改为“产品描述”总值的百分比

//funtion to format data for percent values 
function format_data_to_percent(d){

var data = d
data.map(function(a){ 
    var sum = a.slice(1).map(function(a){ return a.value; }).reduce(function(a,b){return a*1+b*1},0); 
    //console.log("sum",sum); 

    a.slice(1).filter(function(a){
        //console.log(a)
        a.value=a.value/sum
        //console.log(a)
    }); 

    return a;
})


//START TEST 
// create a test case for it // make this better
vals=data_p[0].slice(1).map(function(a){ return a.value; })
//["11", "33", "10", "55", "10"]
sum = data_p[0].slice(1).map(function(a){ return a.value; }).reduce(function(a, b){return a*1+b*1},0);
//119
vals2=vals.map(function(a){ return a/sum})
//[0.09243697478991597, 0.2773109243697479, 0.08403361344537816, 0.46218487394957986, 0.08403361344537816]


console.log("test1--> ",data[0][1].value == vals2[0])
console.log("test2--> ",data[0][2].value == vals2[1])
console.log("test3--> ",data[0][3].value == vals2[2])
console.log("test4--> ",data[0][4].value == vals2[3])
console.log("test5--> ",data[0][5].value == vals2[4])
//END TEST 

    return data
}

dfg2=format_data_to_percent(dfg) //format my dataset 

这就是我得到的，这就是我想要的

[[{"key":"Product_Description","value":"$49.95 Plan"},{"key":">20MB/30","value":0.42078670255465833},{"key":">200MB/30","value":0.345648581007697},{"key":">2048MB/30","value":0.15274118147046323},{"key":">5120MB/30","value":0.06025404920432545},{"key":">10240MB/30","value":0.02056948576285593}],[{"key":"Product_Description","value":"$39.95 Plan"},{"key":">20MB/30","value":0.4609474170904964},{"key":">200MB/30","value":0.3613803539153461},{"key":">2048MB/30","value":0.12463536631499307},{"key":">5120MB/30","value":0.03986381404732882},{"key":">10240MB/30","value":0.013173048631835568}]]

但 dfg 也等于 df2，我希望 dfg 保持数字不变，而 dfg2 保持百分比不变。

我正在做的不是最佳实践。我明白了，虽然不像我希望的那样完整，但数组中的对象都是相同的引用。 但有没有一种方法可以用数字值实现 dfg，用百分比值实现 dfg2？

我遇到了 this ，这通过切片原始数组来复制数组。我试过这个，但它在我的情况下不起作用，也许在那个例子中没有对象，而我的数组中有对象。

编辑1可能重复 here 但这是更多的 java。 This 可能就是我想要的

when you assign an array directly, it is a reference assignment in javascript. This means that any changes will be reflected in both. To copy an array, you will need to call array.slice().

note: this will still be an assignment on a multi-dimensional array, so you will need to write something recursive to copy an array that has more than one dimension (at any element, e.g. [1, 2, ['some', 'inner', 'array'], 3])

---

编辑2

请回答以下问题:仅供引用，这是我浏览器的完整日志

dfg
[[Object { key="Product_Description",  value="$100.83 Business Select Plan excl GST"}, Object { key=">20MB/30",  value=1480}, Object { key=">200MB/30",  value=1234}, 3 more...], [Object { key="Product_Description",  value="$119.95 Business Share Everything Plan"}, Object { key=">20MB/30",  value=66}, Object { key=">200MB/30",  value=57}, 3 more...]]
var arr2 = []
undefined
arr2.push(JSON.parse(JSON.stringify(dfg[0])))
1
arr2.push(JSON.parse(JSON.stringify(dfg[1])))
2
arr2
[[Object { key="Product_Description",  value="$100.83 Business Select Plan excl GST"}, Object { key=">20MB/30",  value=1480}, Object { key=">200MB/30",  value=1234}, 3 more...], [Object { key="Product_Description",  value="$119.95 Business Share Everything Plan"}, Object { key=">20MB/30",  value=66}, Object { key=">200MB/30",  value=57}, 3 more...]]
//funtion to format data for percent values  func...alue == vals2[4])   //END TEST              return data }
undefined
var arr3 = format_data_to_percent(arr2)
test1--> true
test2--> true
test3--> true
test4--> true
test5--> true
undefined
arr3
[[Object { key="Product_Description",  value="$100.83 Business Select Plan excl GST"}, Object { key=">20MB/30",  value=0.37336024217961655}, Object { key=">200MB/30",  value=0.3113017154389506}, 3 more...], [Object { key="Product_Description",  value="$119.95 Business Share Everything Plan"}, Object { key=">20MB/30",  value=0.3815028901734104}, Object { key=">200MB/30",  value=0.32947976878612717}, 3 more...]]
dfg
[[Object { key="Product_Description",  value="$100.83 Business Select Plan excl GST"}, Object { key=">20MB/30",  value=1480}, Object { key=">200MB/30",  value=1234}, 3 more...], [Object { key="Product_Description",  value="$119.95 Business Share Everything Plan"}, Object { key=">20MB/30",  value=66}, Object { key=">200MB/30",  value=57}, 3 more...]]

Answer 1

克隆数组？这样您将拥有原始数组的副本，它不是对原始数组的引用数组。

如果你使用 jquery 那么你可以使用 .extend

var array_1 = [{},{},{}];

var array_2 = $.extend({}, true, array_1); // deep clone 

或者您可以使用一些新的 JavaScript。虽然这只执行一个浅拷贝，所以可能不适合你的用例，但我在移动应用程序上，所以不能玩你的代码..

var array_2 = Object.assign({}, array_1);