Declaring Arrays
| Site: | Philippine Science High School - MC - Knowledge Hub |
| Course: | SY25.CS3.Web Development |
| Book: | Declaring Arrays |
| Printed by: | , Guest user |
| Date: | Tuesday, 25 November 2025, 9:33 PM |
1. Introductions
After completing this module, you are expected to:
- Represent a group of similar data using arrays.
- Create arrays and define its elements.
For groups of similar data, most
high-level computer programming languages have ways to be collected together
and referred to by a single name. One of the most widely used techniques is the
array. An array contains a data set represented by a single variable name.
You can use an array when you want to store a group or a list of related data
in a single, easily controlled location.
In this learning guide we will take
a look at this technique and learn how to use it in JavaScript.
2. Declaring and Initializing Array
There are a few ways
to create arrays in JavaScript, but
the most common is to use an array
literal, which is a single declaration that declares a variable and
specifies the values of the array as its content.
Use the basic syntax
for creating variables, to create an array using a literal array with one addition: the values in the array are separated by
commas, and the entire array value set is enclosed in square brackets.
Here is the syntax to create an array using the literal array:

where name is the name of the
variable allocated to the array, and the values in the array are value1,
value2, and value3.
The var statement is often very long when using an array literal to declare a large array. While you want to terminate every line of JavaScript code with a semicolon in most cases, breaking a literal array over several lines is acceptable. For example, you might write a literal array for a long array as follows:
An element is each value found in the array. Each element has a number, referred to as an index, that represents the position of the element within the array. While numbering usually begins with 1 in everyday life, numbering also starts with 0 in programming. This is the case for arrays.
By enclosing your index number in
brackets after the array name, means you refer to a particular array element.
As in the example below, chemElements [0] is the first element in the
chemElements array, chemElements [1] is the second element, chemElements [2] is
the third element, and so on. This also means that you would refer to the 10th
element in the array using index 9 if you have an array consisting of 10
elements.
Example:
<script>
//creating array with literal method
var chemElements = ["Argon", "Krypton", "Neon", "Xenon"];
//accessing the values of array
document.write(chemElements[0]+"</br>");
document.write(chemElements[1]+"</br>");
document.write(chemElements[2]+"</br>");
document.write(chemElements[3]+"</br>");
</script>
Output:

The var name = [value1, value2, value3,...]; syntax allows the array to be generated and the elements that it contains to be defined. Elements may be added to an existing array as well. To do this, you use a syntax similar to that used to assign a value to a standard variable, except that, after the name of the array, you also have an index for the new element in square brackets.
For example, to add the value
“Mercury” as a fifth element of the chemElements array, you would use the
following statement:

Because the existing four elements
have the index number 0, 1, 2, and 3, this statement uses the next number, 4,
and assigns it the string value "Mercury". The example below shows the updated
code with the above statement to add the fifth element.
<script>
//creating
array with literal method
var chemElements = ["Argon",
"Krypton", "Neon", "Xenon"];
chemElements [4] = "Mercury";
//accessing the values of
array
document.write(chemElements[0]+"</br>");
document.write(chemElements[1]+"</br>");
document.write(chemElements[2]+"</br>");
document.write(chemElements[3]+"</br>");
document.write(chemElements[4]+"</br>");
</script>
You may create an array that does
not contain any elements, and later add elements to it. By using the following
syntax, you create a new empty array: In this expression, the square brackets imply that the new variable is an array. You can then add elements to the array just as you would to an array that contains elements already. Dynamically, the size of an array can change. If you allocate a value to an element that has not yet been created, the element and any elements that may precede it are automatically created. The first statement in the following code, for example, creates an array of chemElements without any elements. The second statement that assigns the third element to "Neon," which also creates the first two elements in the process (chemElements[0] and chemElements[1]).


Most programming languages require all elements in an array to be exactly the same data type. In JavaScript, however, the values assigned to the elements of the array can be of different data types.
3. Array() Constructor Method
The arrays are represented by the Array object in JavaScript. A special constructor called Array() is included in the Array object that provides another way to create an array. A constructor is a particular type of function that is used to establish reference variables as the basis for (that is, variables whose data type is the reference data type). You can create new arrays with the constructor Array() by using the new keyword and the constructor Array() name with the following syntax:

![]()
You include an integer that represents the number of elements to be included in the array inside the parentheses of the Array() construction.
Example1:
<script>
//creating
array with constructor method
var chemElements = new
Array(4);
chemElements[0] = "Argon";
chemElements[1] = "Krypton";
chemElements[2] = "Neon";
chemElements[3] = "Xenon";
//accessing the values of
array
document.write(chemElements[0]+"</br>");
document.write(chemElements[1]+"</br>");
document.write(chemElements[2]+"</br>");
document.write(chemElements[3]+"</br>");
</script>
Example2: The code below will generate the
same output as the methods above.
<script>
//creating array with
constructor method
var chemElements = new
Array("Argon", "Krypton", "Neon",
"Xenon");
//accessing the values of
array
document.write(chemElements[0]+"</br>");
document.write(chemElements[1]+"</br>");
document.write(chemElements[2]+"</br>");
document.write(chemElements[3]+"</br>");
</script>

In general, JavaScript programmers create arrays using literals instead of the constructor. Many programmers think it's better to use literals than to use the constructor, and the constructor provides no unique advantages over literals.
4. Summary and References
Summary:
In summary,
- An array contains a data set represented by a single variable name. It can be use when you want to store a group or a list of related data in a single, easily controlled location.
- There are a few ways to create arrays in JavaScript:
- The most common is to use an array literal;
- Creating an empty array by using the syntax var name = [ ];
- Array() constructor method
References:
Sasha Vodnik and Don Gosselin(2015). JavaScript. In Sasha Vodnik and Don Gosselin (Sixth Edition), Building Arrays and Controlling Flow (147-211). Australia, Brazil, Mexico, Singapore, United Kingdom, United States, Cengage Learning
Array( ) Constructor: (n.d.). Retrieve from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Array
JavaScript Array – A Complete Guide for Beginners: (n.d.). Retrieve from https://data-flair.training/blogs/javascript-array/