Group the elements of the second array based on the repeated values of the first array and combine them into a single string

Question

Group the elements of the second array based on the repeated values of the first array and combine them into a single string

I have a challenge with two arrays and a string shown below

var str=offer?;

var names = [channelId, channelId, offerType, offerType, Language];

var values =[647, 763, international, programming, English];

Both arrays are the same size.

I want to create a formatted string like this

final string = offer?channelId=647,763&offerType=international,programming&language=English

This task needs to be achieved using JavaScript.

I attempted it this way:

   var namesMatched=false;
   for(var i=0; i<names.lengthl; i++){
      for(var j=i+1; j<names.length; j++){
       if(names[i]==names[j]){
         str=str+names[i]+"="+values[i]+","+values[j];
         namesMatched=true;
         continue;
       }
       else if(namesMatched){
          str=str+"&";
          i=names.length-j;
       }
       else{
         str=str+names[i]+"="+values[i]+"&";
         break;
       }
      }
    }

However, it is not producing the expected outcome.

Your assistance here would be greatly appreciated.

javascript arrays string

Answer 1

Answer №1

Below is a more concise solution that avoids using two separate for loops:

let sentence='offer?';
        
        let labels = ['channelId', 'channelId', 'offerType', 'offerType', 'Language'];

    let dataValues =[647, 763, 'international', 'programming', 'English'];

let previousLabel = '';

for (let i=0; i<labels.length; i++) {
  let currentLabel = labels[i];
  if (previousLabel === currentLabel) {
    sentence+=','+dataValues[i];
  } else {
      if (i !== 0) {
        sentence+='&';
      }
    sentence+=currentLabel+'='+dataValues[i];
  }
  previousLabel = currentLabel;

}

console.log(sentence);

http://jsbin.com/kinefipalu/edit?html,js,output

Answer 2

Below is a more concise solution that avoids using two separate for loops:

let sentence='offer?';
        
        let labels = ['channelId', 'channelId', 'offerType', 'offerType', 'Language'];

    let dataValues =[647, 763, 'international', 'programming', 'English'];

let previousLabel = '';

for (let i=0; i<labels.length; i++) {
  let currentLabel = labels[i];
  if (previousLabel === currentLabel) {
    sentence+=','+dataValues[i];
  } else {
      if (i !== 0) {
        sentence+='&';
      }
    sentence+=currentLabel+'='+dataValues[i];
  }
  previousLabel = currentLabel;

}

console.log(sentence);

http://jsbin.com/kinefipalu/edit?html,js,output

Answer 3

Answer №2

You have the option to utilize explanatory comments within your code.

var str='offer?';
var names = ['channelId', 'channelId', 'offerType', 'offerType', 'Language'];
var values = [647, 763, 'international', 'programming', 'English'];

var temp = names.reduce(function (a, b, i) {
    // Create an array object for each name if it does not already exist
    a[names[i]] = (a[names[i]] || [])
    // Add the value to the array
    a[names[i]].push(values[i])
    return a;
}, {})

// Iterate through the properties of the temporary object (a collection of value arrays tagged by name)
var output = str + Object.keys(temp).map(function (e) {
    // Build the substring for each key
    return e + '=' + temp[e].join(',');
// Join the substrings using &
}).join('&')

console.log(output)

Steps

The initial step involves utilizing reduce to consolidate the two arrays into a single object (temp). Each unique name becomes a property on the object with corresponding array values.
Next, apply Object.keys() to retrieve all keys (names) from the temporary object.
Using map, convert the names and their associated value arrays into substrings.
Lastly, employ join to merge these substrings together.

var str='offer?';
var names = ['channelId', 'channelId', 'offerType', 'offerType', 'Language'];
var values = [647, 763, 'international', 'programming', 'English'];

var temp = names.reduce(function (a, b, i) {
  // Create an array object for each name if it doesn't already exist
  a[names[i]] = (a[names[i]] || [])
  // Push the value onto the array
  a[names[i]].push(values[i])
  return a;
}, {})

// Loop through the properties of the temporary object (a collection of value arrays tagged by name)
var output = str + Object.keys(temp).map(function (e) {
  // Construct the substring for each key
  return e + '=' + temp[e].join(',');
  // Join the substrings using &
}).join('&')

alert(output)

Answer 4

You have the option to utilize explanatory comments within your code.

var str='offer?';
var names = ['channelId', 'channelId', 'offerType', 'offerType', 'Language'];
var values = [647, 763, 'international', 'programming', 'English'];

