let user = new Array();  // An empty array 

You can also create an array with a specific size right away. For example, you create an array with 10 elements as follows:

let user = new Array(10); // 10 undefined elements 

However, specifying the size of an array isn’t really necessary with arrays because an array can grow dynamically at runtime. Watch out when you create an array as follows:

let vals = new Array(10, 50); // 2 elements vals[0]:10, vals[1]:50 

In that case, you create an array with two occupied elements. You can specify the length of the array only if you call the constructor function of Array() with a single decimal value as an argument.

Likewise, in the constructor function notation, you can already pass values directly as arguments:

let user = new Array("John", "Frank", "Steven"); 

For the arrays with Array(), you can also omit the keyword new. In practice, you’ll have to deal a lot with arrays in the future. Whether you prefer to use the array literal notation or the constructor function notation is up to you. I personally prefer the shorter array literal notation with the square brackets.

18.2.1    Accessing the Individual Elements in the Array

You can access the individual elements of an array using the square brackets and the corresponding index number. The first element in an array always has index [0], the second element index [1], and so on. For example:

Listing 18.10     /examples/chapter018/18_2_1/script.js

Here, you have an array for a user, including nickname, age, email, and whether this user has admin rights. If you now want to create multiple users with the same data, you can do this using a multidimensional array as follows:

let user = [
    ["pronix74", // [0][0]
        46, // [0][1]
        "wolfe@pronix.com", // [0][2]
        false // [0][3]
    ],
    ["halwa66", // [1][0]
        51, // [1][1]
        "halwa@pronix.com", // [1][2]
        false // [1][3]
    ],
    ["woafu", // [2][0]
        46, // [2][1]
        "1@woafu.com", // [2][2]
        true // [2][3]
    ]
]; 

Now you’ve created a multidimensional array with three users. The access works with the usual one-dimensional array over the index. With the first dimension, you specify the user as index (here, 0, 1, or 2), and with the second dimension, you access the desired value. For example, to access the data of the second user in the user array, you can do the following:

...
console.log(user[1][0]); // Output: halwa66
console.log(user[1][1]); // Output: 51
console.log(user[1][2]); // Output: halwa@pronix.com
console.log(user[1][3] ? "Admin" : "User"); // Output: User 

Listing 18.12     /examples/chapter018/18_2/script.js

18.2.3    Adding or Removing New Elements in an Array

let user = [
    "John",  // [0]
    "Jason", // [1]
    "Ben"    // [2]
];

user[3] = "Tom";
user[5] = "Jay";
user[2] = undefined; // Delete value

for (let i = 0; i < user.length; i++) {
    console.log(user[i]);
} 

Listing 18.13     /examples/chapter018/18_2_3/script.js

In the example, holes were created for the elements user[2] and user[4]. The content of these elements is undefined. Of course, you can check in a loop where empty space exists (= undefined) and then insert the element there, but it’s much easier to keep the array without holes right away. In the example, the for loop pass also uses the length property, which contains the number of elements in an array.

Traversing Arrays Conveniently Using “for ... in” and “for ... of”

A Brief Overview of Common Methods for Adding and Removing Elements in the Array

Listing 18.14     /examples/chapter018/18_2_3/script2.js

Listing 18.15     /examples/chapter018/18_2_3/script3.js

Listing 18.16     /examples/chapter018/18_2_3/script4.js

18.2.4    Sorting Arrays

Because functions are also objects in JavaScript, they can be used as arguments or even return values just like variables, as you’ve seen with the sort(compare) function. With regard to the previous examples, you can also use this to implement the loop pass with the output of the individual elements as a function. For this, too, the arrays in JavaScript provide a useful and simple option: the forEach() method. The passed argument with this method gets output with each element. You can use it to output each element of an array via a function with forEach():

...
function printUser(item) {
    console.log(item);
}
let user = [
    "halwa66",
    "pronix74",
    "conrad22",
    "anton43",
    "beta88"
];
user.sort(compare);
user.forEach(printUser); 

Listing 18.17     /examples/chapter018/18_2_4/script.js

18.2.5    Searching within Arrays

Before you write a function to search for a specific element in the array, let me introduce you to two functions for that as well. There’s nothing wrong with doing the following: