Replicate the array multiple times and combine them into a single flat array

Question

Replicate the array multiple times and combine them into a single flat array

I have a four-element array that I need to copy to another array four times. I achieved this by concatenating the array four times.

Here is what I tried:

let demoProperties = []
  .concat(fourDemoProperties)
  .concat(fourDemoProperties)
  .concat(fourDemoProperties)
  .concat(fourDemoProperties);

I also attempted another approach using map and reduce, but it required iterating twice.

If anyone knows of a simpler or more efficient way to copy an array N times, I would greatly appreciate any suggestions you may have.

javascript arrays

Answer 1

Answer №1

If you want to duplicate an array in JavaScript, there are a few methods you can use:

const originalArray = [1, 2, 3, 4];
const duplicatedArray = [...originalArray, ...originalArray];

You can also achieve the same result using Array#fill in combination with spread syntax:

const originalArray = [1, 2, 3, 4];
const duplicatedArray = [].concat(...Array(2).fill(originalArray));

console.log(duplicatedArray);

Note: It's important to understand that these methods create shallow clones. If your array contains objects, changing one object in the duplicated array will affect all "copies". See this example below:

const originalArray = [{ x: 100 }, { y: 200 }];
const duplicatedArray = [...originalArray, ...originalArray];

duplicatedArray[0].x = 500;

console.log(duplicatedArray);

Answer 2

If you want to duplicate an array in JavaScript, there are a few methods you can use:

const originalArray = [1, 2, 3, 4];
const duplicatedArray = [...originalArray, ...originalArray];

You can also achieve the same result using Array#fill in combination with spread syntax:

const originalArray = [1, 2, 3, 4];
const duplicatedArray = [].concat(...Array(2).fill(originalArray));

console.log(duplicatedArray);

Note: It's important to understand that these methods create shallow clones. If your array contains objects, changing one object in the duplicated array will affect all "copies". See this example below:

const originalArray = [{ x: 100 }, { y: 200 }];
const duplicatedArray = [...originalArray, ...originalArray];

duplicatedArray[0].x = 500;

console.log(duplicatedArray);

Answer 3

Answer №2

Depending on whether you want to maintain the reference among the sub arrays or not, the way you go about it can vary.

var ar  = [1,2,3,4],
    ars = Array.from({length:4}).map(_ => ar),
    brs = Array.from({length:4}).map(_ => ar.slice());
console.log(ars);
console.log(brs);

Answer 4

Depending on whether you want to maintain the reference among the sub arrays or not, the way you go about it can vary.

var ar  = [1,2,3,4],
    ars = Array.from({length:4}).map(_ => ar),
    brs = Array.from({length:4}).map(_ => ar.slice());
console.log(ars);
console.log(brs);

Replicate the array multiple times and combine them into a single flat array

Answer №1

Answer №2

Similar questions

Swapping out image sources using a React Hook that includes an onClick event

Experience the seamless transition of new CSS animations

What is the process of directing a data stream into a function that is stored as a constant?

Scrolling to top using jQuery - Problem with incorrect anchor

Sharing Data via JSON for a Pop-Up Display

Transfer content within <pre> tags to the clipboard using a Vue.js application

The onclick functionality is not functioning properly within email communications

`How can I extract information from the internet?`

Attempting to establish a means to switch between languages

Access a designated tab within a CSS-designed tab system

Protractor unable to locate elements using by.repeater

Experiencing a disappearing session on Express.js happens approximately every 3 minutes (I can relate to this problem as

What is the simplest method to check for the presence of a value within an object when utilizing lodash or angularjs?

Angular 4 with Universal: Implementing 404 Status Code in Header for /404 Page Component

What is the best way to identify the largest sublist within an array?

What methods can be used to prevent accessing 'res' after the resolution of getServerSideProps?

Arranging JSON based on values in an array using node.js

Attempting to load an image through an AJAX Request may prove to be unsuccessful

Tips on dividing a div into two separate pages when converting to PDF

Error Connecting to Database with Node.JS MySQL Module - ECONNRESET Issue