Discussion on: React lists without .map

View post

I love abstractions, but only when it reduces boilerplate and effort to create. The amount of code generated in order to abstract away map makes the effort not that valuable. I do say it's a good learning exercise, but I wouldn't do this in all projects since you introduce more components into the reconciler, and you're needing to spread a bunch of props in order to get the desired result, which means more overhead.

Mike Talbot ⭐ • Aug 5 '21

Maybe I'm missing something, but isn't the effect only adding one parent component? All the others would need to be added anyway and have their own props object returned by the createElement(). I've just moved the props setting (and admittedly probably created one more object along the way).

If you wanted to be pure and just make the one props object that every entry in the map needs you could write the output like this:

function Repeat({
    list,
    children,
    item = children.type ? children : <Simple />,
    pass = "item",
    keyFn = getKey
}) {
    return list.map((iterated, index) => {
        return {type: item.type, key: keyFn(iterated), props: {...item.props, [pass]: iterated, index}
    })
}