Summary of JS tips for creating or filling arrays of arbitrary length

Preface

In JavaScript development, there are often scenarios where you need to create arrays of a specific length. This article summarizes several tips for creating or filling arrays of arbitrary length. Learning these tips can improve your programming efficiency.

Direct filling method

Take the most primitive approach and manually fill the array to the required length.

const arr = [0,0,0];

for loop push() method

Similar to the first method, but using a for loop to create an array of a specific length

var len = 3;
var arr = [];
for (let i=0; i < len; i++) {
  arr.push(0);
}

Array Constructor Method

var len = 3;
var arr = new Array(len);

Add fill() method after Array constructor

var len = 3;
var arr = new Array(len).fill(0);

If you use an object as a parameter to fill() an array, all elements will refer to the same instance (that is, the object is not cloned multiple times, Array.from() does not have this problem):

var len = 3;
var obj = {};
var arr = new Array(len).fill(obj);

So operating on this array should be faster than creating it using the constructor. However, creating arrays is slower because the engine may need to reallocate contiguous memory multiple times as the array grows.

Filling an array with undefined

Array.from({length: 3}) // [ undefined, undefined, undefined ]

The following approach only works for iterable values, and has a similar effect to Array.from():

[...new Array(3)] // [ undefined, undefined, undefined ]

Mapping with Array.from()

You can map using Array.from() if you provide a mapping function as its second argument.

Filling an array with values

Array.from({length: 3}, () => 0) // [ 0, 0, 0 ]

Creating an array with unique (non-shared) objects

Array.from({length: 3}, () => ({})) // [ {}, {}, {} ]

Create an array with ascending integer sequences

Array.from({length: 3}, (x, i) => i) // [ 0, 1, 2 ]

Create with any range of integers

var start = 2, end = 5;
Array.from({ length: end - start }, (x, i) => i + start) // [ 2, 3, 4 ]

Another way to create an ascending integer array is to use keys()

[...new Array(3).keys()] // [ 0, 1, 2 ]

Summarize

This concludes this article on tips for creating or filling arrays of arbitrary length with JS. For more information on creating and filling arrays with JS, please search previous articles on 123WORDPRESS.COM or continue browsing the related articles below. I hope you will support 123WORDPRESS.COM in the future!