Merging and sorting a two-dimensional array in JavaScript

Question

Merging and sorting a two-dimensional array in JavaScript

Given the following 2D array:

1230 | this is a test
1278 | my new test
1230 | test2
7654 | testing...

I am looking to transform the array so that values in the first column are unique and the second column stores the concatenated text associated with each unique value. The desired output should look like this:

1230 | this is a test -- test2
1278 | my new test
7654 | testing...

To achieve this, I know I need to first sort the array by the first column before merging.

Below is the code snippet for sorting the array by the first column:

var x = exp_arr.sort(function(a,b){ return a[0] > b[0] ? 1 : -1; });
alert(x);

While I have that part figured out, I'm unsure about how to proceed with the merging process. Any suggestions or guidance on this would be greatly appreciated.

javascript arrays

Answer 1

Answer №1

To implement the reduce function, follow these steps:

let array = [[1230, "this is a test"], [1278, "my new test"], [1230, "test2"], [7654, "testing..."]];

let result =
    array.reduce(function(obj, arr) {
              if (!(arr[0] in obj.numbers)) {
                  obj.numbers[arr[0]] = arr
                  obj.results.push(arr);
              } else
                  obj.numbers[arr[0]][1] = (obj.numbers[arr[0]][1]) + " -- " + arr[1];

              return obj
          }, {numbers:{}, results:[]}).results
    .sort(function(a,b) {
        return a[0] - b[0];
    });

Check out the Fiddle here.

Find more information on Reduce in the documentation here.

Answer 2

To implement the reduce function, follow these steps:

let array = [[1230, "this is a test"], [1278, "my new test"], [1230, "test2"], [7654, "testing..."]];

let result =
    array.reduce(function(obj, arr) {
              if (!(arr[0] in obj.numbers)) {
                  obj.numbers[arr[0]] = arr
                  obj.results.push(arr);
              } else
                  obj.numbers[arr[0]][1] = (obj.numbers[arr[0]][1]) + " -- " + arr[1];

              return obj
          }, {numbers:{}, results:[]}).results
    .sort(function(a,b) {
        return a[0] - b[0];
    });

Check out the Fiddle here.

Find more information on Reduce in the documentation here.

Answer 3

Answer №2

To begin, group the elements of an array that share the same first value into objects where the keys are the first element and the values are arrays of the second elements:

grouped = array.reduce(function(result, element) {
    result[element[0]] = (result[element[0]] || []).concat(element[1]);
    return result;
});

Next, convert the object back into an array by combining the members of each key's array with --.

Object.keys(grouped).map(function(key) { return [key, grouped[key].join(' -- '); })

Alternatively, following @friedi's example, we can sort the array first and utilize reduce instead of filter, which is simpler as it eliminates the need for an IIFE to encapsulate a previous item:

array.sort(sortingFunction).reduce(result, item) {
    var previous = result[result.length-1] || [];
    if (previous[0] === item[0]) {
        previous[1] += " -- " + item[1];
    } else {
        result.push(item);
    }
}, []);

Both methods offer greater readability compared to the officially accepted solution.

Answer 4

To begin, group the elements of an array that share the same first value into objects where the keys are the first element and the values are arrays of the second elements:

grouped = array.reduce(function(result, element) {
    result[element[0]] = (result[element[0]] || []).concat(element[1]);
    return result;
});

Next, convert the object back into an array by combining the members of each key's array with --.

Object.keys(grouped).map(function(key) { return [key, grouped[key].join(' -- '); })

Alternatively, following @friedi's example, we can sort the array first and utilize reduce instead of filter, which is simpler as it eliminates the need for an IIFE to encapsulate a previous item:

array.sort(sortingFunction).reduce(result, item) {
    var previous = result[result.length-1] || [];
    if (previous[0] === item[0]) {
        previous[1] += " -- " + item[1];
    } else {
        result.push(item);
    }
}, []);

Both methods offer greater readability compared to the officially accepted solution.

Answer 5

Answer №3

Try implementing this solution:

let sortedArray = originalArray.sort((a, b) => a[0] > b[0] ? 1 : -1)
                            .filter((function() {
                                let prevElement = [null];
                                return function(currentItem) {
                                    if (prevElement[0] === currentItem[0]) {
                                        prevElement[1] += ' -- ' + currentItem[1];
                                        return false;
                                    }
                                    prevElement = currentItem;
                                    return true;
                                };
                            })());

Explanation:
This code utilizes the fact that the array is already sorted. Each element in the array is compared to the previous one using a closure to keep track of the previous element. If the current element has the same id as the previous one, the string gets appended.

For a working example, check out this jsfiddle-demo

Answer 6

Try implementing this solution:

let sortedArray = originalArray.sort((a, b) => a[0] > b[0] ? 1 : -1)
                            .filter((function() {
                                let prevElement = [null];
                                return function(currentItem) {
                                    if (prevElement[0] === currentItem[0]) {
                                        prevElement[1] += ' -- ' + currentItem[1];
                                        return false;
                                    }
                                    prevElement = currentItem;
                                    return true;
                                };
                            })());

Explanation:
This code utilizes the fact that the array is already sorted. Each element in the array is compared to the previous one using a closure to keep track of the previous element. If the current element has the same id as the previous one, the string gets appended.

For a working example, check out this jsfiddle-demo

Merging and sorting a two-dimensional array in JavaScript

Answer №1

Answer №2

Answer №3

Similar questions

What is the best way to apply changes to every class in JavaScript?

How can I determine if any value in one array matches a value in another array using React Native?

Is there a way to hide the borders between cells within these divs?

An Effective Method for Ensuring Array Strictly Ascending through Segment Modifications

Error encountered when attempting to split a 2D array for use in the train_test_split() function: ValueError - the unpacking process expected 2 values but received too

Best Practices for Implementing JSON.stringify() with an AJAX Request

How to make an AJAX request in jQuery / JavaScript after a specific time interval has passed

Modifying an element in a two-dimensional array using C++ class

Select2 - Issue with AJAX causing search results to not display in dropdown

Transclusion with multiple slots in AngularJS

Creating a JSON schema in JavaScript using an already established JSON framework

Issue with Ckeditor inside a bootstrap modal

parallax scrolling can be a bit bumpy

Is there a way to use jQuery to toggle a child element when the parent is clicked?

Compare two arrays for equality in a Vue application

Utilizing JavaScript to Parse RSS XML Feeds Across Domains

No content in webpack result file when using express and react

HTML5 database error: Uncaught TypeError due to illegal invocation

Is it possible for an ajax request to complete even if a page redirection occurs?

Is it possible to alter the video dynamically according to the state in Vuex?