CODEWITHSUNDEEP
javascriptloopsfor-loop
Amy
Amy

Reputation: 43

Javascript Loop through and Concatenate 2 arrays

I am trying to loop through and concatenate 2 arrays such as below, I don’t know how many values there will be as a user could purchase 1 or 100 products so it needs to loop.

Array1 = ['ABC', 'DEF', 'GHI']

Array2 = ['123', '45', '6789',]

I need to output to be:

ABC:123|DEF:45|GHI:6789

Currently code I have...

function() {
  var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
  var array_two = ['179.99', '349.99', '399.99', '389'];
  for (var i = 0; i < array_one.length; i++) {
    for (var j = 0; j < array_two.length; j++) {
      return(array_one[i] + ":" + array_two[j] + "|");
    }
  }
}

This only outputs one value and doesn't loop through, any ideas where my loop is breaking.

Upvotes: 4

Views: 3514

Answers (7)

Ousmane D.
Ousmane D.

Reputation: 56423

This only outputs one value and doesn't loop through, any ideas where my loop is breaking.

what is the cause ?

It's only returning one value because you're using the return keyword within the first iteration hence it will exit within the first iteration.

where does the error occur ?

the code below is where your loop is breaking:

 return(array_one[i] + ":" + array_two[j] + "|");

How to resolve the issue ?

Note : you don't actually need a nested loop in this case because both arrays have the same length so we can simplify it.

in order to improve your current solution we can make a string variable and append the result there such as:

function() {
  var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
  var array_two = ['179.99', '349.99', '399.99', '389'];
  var result = "";
  for (var i = 0; i < array_one.length; i++) {
     result += array_one[i] + ":" + array_two[i] + "|";
  }
  return result;
}

Upvotes: 0

niso
niso

Reputation: 107

Just one 'for loop' is enough for the output you want

     var  returnValue = "";
     for (var i = 0; i < array_one.length; i++)
        {
        returnValue+ =array_one[i] + ":" + array_two[j] + "|";
        }
     return  returnValue;

Upvotes: -1

Suresh Atta
Suresh Atta

Reputation: 121998

Your logic is little wrong, you don't really need two loops. With one loop you can do it and you shouldn't return inside the loop.

Since they are of the same size, below code should do

var result="";
for (var i = 0; i < array_one.length; i++) {     
     result += (array_one[i] + ":" + array_two[i] + "|");    
}
return result;

Upvotes: 1

Rajesh
Rajesh

Reputation: 24915

You can use Array.reduce

var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
var array_two = ['179.99', '349.99', '399.99', '389'];

var result = array_one.reduce(function(p, c, i, a) {
  p += c + ":" + array_two[i]
  if (i < a.length - 1)
    p+="|"
  return p;
}, "")

console.log(result)

With for loop

var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
var array_two = ['179.99', '349.99', '399.99', '389'];

var result = "";
for(var i = 0; i< array_one.length; i++){
  result += array_one[i] + ":" + array_two[i]
  if (i < array_one.length - 1)
    result += "|"
}
console.log(result)

Upvotes: 1

Nenad Vracar
Nenad Vracar

Reputation: 122037

You can use map() to add elements from array_two and then join() to create string.

var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
var array_two = ['179.99', '349.99', '399.99', '389'];

var result = array_one.map(function(e, i) {
  return e + ':' + array_two[i]
}).join('|')

console.log(result)

Upvotes: 1

kind user
kind user

Reputation: 41893

var arr1 = ['ABC', 'DEF', 'GHI'],
    arr2 = ['123', '45', '6789'],
    result = '';
    
    //iterate over every element from arr1 and add it into the 
    //result string with corresponding value from arr2
    arr1.forEach((v,i) => result += v + ':' + arr2[i] + '|'); 
    console.log(result.slice(0, -1)); //cut the `|` sign from the end of the string

Upvotes: 0

dfsq
dfsq

Reputation: 193261

If you know that both arrays have the same length then simple map would be enough:

var array1 = ['ABC', 'DEF', 'GHI']
var array2 = ['123', '45', '6789']

var result = array1.map(function(item, index) {
  return item + ':' + array2[index]
}).join('|')

console.log(result)

Or a ES2015 version:

var result = array1.map((item, index) => `${item}:${array2[index]}`).join('|')

Upvotes: 3

Related Questions