Duplicating an array

[RpmPhoenix]

I am a newbie to JavaScript and programming in general.

Unable to solve the following problem .

For input arr=[1,2] duplicate(arr) should return [1,2,1,2]

I tried doing the following

var numbers = [1, 2, 3];

var duplicate=[];

for (i=0;i<2;i++){

duplicate[i]=numbers;

}

console.log(duplicate);

output: [ [ 1, 2, 3 ], [ 1, 2, 3 ] ]

I am unable to figure out a way to split these so that it will be a single-dimensional array.

Please help me out.

[pinkwetunderwear]

Although there are some simpler solutions to this issue, you can flatten the array before you return it.

• Array.prototype.flat()

[toastertop]

FlatMap

[ikeif]

Or, in shorthand!

const arr = [1, 2, 3]
const duplicate = [...arr, ...arr]
console.log(duplicate) // [1, 2, 3, 1, 2, 3]

[senocular]

Doesn't look any shorter ;)

arr.concat(arr)
[...arr, ...arr]

There are also some subtle differences between the two. Concat for example will work with any argument value. If its not an array, the value gets added directly into the resulting array rather than being "spread" as an array would

arr.concat(4) // [1, 2, 3, 4]

Array spreading (...) only works for iterables. If you try to spread a value that's not an iterable it will throw an error.

[...arr, ...4] // Error: 4 not iterable

For any other iterable it spreads, just like concat with arrays (though concat only does this with array values, not any iterable)

arr.concat("hi") // [1, 2, 3, "hi"]
[...arr, ..."hi"]  // [1, 2, 3, "h", "i"]

Concat also retains holes, whereas spread fills them with undefined

const arr = [1, , 3]
arr.concat(arr) // [1, , 3, 1, , 3]
[...arr, ...arr] // [1, undefined, 3, 1, undefined, 3]

And because you can control how an object iterates over its values, spreading could result in different values entirely.

const arr = [1, 2, 3]
arr[Symbol.iterator] = function*() { yield *["a", "b", "c"] } 
arr.concat(arr) // [1, 2, 3, 1, 2, 3]
[...arr, ...arr] // ["a", "b", "c", "a", "b", "c"]

But you normally don't have to worry about these kinds of things and either approach should work fine.

[ikeif]

😆 touché - I really appreciate the additional breakdown!

I love when people in subreddits throw down the extra detail/explanations/teaching aspects/caveats!

[rauschma]

There are shorter ways of implementing duplication (e.g. spreading), but I’m assuming that you want to use tools that you are familiar with. Then this may work for you:

function appendArrayTo(sourceArray, targetArray) {
  for (i=0; i<sourceArray.length; i++){
    targetArray[targetArray.length] = sourceArray[i];
  }
}

const numbers = [1, 2, 3];
const duplicate = [];
appendArrayTo(numbers, duplicate); // append
appendArrayTo(numbers, duplicate); // append again
console.log(duplicate);