JS对象阵列vs JS对象阵列效率和性能

Question

这个问题关于javascript语言。 简单地认为我们有一个地图，我们插入项目如下方式

var dataMap=new Map(); 

//First Mechanism 
//firstly we can think of structure of values of map can be JSONArray of objects 
dataMap.set("key1",[{'id':12,'name':"obj1"}]); // init 
// and,then insert new element to JSON Array which holds by map using 'key1' 
dataMap.get("key1").push({'id':23,'name':"obj47"});//updated, now value of 'key1' is an JSON array which holds two elements 
// expect 'key1' -> [{'id':12,'name':"obj1"},{'id':23,'name':"obj47"}]   

//Second mechanism 
// next we cant think of structure of values of map as JSONObject of Arrays 
dataMap.set("key1",{'id':[12],'name':["obj1"]}); // init 
// then we proceed with update operations like this 
dataMap.get("key1").id.push(23); 
dataMap.get("key1").name.push("obj47"); // two operations to insert items to respective arrays. 
// expect 'key1' ->{'id':[12,23],'name':["obj1","obj47"]} 

哪种方法最有效？

认为我们有相当数量的插入操作到地图，如果我们在表现哪一个更好？

（如果我犯了错请纠正，我想尽可能简化问题，因为我可以这样做） 谢谢。

Answer 1

只是为了好奇，我继续使用console.time()来衡量结果。

启动一个定时器，您可以使用该定时器来跟踪操作需要多长时间。您为每个计时器指定一个唯一的名称，并且可能有多达10,000个定时器 在给定页面上运行。当您使用相同的 名称调用console.timeEnd（）时，浏览器将输出自定时器启动以来耗时 的时间（以毫秒为单位）。

现在你可以争论如何可靠的结果考虑有涉及，如浏览器缓存等

这些其他因素的结果*为我的机器上百万操作。

Chrome Version 61.0.3163.91 (Official Build) (64-bit) 

// 1st run 
default: 2217.048095703125ms 
default: 3032.159912109375ms 
// 2nd run 
default: 1948.16796875ms 
default: 3320.7431640625ms 
// 3rd run 
default: 2177.461181640625ms 
default: 2989.448974609375ms 


Firefox 55.0.3 (32-bit) 

// 1st run 
default: 2146.64ms 
default: 2390.11ms 
// 2nd run 
default: 1863.7ms 
default: 2264.02ms 
// 3rd run 
default: 1751.7ms 
default: 2283.6ms 

您可以看到差异不是那么大，不应该是影响您决定的因素。正如@Nina Scholz非常正确地提到的那样，选择使您的生活更轻松的数据结构。

[*]代码在基准作为参考：

let dataMap = new Map(); 
const diff = 1000000; 
let key = null; 

console.time(); 
for(let i = 0; i < 1000000; i++){ 
    key = `key${i}`; 
    dataMap.set(key, [{'id': i, 'name': `obj${i}`}]); 
    dataMap.get(key).push({'id': i + diff, 'name': `obj${i + diff}`}) 
} 
console.timeEnd(); 

dataMap = new Map(); 

console.time(); 
for(let i = 0; i < 1000000; i++){ 
    key = `key${i}`; 
    dataMap.set(key, {'id':[i], 'name': [`obj${i}`]}); 
    dataMap.get(key).id.push(i + diff); 
    dataMap.get(key).name.push(`obj${i + diff}`); 
} 
console.timeEnd(); 

或者尝试online。