Push strings to an array multiple times based on length of another array of arrays javascript

Question

I am new to JS and I have a program (written in the Common Workflow Language) that takes in two arrays, one of files one of strings. The arrays are initially the same length:

var headers = ["Header1", "Header2", "Header3"];
var files = [file1, file2, file3];

Each header corresponds to a particular file so Header1 -> file1, Header2 -> file2, Header3 -> file3. I have a step in my workflow that splits the files by a certain number of lines into an array of split files, so now I have an array of arrays of files like so:

var files = [[01.file1, 02.file1, 03.file1], [01.file2, 02.file2],
             [01.file3, 02.file3, 03.file3, 04.file3, 05.file3]];

Since the files are split by a certain number of lines, I have no way of knowing beforehand how many times the file is going to be split (I am processing a lot of files at a time).

Basically, what I am trying to do now, is duplicate each header equal to the length of each subarray, so Header1 should be duplicated 3 times, Header2 should be duplicated twice, and Header3 should be duplicated 5 times.

I have seen a few posts on how to duplicate a single string into an array of known length that use the var arrayNew = new Array(int).fill(x) method, but this seems to statically assign a length to an array and fill it with a single value.

I am trying to duplicate the headers strings by the length of the files array of arrays. Here is what I have so far:

var dupStrings = [];
for (var i = 0; i < files.length; i++) {
    var arrLen = files[i].length;
    dupStrings.push(headers[i].repeat(arrLen));
}

But this is currently giving me:

var headers = ["Header1Header1Header1", "Header2Header2",
               "Header3Header3Header3Header3Header3"]

I now understand why that is happening, but I don't know how to fix it. I would like it to be:

var headers = [["Header1", "Header1", "Header1"], ["Header2", "Header2"],
               ["Header3", "Header3", "Header3", "Header3", "Header3"]]

Answer 1

Your current issue occurs, because headers[i].repeat(arrLen) returns string , whereas you need an array , you may do dupStrings.push(Array(arrLen).fill(headers[i])) instead.

However, there's the other way around:

 const headers = ["Header1", "Header2", "Header3"], files = [[01.file1, 02.file1, 03.file1], [01.file2, 02.file2], [01.file3, 02.file3, 03.file3, 04.file3, 05.file3]], result = headers.map((h,i) => Array.from({length: files[i].length}, () => h)) console.log(result)

Answer 2

Try map and fill :

 var headers = ["Header1", "Header2", "Header3"]; var files = [["01.file1", "02.file1", "03.file1"], ["01.file2", "02.file2"], ["01.file3", "02.file3", "03.file3", "04.file3", "05.file3"]]; var dupStrings = headers.map(function(element, index) { return Array(files[index].length).fill(element); }); console.log(dupStrings)

Answer 3

Your for-loop is not correct, you have to iterate on files[i] in order to create an array because repeat is creating a string. The answer without using map of fill (it may be difficult for you, a newbie to understand how map and fill work) is :

for (let i = 0; i < files.length; i++) {
 for (let j = 0; j < files[i].length; j++) {
    dupStrings.push(headers[i]);
 }
 headers[i] = dupStrings;
 dupStrings = [];
}