ES6地图迭代成本

Question

I have an array of items: var treeItems = []; . treeItems.length maybe 5-30 (maybe 50), but each treeItem is pretty big object. I should do both: iterate through items & get item by id.

I'm considering to replace array with es6 Map . And to iterate through map use: Array.from(treeItemsMap.values()) operation.

Question: what is the cost (time/memory) of Array.from(map.values()) operation?

PS I'm doing SPA for mobile, so memory usage is also significant.

Answer 1

The spec says:

Map object must be implemented using either hash tables or other mechanisms that, on average, provide access times that are sublinear on the number of elements in the collection.

The specific cost is implementation dependent.

Using Array.from will just copy the data into an array, and that wastes memory uselessly. Better iterate the map instead.

Note 50 items is a very small data. I don't think having huge objects in the map matters. Remember JS is a pass-by-value language, but in case of objects, that value is a reference. So the map will only contain 50 references to objects, which will be stored separately. Iterating or accessing that tiny map shouldn't cost much.

Answer 2

Approach with .map() iterator.

We can use a simple trick for Maps, because there is no such operation for Maps as map(). Suggested by Dr. Axel Rauschmayer : * Convert the map into an array of [key,value] pairs. * Map or filter the array. * Convert the result back to a map.

Example:

let map0 = new Map([
  ["a", 1],
  ["b", 2],
  ["c", 3]
]);

const map1 = new Map(
  [...map0]
  .map(([k, v]) => ['_' + k, v * 2])
);

resulted in

{'_a' => 2, '_b' => 4, '_c' => 6}

Answer 3

Approach with for(){...} oprator.

We can iterate ES6 Map like this:

let map0 = new Map([
  ["a", 1],
  ["b", 2],
  ["c", 3]
]);

let map1 = new Map();
for (let [key, value] of map0) {
    map1.set('_' + k, v * 2);    
}

resulted in

{'_a' => 2, '_b' => 4, '_c' => 6}