Javascript: Iteration - reduce with deconstruction or forEach

[penx]

I have an object:

    things = {
      table = 'red',
      chair = 'green'
    }

Adhering to Airbnb's JavaScript Style Guide, I want to create a function that duplicates this object, setting all keys of the object to blue.

My 2 options seem to be:

1 Use reduce

    function alwaysBlue(things) {
      return Object.keys(things)
        .reduce((acc, thing) => ({ ...acc, [thing]: 'blue' }), {})
    }

2 Use forEach

    function alwaysBlue(things) {
      const blueThings = {}
      Object.keys(things)
        .forEach(thing => (blueThings[thing] = 'blue'))
      return blueThings
    }

(1) deconstruction on every iteration seems expensive, but if I'm to take no-param-reassign in to account I can't just append to the accumulator on each iteration

However, forEach (2) should be avoided in favour of map() / every() / filter() / find() / findIndex() / reduce() / some(), according to https://github.com/airbnb/javascript#iterators--nope

So which is the preferred approach if I'm to adhere to Airbnb's JavaScript Style Guide - or is there another approach I'm missing?

(also posted at http://stackoverflow.com/questions/44045938/reduce-with-deconstruction-or-foreach-iteration-and-airbnb-javascript-style-gu )

[ljharb]

Since that's invalid syntax, I assume your object is:

   things = {
      table: 'red',
      chair: 'green'
    }

---

Your first example, with the reduce, is correct. "Seems expensive" is something that you shouldn't worry about - performance is the least important thing, only to be concerned about after code is correct, clean, tested, and profiled.

Only if it ends up being necessary (as determined by fully benchmarking your app, not by microbenchmarks like jsperf), then you'd use your forEach approach next, and then if it still was necessary, you'd devolve it to a for loop.