Gab-Pifer
Gab-Pifer

Reputation: 33

Using loop-for through array to push key-values nested inside, into a different array. Javascript

newbie here.

I'm having trouble with a simple challenge, the goal is simple, push the sedan cars into another array, so the output when the function is called (no console.log can be used, it will be ignored) is:

[ { type:'sedan', size: 'white'} , { type:'sedan', color:'red'} ].

The suggestion is to use push().

Here is my terrible code.

Any help is welcome!

function filterCars (cars) {
     const sedanCars = []
     const carArr = [
      { type: 'sedan', color: 'white'},
      { type: 'truck', color: 'blue'},
      { type: 'sedan', color: 'red'},
      { type: 'coupe', color: 'red'}
      ]
   
    var arrayLength = carArr.length;
    for (var i = 0; i < arrayLength; i++) {
    console.log(carArr[i]);
        
  if(carArr.type==="sedan") {
          return sedanCars.push("sedan");
        }

Upvotes: 3

Views: 77

Answers (2)

Brandon McConnell
Brandon McConnell

Reputation: 6119

Your filterCars function and return do not seem all that clear to me in their function, especially since you are triggering your return within a for loop iteration.

There are several ways we can approach this…

Option #1. Building a filter-based function

function getSedans(cars) {
  return cars.filter(car => car.type === 'sedan')
}
const carArr = [
  { type: 'sedan', color: 'white' },
  { type: 'truck', color: 'blue' },
  { type: 'sedan', color: 'red' },
  { type: 'coupe', color: 'red' }
];
const sedanCars = getSedans(carArr);

// including this console.log to provide the output
console.log(sedanCars);

Option #2. filter-based function + push() & spread (...)

If you would prefer to use this solution but also use push, you could do by declaring the empty sedanCars array before the carArr and then push the results of getSedans(carArr) to it like this…

const sedanCars = [],
      carArr = [ /* cars here */ ];
sedanCars.push(...getSedans(carArr));

You can see that in action here:

function getSedans(cars) {
  return cars.filter(car => car.type === 'sedan')
}
const sedanCars = [],
      carArr = [
        { type: 'sedan', color: 'white' },
        { type: 'truck', color: 'blue' },
        { type: 'sedan', color: 'red' },
        { type: 'coupe', color: 'red' }
      ];
sedanCars.push(...getSedans(carArr));

// including this console.log to provide the output
console.log(sedanCars);

Option #3. push() method using for..of loop

However, this adds an extra unnecessary step by using spread. If you really prefer to use push(), here is a more appropriate method for using it:

const sedanCars = [],
      carArr = [
        { type: 'sedan', color: 'white' },
        { type: 'truck', color: 'blue' },
        { type: 'sedan', color: 'red' },
        { type: 'coupe', color: 'red' }
      ];
for (const car of carArr) {
  if (car.type === 'sedan') sedanCars.push(car);
}

// including this console.log to provide the output
console.log(sedanCars);

Option #4. push() method using forEach method

And lastly, if you wanna get fancy, you could replace that entire for..of loop with a forEach invocation and replace the if statement for a short circuit, like this:

carArr.forEach(car => car.type === 'sedan' && sedanCars.push(car));

Here is how that would look in action:

const sedanCars = [],
      carArr = [
        { type: 'sedan', color: 'white' },
        { type: 'truck', color: 'blue' },
        { type: 'sedan', color: 'red' },
        { type: 'coupe', color: 'red' }
      ];
carArr.forEach(car => car.type === 'sedan' && sedanCars.push(car));

// including this console.log to provide the output
console.log(sedanCars);

Upvotes: 1

Phillip
Phillip

Reputation: 6253

Since push is only a suggestion, I would recommend a more modern approach using the array filter method for this:

const cars = [
  { type: 'sedan', color: 'white'},
  { type: 'truck', color: 'blue'},
  { type: 'sedan', color: 'red'},
  { type: 'coupe', color: 'red'},
];

const sedans = cars.filter(car => car.type === 'sedan');

The filter methods takes a callback function that is called on each element of the array. If it returns a truthy value then that item will be included in the resulting array.

Read more about filter on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

Upvotes: 0

Related Questions