Displaying an array of functions above an array in Javascript

Question

I often have to compare the list of functions (processors) with several arrays (channels) of float data), so I wrote a helper function ...

const mapMany = function(processors, channels){ processors.forEach( function(processor){ channels = channels.map( (channel) => channel.map(processor) ); }); return channels; }; 

This reads OK (at least for me!), But matching an array of functions over another array seems like such a general thing, I can't help but wonder if this is really a “thing”, that is, there is a better / built-in in / canonical to implement this functionality like "Map Many", and if so, what is its own name?

Answer 1

Yes, there is a better approach to implement this. Do not use forEach !

 function mapMany(processors, channels) { return processors.reduce((channels, processor) => channels.map(channel => channel.map(processor)) , channels); } 

But no, there is no built-in or canonical name for this. This is a rather specific function, which, however, can be trivially composed of standard building blocks.

Answer 2

I think you are looking for compose . It looks something like this:

 const compose = function (...fns) { const rest = fns.reverse(); const first = rest.shift(); return function (...args) { return rest.reduce((acc, f)=>f.call(this, acc), first.apply(this, args)); }; }; 

Now you can create such functions:

 const stringDouble = compose(String, x=>x*2); stringDouble("44"); //==> "88" ["22","33","44"].map(stringDouble); //=> ["44", "66", "88"] 

And in your case, you can write your function as follows:

 const mapMany = function(processors, channels){ // compose iterates from last to first so i apply reverse const fun = compose.apply(undefined, processors.reverse()); return channels.map(fun); }; 

The advantage over your own code and other answer with reduce is that it does not make processors.length arrays in this process, but only that one.

There are libraries that supply compose . This is a common function in functional programming.

Other display functions, such as those found in Underscore, allow you to set this . Then the class methods will work when I pass this to the main functions.

Answer 3

Since Bergie points out that this was just an abbreviation that I was looking for, dividing it into two functions makes it much clearer ...

 const applySingleProcessor = function(channels, processor){ return channels.map( channel => channel.map(processor) ); }; const applyMultipleProcessors = function(processors, channels) { return processors.reduce(applySingleProcessor, channels); }; 

Simplicity!!

Answer 4

While I usually used .reduce() as @Bergi, just for a change here is just a recursive solution .map() without .reduce() ;

 var channels = [[1,2,3,4],[5,6,7,8], [857,1453,1881,1071]], processors = [x => x+1, x => x*x, x => Math.sqrt(x), x => x-1], mapMany = (processors, channels) => processors.length ? (channels = channels.map(c => c.map(processors[0])), mapMany(processors.slice(1),channels)) : channels; console.log(mapMany(processors,channels));