Reformatting a structured string like "a-b-c|A-B-C" into "a-A|b-B|c-C" The code below was inspired by this post in Code Review.
Here is how it was first intended by its author:

I have the following code that converts a string that looks like :

aaa-bbb|ccc-ddd|eee-fff



to two strings that look like

aaa|ccc|eeeandbbb|ddd|fff


Somebody already proposed an answer, and I found it could be more improved using reduce() and map() methods.
But after a few time I realized it could be made of more general use, so I hooked in the intent to have a code which both:

accept any main- and sub-separator (| and -) in the above example.
accept any number of main parts and sub-parts, the only (not checked) requirement being the number of sub-parts is the same through all parts.
is strictly written functional-programming style

Then I ended up with pretty different requirements than in the original post I cited, so rather than an answer I prefer to post it as a question, waiting for comments about:

is there a simpler strategy for doing that in functional style?
and even is it a good idea to use functional style, since it might be actually slower than with procedural code?



function reformat(string, mainSep, subSep) {
  return string.split(mainSep).map(item =&gt; item.split(subSep)).reduce(
    (result, part) =&gt; 
      part.map((str, index) =&gt; 
        `${result[index]}${mainSep}${str}`
      )
  ).join(subSep || ' ');
}

console.log(reformat('HEL-CAS|MAD-STO|XXX-YYY', '|', '-')); 
console.log(reformat('1:2:3_one:two:free_ONE:TWO:THREE_I:II:III', '_', ':'));
console.log(reformat('abcdefgh.ABCDEFGH', '.', ''));
To start, I must say that I wish I was writing JS like this in 2016. I have only recently been becoming acquainted with the newer features ecmascript-6 has to offer. After looking at the other answers to the post you mentioned I would have suggested they consider using destructuring assignment, but I doubt it would help for your code.
For readability it can be a great idea to use functional code, but yes performance can suffer because each iteration calls a function, which adds to the call stack.
This code makes great use of template literals and arrow functions. It also has consistent indentation.
The template literal may be considered excessive, since it only contains interpolated values. The string concatenation could be achieved with the + operator - instead of:
 part.map((str, index) =&gt; 
       `${result[index]}${mainSep}${str}`

It could merely be:
 part.map((str, index) =&gt; 
       result[index] + mainSep + str

Which would save a few characters but also should be faster. See this jsBin for a comparison, as well as this answer to Most efficient way to concatenate strings in JavaScript?  which has a link to an updated JSPerf. The graphs don't appear to be loading in my browser but in MacOS FF 77 the concat appears to be fastest with the template literal 4% slower. In Chrome 83.04 the results were similar - template literals appeared to be 22% slower than appending.
I forgot that reduce() started with the 2nd element when no initialValue is supplied. While it may not be a huge improvement it does mean one less iteration...