Creating Arrays: Literal Notation ([])
Array literal notation ([]) is the most common and preferred way to create arrays in JavaScript. This concise syntax is easy to read and generally performs better.
Example 1: Creating an empty array
// Creates an empty array named 'fruits'.
const fruits = [];
Explanation
The code above initializes an empty array called fruits. This is the simplest form of array creation and is useful when you intend to add elements to the array later.
Example 2: Array of strings
// Creates an array of strings.
const colors = ["Red", "Green", "Blue"];
Explanation
This example demonstrates creating an array named colors and populating it with three string elements. The elements are enclosed in square brackets and separated by commas.
Example 3: Array of numbers
// Creates an array of numbers.
const numbers = [10, 20, 30, 40, 50];
Explanation
Here, we define an array called numbers that holds a sequence of numeric values. This is a straightforward way to store a list of numbers for later use.
Example 4: Array with mixed data types
// Creates an array with different data types.
const mixedArray = ["Hello", 123, true, null];
Explanation
JavaScript arrays are flexible and can hold elements of different data types. The mixedArray contains a string, a number, a boolean, and a null value.
Example 5: Array with trailing comma
// Creates an array with a trailing comma.
const teams = [
"Lakers",
"Warriors",
"Celtics", // Trailing commas are allowed in JavaScript arrays.
];
Explanation
This example shows the use of a trailing comma after the last element. Modern JavaScript allows this, which can make version control diffs cleaner when adding new elements.
Creating Arrays: new Array()
The new Array() constructor is another way to create arrays. While less common for simple array creation, it has specific use cases, such as creating an array with a predefined length but no elements.
Example 1: Creating an empty array with constructor
// Creates an empty array using the Array constructor.
const vegetables = new Array();
Explanation
This code is functionally equivalent to const vegetables = [];. It uses the Array constructor to create a new, empty array named vegetables.
Example 2: Array with elements using constructor
// Creates an array of strings using the constructor.
const planets = new Array("Mercury", "Venus", "Earth");
Explanation
When you pass multiple arguments to the new Array() constructor, they become the elements of the newly created array, similar to the literal notation.
Example 3: Creating an array of a specific size
// Creates an array with a predefined length but no elements.
const emptySlots = new Array(5); // Creates an array with length 5
Explanation
If you pass a single number to the new Array() constructor, it creates an array with that specified length. The array will be empty, containing no actual elements.
Example 4: Array with a single numeric element
// To create an array with a single number, use literal notation or Array.of().
// Using new Array() with one number creates an array of that length.
const singleNumber = Array.of(10); // Or simply [10]
Explanation
A common pitfall with new Array(10) is that it creates an array of length 10, not an array with the single element 10. To create an array with just one number, Array.of() or literal notation is the correct approach.
Example 5: Populating an array created with a constructor
// Create an array of a certain size and then fill it.
const filledArray = new Array(3).fill("default");
Explanation
This example first creates an array with a length of 3. It then uses the fill() method to populate every slot in the array with the string "default".