How to solve array question without hardcoding?

Question

how do you produce these objects ?

let obs = [
    { car: cars[0], color: colors[0] },
    { car: cars[1], color: colors[1] },
    { car: cars[2], color: colors[2] }
]

from these arrays without hard coding

let cars = ["audi", "audi", "audi"]
let colors = ["darkgrey", "red", "silver"]

Possible duplicate of [How do I zip two arrays in JavaScript?](https://stackoverflow.com/questions/22015684/how-do-i-zip-two-arrays-in-javascript) — Joe Clay, Nov 09 '18 at 16:56
I just need to clarify something, will cars and colors be the same length at all times? — Electrox Mortem, Nov 09 '18 at 16:56
One-off code may not be an issue for a one-off problem, but writing generic code is usually better since reusability is always a factor of managing complexity. — Rafael, Nov 09 '18 at 18:06

score 4 · Accepted Answer · answered Nov 09 '18 at 16:58

4

Use Array.map() to produce an array of objects:

const cars = ["audi", "audi", "audi"]
const colors = ["darkgrey", "red", "silver"]

const result = cars.map((car, i) => ({
  car,
  color: colors[i]
}));

console.log(result);

answered Nov 09 '18 at 16:58

Ori Drori

183,571
29
224
209

slider · Answer 2 · 2018-11-09T16:58:32.270

1

You can use a forEach loop with an index and push new objects by choosing corresponding elements from each array:

let cars = ["audi", "audi", "audi"];
let colors = ["darkgrey", "red", "silver"];

let result = [];
cars.forEach((car, i) => {
  result.push({car, color: colors[i]});
});

console.log(result);

edited Nov 09 '18 at 16:58

answered Nov 09 '18 at 16:56

slider

12,810
1
26
42

1

`Array.prototype.map` would also work well here - that way you don't have to manually define the array/push items :) – Joe Clay Nov 09 '18 at 16:57

score 1 · Answer 3 · answered Nov 09 '18 at 16:58

There are numerous way of doing it. Personally I will prefer using a array map function, which will create a new array .

You can apply map method on any of the array and use it's index to retrieve value from another array

let cars = ["audi", "audi", "audi"]
let colors = ["darkgrey", "red", "silver"];

let result = cars.map((item, index) => {
  return {
    car: item,
    color: colors[index]
  }
});

console.log(result)

You can also use conventional for loop , array forEach & array reduce also

score 1 · Answer 4 · answered Nov 09 '18 at 17:09

Spent five more minutes, this worked too thanks Guys :)

let cars = ["audi", "audiXL", "audiRover"]
let colors = ["silver", "darkgrey", "white"]

function matchCars () {   

    let matches = []

    for(let i = 0; i < cars.length; i++) {  
        let object = {car: cars[i], color: colors[i]}
        matches.push(object)
    }
    return matches

}

const answer = matchCars()
console.log(answer);

score 0 · Answer 5 · answered Nov 09 '18 at 17:57

This question is really: How do I convert a structure of arrays to an array of structures?

A simple, general, solution looks like:

let aos = soa2aos(
  [ 'car',  ['Civic', 'Integra'] ],
  [ 'year', [1994, 2001] ],
  [ 'color', ['grey', 'orange'] ]
);

console.log(aos);

function soa2aos(...soa) {
  return soa[0].reduce((aos, arr, i) => {
    let o = aos[i] = {};
    soa.forEach(([name, dat]) => o[name] = dat[i]);
    return aos;
  }, []);
}

How to solve array question without hardcoding?

5 Answers5