ES6 将可迭代转换为数组时间复杂度

Question

Im wondering whats the time complexity of turning iterables for example MapIterator into an array. lets say I have this code:

    const Component = ({ map }) => {
           return (
        <Fragment>
            {Array.from(map.values()).map(item => <div key={item.key}>{item.name}</div>)}
       </Fragment>
     )
}

what is the time complexity for each Array.from(), is it what Im thinking O(n) or is it because its an MapIterator somehow converted from arraylike to array quicker.

My use case is that I want to save items (which need to be accessed) as a map for performance issues, but I have to run through them as an array.

for this questions purpose I can save in state or use selectors or stuff like that

what do you guys think?

Answer 1

You are correct that Array.from() is O(n). If you're concerned about performance, the easiest thing you can do to improve is to not iterate the values twice . Array.from() already accepts a map function as a second optional argument:

Array.from(map.values(), ({ key, name }) => <div key={key}>{name}</div>)