multiply each element in array by 2 using 'for' loop

Question

I'm trying to double each element in an array

let arr =  ['onions', 'tomatoes', 'etc'...';

with a for loop and keep getting NaN error... I'm still learning so any advice would be appreciated.

I've tried for loop, .map(), and other methods, but just can't see the obvious problem...

let newIngr = tortSoup.filter(function(value, index, arr) {
  if (value !== 'onion' && value !== 'red pepper') {
    return value;
    console.log(newIngr);
  });       
}

let myReci = [];

for(var i = 0; i < newIngr.length; i++) {
  myReci[i] = newIngr[i] * 2;
}

console.log(myReci);

Expected: each array element multiped by two and returned:

['onions', tomatoes', 'garlic', 'fontina']

would become:

['onions', 'onions', 'tomoatoes', 'tomatoes', garlic, 'garlic', 'fontina', 'fontina']

string * 2 will not return 2 strings to you. it will return NaN — Code Maniac
– Code Maniac, Commented Feb 10, 2019 at 16:50

jo_va · Accepted Answer · 2019-02-10 17:26:09Z

2

Here is a way to do it with Array.reduce() and the spread operator:

const array = ['onions', 'tomatoes', 'garlic', 'fontina'];

const result = array.reduce((acc, x) => ([...acc, x, x]), []);

console.log(result)

Array.reduce iterates over your input array and calls the callback for each element. This callback is given two arguments, the first is the output from the last iteration, and the second one is the current array item.

The callback here returns a new array composed of the previous result of the callback (spread into the new array with the spread operator ...) and the current item repeated twice.

To start the reducing process, we also need an initial value, here we give an empty array, (last argument to reduce).

Here is a detailed description of the values of acc and x in the callback for the following reduction:

['a', 'b', 'c'].reduce((acc, x) => ([...acc, x, x]), []);

acc = [], x = 'a' => returns ['a', 'a']
acc = ['a', 'a'], x = 'b' => returns ['a', 'a', 'b', 'b']
acc = ['a', 'a', 'b', 'b'], x = 'c' => returns ['a', 'a', 'b', 'b', 'c', 'c']

edited Feb 10, 2019 at 17:26

answered Feb 10, 2019 at 16:55

jo_va

14.1k3 gold badges25 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Code Maniac Over a year ago

As you can see user is new to programming. adding explanation to answer will do wonder to op and future readers to.

jo_va Over a year ago

Thank you, this is a good point, I will add more explanations

Mohammad Usman · Accepted Answer · 2019-02-10 17:00:23Z

1

Iterate over input array using .map().
Initialize new array using Array() constructor and filling it using .fill() method of arrays.
Finally you can convert array of arrays to a single array using .concat() and spread operator.

const input = ['onions', 'tomatoes', 'garlic', 'fontina'];

const dupeValues = (arr, factor) => [].concat(...arr.map(s => new Array(factor).fill(s)));

console.log(dupeValues(input, 2));
console.log(dupeValues(input, 3));

edited Feb 10, 2019 at 17:00

answered Feb 10, 2019 at 16:53

Mohammad Usman

39.6k20 gold badges99 silver badges101 bronze badges

3 Comments

Code Maniac Over a year ago

As you can see user is new to programming. adding explanation to answer will do wonder to op and future readers to.

Michael DeS Over a year ago

Thanks a lot everyone for your help.. I learned a ton from every response and using figured it with the array.reduce() and spread operator... Thanks for your time...

Code Maniac Over a year ago

For keeping it generic +1

Ori Drori · Accepted Answer · 2019-02-10 17:51:25Z

1

Use Array.flatMap() (not supported by IE/Edge):

const array = ['onions', 'tomatoes', 'garlic', 'fontina'];

const result = array.flatMap(item => [item, item]);

console.log(result)

answered Feb 10, 2019 at 17:51

Ori Drori

196k32 gold badges243 silver badges233 bronze badges

Comments

sphinxplayer · Accepted Answer · 2019-02-10 17:08:57Z

0

Using vanilla JavaScript :

const ingredients = [ 'onions', 'tomatoes', 'garlic', 'fontina' ]
const ingredientsToRemove = [ 'onions', 'red pepper' ]

// Using Array.reduce method
const doubleIngredients = ingredients.reduce(
  ( array, ingredient ) =>
  {
    // If the ingredient has to be removed, return the array
    // Else return the array with two times the current ingredient
    return ingredientsToRemove.includes( ingredient ) ?
      array
      :
      [ ...array, ingredient, ingredient ]      
  },
  []
)

console.log({ ingredients, doubleIngredients })

answered Feb 10, 2019 at 17:08

sphinxplayer

3301 silver badge8 bronze badges

Comments

Code Maniac · Accepted Answer · 2019-02-10 17:12:52Z

0

Well the problem here is

string * 2 will not return 2 strings to you. it will return NaN

console.log('test'* 2) //NaN

What you're trying to achieve can be done by repeat method.

console.log('test '.repeat(2))

Your expected output can be achieved like this

let arr = ['onions', 'tomatoes', 'garlic', 'fontina']
let output = arr.reduce((op,inp)=>(op.concat([inp,inp])),[])
console.log(output)

answered Feb 10, 2019 at 17:12

Code Maniac

37.9k5 gold badges44 silver badges65 bronze badges

Collectives™ on Stack Overflow

multiply each element in array by 2 using 'for' loop

5 Answers 5

2 Comments

3 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related