Is there a feature in JavaScript 6 that allows to map over multiple arrays ?
Something like a zipper :
var myFn = function (a, b) { console.log(a, b);}
var arr1 = ['a', 'b', 'c'];
var arr2 = [1, 2, 3];
arr1.map(myFn, arr2); // imaginary syntax.
// prints :
// a 1
// b 2
// c 3
As the other answer points out, this is commonly known as a zip. It can be implemented as:
let zipped = arr1.map((x, i) => [x, arr2[i]]);
Or as a function, basically:
let zip = (a1, a2) => a1.map((x, i) => [x, a2[i]]);
Which would let you do:
zip(["a","b","c"], [1,2,3]); // ["a", 1], ["b", 2], ["c", 3]
Unfortunately, no. What you are looking for is commonly called zip or zipWith. See lodash's implementation for a reference: https://lodash.com/docs#zipWith
Array on MDN. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… It lists all of the methods available on Array.prototype, and you will find that the functionality you are looking for is not present.You could also use reduce to get the desired outcome:
var arr1 = ['a', 'b', 'c'];
var arr2 = [1, 2, 3];
arr1.reduce((acc, current, index) => {
console.log(current, arr2[index])
return [...acc, current, arr2[index]]
}, [])
// a 1
// b 2
// c 3
// returns ["a", 1, "b", 2, "c", 3]
["a", 1], ["b", 2], ["c", 3], not ["a", 1, "b", 2, "c", 3] right?
Took reference from @Onaracs 's answer and edited it.
const arr1 = ['a', 'b', 'c']
const arr2 = [1, 2, 3]
const arr3 = arr1.reduce((acc, current, index) => {
return [...acc, [current, arr2[index]]]
}, [])
console.log(arr3)Late to the party, but here's my solution.
// Custom zip
const zip = function (N, callback) {
if (this.length === 0 || N.length === 0 || this.length !== N.length) {
console.error(`Arrays are of different lengths or empty.`);
return;
}
for (let i = 0; i < this.length; i++) {
callback(this[i], N[i], i, this, N);
}
};
// Custom zipMap
const zipMap = function (N, callback) {
if (this.length === 0 || N.length === 0 || this.length !== N.length) {
console.error(`Arrays are of different lengths or empty.`);
return;
}
const results = [];
for (let i = 0; i < this.length; i++) {
results.push(callback(this[i], N[i], i, this, N));
}
return results;
};
// Basic Usage:
const numberArr = [1,2,3];
const stringArr = ['a','b','c'];
// Add zip function to array as a property.
numberArr.zip = zip;
//or
numberArr.zipMap = zipMap;
const callback = function(itemA, itemB, index, ArrayA, ArrayB){
console.log(itemA + itemB)
}
numberArr.zip(stringArr, callback);
// prints :
// a1
// b2
// c3You can also add the functions to Array.prototype but I don't recommend doing so, unless it's only going to be used in your code base. This post explains why it should be avoided.
//Use with caution
Object.defineProperty(Array.prototype, 'zip', {
value: zip
});
Object.defineProperty(Array.prototype, 'zipMap', {
value: zipMap
});
To answer the original question: there’s no way to map over multiple arrays, so you have to rely on the index.
Here is a basic implementation:
function mmap(f, array1, ...rest_arrays) {
return array1.map((value, index) => f(value, ...rest_arrays.map(x => x[index])));
}
console.log(mmap((name, age) => `${name}: ${age}`,
['Alice', 'Bob'],
[32, 21]));
// => ["Alice: 32", "Bob: 21"]
I’m not 100% sure how to type this properly in TypeScript, but if all arrays have the same type that’s easier:
// T1: type of the elements of the arrays
// T2: type of the return value of the function
function mmap<T1, T2>(f: (x: T1, ...rest: T1[]) => T2, array1: T1[], ...rest_arrays: T1[][]): T2[] {
return array1.map((value, index) => f(value, ...rest_arrays.map(x => x[index])));
}
Then you can use it to implement zip: mmap(Array, ...arrays):
const arr1 = ['a', 'b', 'c'];
const arr2 = [1, 2, 3];
console.log(mmap(Array, arr1, arr2));
// => [ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ] ]
// It works on any number of arrays:
console.log(mmap(Array, arr1, arr2, arr1, arr2));
// => [ [ 'a', 1, 'a', 1 ], [ 'b', 2, 'b', 2 ], [ 'c', 3, 'c', 3 ] ]
