Skip main navigation

Arrays and their properties: Creating arrays

In this activity, we will explore how to create arrays.
A computer screen with code on it.
© Packt

Arrays are lists of values.

These values can be of all data types and one array can even contain different data types. It is often very useful to store multiple values inside one variable; for example, a list of students, groceries, or test scores.

Once you start writing scripts, you’ll find yourself needing to write arrays very often; for example, when you want to keep track of all the user input, or when you want to have a list of options to present to the user.

Creating arrays

You might be convinced by now that arrays are great, so let’s see how we can make them.

There is actually a right way and a wrong way to do it. Here are both. Which one do you think is the right one?

 arr1 = new Array("purple", "green", "yellow"); 
arr2 = ["black", "orange", "pink"];

If you guessed the second option, using square brackets, you are right. This is the best and most readable way to create a new array.

On the other hand, the first option can do unexpected things. Look at both lines of code here. What do you think they will do?

 arr3 = new Array(10); 
arr4 = [10];

Probably, you sense that something is up here. They do not both create an array with one value, 10. The second one, arr4, does. The first option creates an array with 10 undefined values.

If we log the values like this:

 console.log(arr3);
console.log(arr4);

Here is what it logs:

 [ <10 empty items> ] 
[ 10 ]

Thanks, JavaScript! That was very helpful.

So, unless that is what you need to do, please use the square brackets!

As I already mentioned, we can have mixed arrays and arrays can hold any type of variable.

The values of the array won’t be converted to a single data type or anything like that. JavaScript simply stores all the variables with their own data type and value in the array:

 let arr = ["hi there", 5, true]; 
console.log(typeof arr[0]);
console.log(typeof arr[1]);
console.log(typeof arr[2]);

This will output to the console:

 string 
number
boolean

The last array fun fact we will go over here is what happens if you define an array using const. You can change the values of a constant array, but you cannot change the array itself.

Here is a piece of code to demonstrate:

 const arr = ["hi there"]; 
arr[0] = "new value";
console.log(arr[0]);

arr = ["nope, now you are overwriting the array"];

The new value for the first element of the array is going fine, but you cannot assign a new value to the full array.

Here is what it will output:

 new value 
TypeError: Assignment to constant variable.
© Packt
This article is from the free online

Introduction to JavaScript

Created by
FutureLearn - Learning For Life

Reach your personal and professional goals

Unlock access to hundreds of expert online courses and degrees from top universities and educators to gain accredited qualifications and professional CV-building certificates.

Join over 18 million learners to launch, switch or build upon your career, all at your own pace, across a wide range of topic areas.

Start Learning now