var temp = names.reduce(function (a, b, i) {
    // Create an array object for each name if it does not already exist
    a[names[i]] = (a[names[i]] || [])
    // Add the value to the array
    a[names[i]].push(values[i])
    return a;
}, {})

// Iterate through the properties of the temporary object (a collection of value arrays tagged by name)
var output = str + Object.keys(temp).map(function (e) {
    // Build the substring for each key
    return e + '=' + temp[e].join(',');
// Join the substrings using &
}).join('&')

console.log(output)

Steps

The initial step involves utilizing reduce to consolidate the two arrays into a single object (temp). Each unique name becomes a property on the object with corresponding array values.
Next, apply Object.keys() to retrieve all keys (names) from the temporary object.
Using map, convert the names and their associated value arrays into substrings.
Lastly, employ join to merge these substrings together.

var str='offer?';
var names = ['channelId', 'channelId', 'offerType', 'offerType', 'Language'];
var values = [647, 763, 'international', 'programming', 'English'];

var temp = names.reduce(function (a, b, i) {
  // Create an array object for each name if it doesn't already exist
  a[names[i]] = (a[names[i]] || [])
  // Push the value onto the array
  a[names[i]].push(values[i])
  return a;
}, {})

// Loop through the properties of the temporary object (a collection of value arrays tagged by name)
var output = str + Object.keys(temp).map(function (e) {
  // Construct the substring for each key
  return e + '=' + temp[e].join(',');
  // Join the substrings using &
}).join('&')

alert(output)

Answer 5

Answer №3

If you're comfortable utilizing Underscore, there's a way to group the values simply by using

groups = _.groupBy(values, function(val, i) { return names[i]; });

In essence, this method organizes the values according to the corresponding name from the names array. This results in

{ channelId: [647, 763], ... }

You can convert this into your desired string format with ease using

_.map(groups, function(val, key) { return key + '=' + val; }) . join('&');

It's worth noting that in the line above, the val, being an array, will automatically combine its elements with a comma when coerced into a string.

Alternatively, depending on your coding style preference:

function name(val, i)  { return names[i]; }
function key(val, key) { return key + '=' + val; }

_.map(_.groupBy(values, name), key) . join('&')

or through chaining:

_.chain(values) . groupBy(name) . map(key) . join('&') . value()

Answer 6

If you're comfortable utilizing Underscore, there's a way to group the values simply by using

groups = _.groupBy(values, function(val, i) { return names[i]; });

In essence, this method organizes the values according to the corresponding name from the names array. This results in

{ channelId: [647, 763], ... }

You can convert this into your desired string format with ease using

_.map(groups, function(val, key) { return key + '=' + val; }) . join('&');

It's worth noting that in the line above, the val, being an array, will automatically combine its elements with a comma when coerced into a string.

Alternatively, depending on your coding style preference:

function name(val, i)  { return names[i]; }
function key(val, key) { return key + '=' + val; }

_.map(_.groupBy(values, name), key) . join('&')

or through chaining:

_.chain(values) . groupBy(name) . map(key) . join('&') . value()

Group the elements of the second array based on the repeated values of the first array and combine them into a single string

Answer №1

Answer №2

Answer №3

Similar questions

Strange Node.js Issue

Obtaining the value of a checkbox with React

How can I define an HTML array in PHP when it shows an "Undefined Index" error?

What is the reason for the vertex shader failing to compile?

Pause animation when hovering over their current positions

"An easy way to dynamically update a select dropdown based on the data of the corresponding row in a table using jQuery

How can I iterate through each element of MySelector in the callback function of jquery-ui's draggable function?

Tips for enhancing the clarity of elements in KineticJS

Why is my Javascript XMLHttpRequest onreadystatechanged event not triggering?

Retrieving server information using AJAX in React

Add the bannercode snippet found on a webpage

The rendering of HTML DOM is being obstructed on iPhone devices running iOS 13

What is the best way to display an alert when the button is clicked repeatedly?

JavaScript click or text-to-speech

Clicked button redirects user to the parent URL

Obtain the dynamic identifier of an element within every block using jQuery in a rails application

Show 1 Blog Post on a Separate AngularJS Page

The periodLookup array does not have a defined value for periodStr. Why is this error being caught?

Dropdown selection for countries that dynamically updates region choices

Is there a way to resolve the MongoDB Database-Differ Error?