How to Create an Array Containing 1…N

In this tutorial, you are going to learn about creating a JavaScript Array that contains 1 through to n.

Let's create a new array with a specified length. The constructor sets the length property of the Array to the given length, without setting the keys.

Next, when you want to use it, for example, unoptimized, you can do the following:

Javascript create an empty array with length

Let's discuss another way of solving this problem. You can do the following:

Javascript create an array with 1 to n using Array.from

Javascript create an array with random values

<kbd class="highlighted">Number.call(undefined, n)</kbd> is equal to <kbd class="highlighted">Number(n)</kbd> that returns n.

<kbd class="highlighted">Array.apply(null, [undefined, undefined, undefined])</kbd> is equal to <kbd class="highlighted">Array (undefined, undefined, undefined)</kbd>, which initializes three-element array and assigns undefined to each element.

Now let's generalize that to n elements. The <kbd class="highlighted">Array()</kbd> works like this:

Javascript create an empty array with n length

function Array() {
  if (arguments.length == 1 &&
    'number' === typeof arguments[0] &&
    arguments[0] >= 0 && arguments &&
    arguments[0] < 1) {
    return […]; // array of length arguments[0]
                // generated by native code
  }
  let arr = [];
  for (let i = 0; i < arguments.length; i++) {
    arr.push(arguments[i]);
  }
  return arr;
}

Now let’s call <kbd class="highlighted">Array.apply(null, { length: n })</kbd>:

Javascript create an empty array with n length

function Array() {
  let a = [];
  for (let i = 0; i < /* arguments.length = */ n; i++) {
    a.push( /* arguments[i] = */ undefined);
  }
  return a;
}

Now we have an n-element array where each element is set to undefined.

When you invoke <kbd class="highlighted">.map(callback, thisArg)</kbd> on it, it will set each element to the result of <kbd class="highlighted">callback.call(thisArg, element, index, array)</kbd>.

Both <kbd class="highlighted">Array.apply(null, {length: n})</kbd> and <kbd class="highlighted">Array(n)</kbd> expressions result in an n-element array of undefined elements. According to the <kbd class="highlighted">map()</kbd> documentation, the first expression will set each element to undefined, whereas in the second expression, each element was never set.

The callback is called only for indexes of the Array which have assigned values, thus <kbd class="highlighted">Array(n)</kbd> is not efficient; <kbd class="highlighted">Array(n).map(Number.call, Number)</kbd> would result in an uninitialized array of length n.

The Array() Constructor

The <kbd class="highlighted">Array()</kbd> constructor creates Array objects. A JavaScript array is created with the given elements, except in the case where a single argument is passed to the Array constructor and is a number. Array length property returns an unsigned, 32-bit integer that specifies the number of elements in the Array.