JavaScript - Add up and combine an unspecified number of arrays in one concise statement

Question

JavaScript - Add up and combine an unspecified number of arrays in one concise statement

Have you ever come across the answer to the question about the Javascript version of Python's zip function? It demonstrates a clever method for merging any number of arrays into a single array through a concise statement.

zip= rows=>rows[0].map((_,c)=>rows.map(row=>row[c]))

In another interesting discussion, this question focuses on summing two arrays in a single iteration using a similar concept to zipping.

If we were to combine these approaches and handle an unknown number of arrays like:

[
  [1,2,3],
  [1,2,3],
  [1,2,3]
]

The desired outcome should be [3, 6, 9], which represents the summed values of corresponding elements from all input arrays. Let's assume each array has equal lengths for simplicity.

javascript arrays

Answer 1

Answer №1

Just like many other responses, the solution can actually be simplified:

nums = [[1,2,3],[1,2,3],[1,2,3]];

var finalResult = nums[0].map(function(_, index) { 
  return nums.reduce(function(previous, currentRow) {
    return currentRow[index] + previous;
  }, 0);
});

console.log(finalResult);

Answer 2

Just like many other responses, the solution can actually be simplified:

nums = [[1,2,3],[1,2,3],[1,2,3]];

var finalResult = nums[0].map(function(_, index) { 
  return nums.reduce(function(previous, currentRow) {
    return currentRow[index] + previous;
  }, 0);
});

console.log(finalResult);

Answer 3

Answer №2

After some consideration, I believe I have found a solution. This resource provided me with the necessary insight - by enhancing the original zipping method in the following manner:

zip = rows => rows[0].map((_,c) => rows.map(row=>row[c]).reduce((a,b) => a+b,0))

Answer 4

After some consideration, I believe I have found a solution. This resource provided me with the necessary insight - by enhancing the original zipping method in the following manner:

zip = rows => rows[0].map((_,c) => rows.map(row=>row[c]).reduce((a,b) => a+b,0))

Answer 5

Answer №3

Start by transposing the arrays, swapping columns for rows and vice versa. Then, all you need to do is utilize the reduce function.

The initial code snippet is written in TypeScript for conciseness, while the second version switches over to JavaScript.

Remember that ES5's map and reduce functions are compatible only with IE9 and above.

var numbers = [[1,2,3],[1,2,3],[1,2,3]]

// TypeScript

var colSums = numbers[0].map(function(col, i) { 
  return numbers.map((row) => row[i]).reduce((a,b) => a + b );
});

// JavaScript

/*var colSums = numbers[0].map(function(col, i) {
  return numbers.map(function(row) {
    return row[i];
  }).reduce(function(a,b) {
    return a + b;
  });
});*/
document.getElementById("col-sums").innerHTML = colSums;

<p id="col-sums"></p>

Answer 6

Start by transposing the arrays, swapping columns for rows and vice versa. Then, all you need to do is utilize the reduce function.

The initial code snippet is written in TypeScript for conciseness, while the second version switches over to JavaScript.

Remember that ES5's map and reduce functions are compatible only with IE9 and above.

var numbers = [[1,2,3],[1,2,3],[1,2,3]]

// TypeScript

var colSums = numbers[0].map(function(col, i) { 
  return numbers.map((row) => row[i]).reduce((a,b) => a + b );
});

// JavaScript

/*var colSums = numbers[0].map(function(col, i) {
  return numbers.map(function(row) {
    return row[i];
  }).reduce(function(a,b) {
    return a + b;
  });
});*/
document.getElementById("col-sums").innerHTML = colSums;

<p id="col-sums"></p>

Answer 7

Answer №4

You don't need to use map twice, a combination of two maps will achieve the same result:

Check out this Quick Demo

var m = [
  [1,2,3],
  [1,2,3],
  [1,2,3]
];

var total = m.map(function(arr, i) {
  var count = 0;
  return arr.map(function(el, idx) {
    return count += m[idx][i];
  })
}).pop()

Answer 8

You don't need to use map twice, a combination of two maps will achieve the same result:

Check out this Quick Demo

var m = [
  [1,2,3],
  [1,2,3],
  [1,2,3]
];

var total = m.map(function(arr, i) {
  var count = 0;
  return arr.map(function(el, idx) {
    return count += m[idx][i];
  })
}).pop()

JavaScript - Add up and combine an unspecified number of arrays in one concise statement

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

`Is it possible to remove an empty frame using javascript?`

Divide and store parts in an array

Error message: Issue with TypeScript and cleave.js - 'rawValue' property is not found on type 'EventTarget & HTMLInputElement'

Retrieve data from Firestore using React and log it outside of the asynchronous function

Getting Permission in the latest Facebook JavaScript SDK: A Step-by-Step Guide

What might be preventing me from establishing a connection between MongoDB and nodejs on my localhost?

Tips for adjusting the size of a drawing on an HTML 5 canvas within a personalized Polymer component

Dynamic array of fixed-sized arrays

Is the vertex count of a Geometry in Three.js increased when it is converted to a BufferGeometry?

Challenges with fetching data from APIs in NextJs

Utilize Nuxt.js context within a Vue plugin

Is there a way to invoke a method from within another method in VueJS 2 using mutations?

JavaScript 3D Arrays

To maintain the width values (maximum width) when using overflow:auto, do not make any adjustments. (CSS for scrollbars

Vue project missing required NPM dependency

React search filter feature with dropdown selection

Retrieve the element that was clicked by targeting its class name using JavaScript

extracting arrays from references in mongoose

Cancel all asynchronous requests

How can I access a variable from a global.asax ASP.NET file in an Angular TypeScript file?