JavaScript Fundamentals: Arrays

The fundamentals of JavaScript arrays - what is an array? what are the types of arrays? and what are the JavaScript array methods?

What is an Array in JavaScript?

An array is a special type of data type that allows you to store multiple values in a single variable.

Arrays are one of the most commonly used data structures in JavaScript. They allow developers to store and manipulate data in a way that is both easy to understand and powerful.

An array is simply a collection of values.

The values in an array can be of any data type, including numbers, strings, objects, and even other arrays. Arrays are created using the array literal syntax, which is simply a set of values enclosed in square brackets:

var myArray = [1, 2, 3];

The above code creates an array with three values: 1, 2, and 3. These values can be accessed using array indices, which are zero-based. In other words, the first element in the array is myArray[0], the second element is myArray[1], and so on.

Types of Arrays in JavaScript

There are two types of arrays in JavaScript:

  1. Standard Arrays
  2. Associative Arrays

A standard array is a numerically indexed array, where each element is accessed by its numerical index. An associative array is an array where each element is accessed by a key.

Here is an example of a standard array in JavaScript:

var colors = ["red", "orange", "yellow", "green", "blue", "indigo", "violet"];

This is a standard JavaScript array that contains a list of colors.

An associative array is a data structure that stores key-value pairs. In JavaScript, an associative array is simply an object.

Here is an example of an associative array in JavaScript:

var myObj = {
  "name": "Aphinya",
  "website": "zipply.io",
  "city": "Lumsden"
};

JavaScript Array Methods

Arrays are also mutable, which means that they can be changed after they are created. Elements can be added, removed, or modified using the array's built-in methods. Here are some of the most commonly used methods for arrays:

  1. push(): This method adds one or more elements to the end of an array.
  2. pop(): This method removes the last element from an array.
  3. shift(): This method removes the first element from an array.
  4. unshift(): This method adds one or more elements to the beginning of an array.
  5. splice(): This method can be used to add or remove elements from an array.
  6. concat(): This method returns a new array that is the combination of two or more arrays.
  7. slice(): This method returns a new array that is a subset of an existing array.
  8. indexOf(): This method returns the first index at which a given element can be found in an array.
  9. forEach(): This method executes a provided function once for each array element.

Here's an example of how to use array methods:

var myArray = [1, 2, 3];

myArray.push(4); // adds 4 to the end of the array
myArray.unshift(0); // adds 0 to the beginning of the array
myArray.pop(); // removes the last element from the array
myArray.shift(); // removes the first element from the array
myArray.splice(2, 1); // removes the element at index 2
myArray.reverse(); // reverses the order of the elements in the array
myArray.sort(); // sorts the elements in the array

There are many other methods that can be used to manipulate arrays, but the above are some of the most commonly used.

Arrays are an essential part of JavaScript and are used in many different applications. If you're just getting started with JavaScript, make sure to spend some time learning about arrays and how to use them.

Array Methods: filter, find, map, reduce, every, and some in JavaScript
Not everything is an object. When it comes to functional programming, it’s more to do with the processes that get you from point A to point B than how data and groups of business logic are structured. JavaScript is a language that’s prone to imperative patterns because of

Article by:

Aphinya Dechalert

Aphinya Dechalert

Aphinya is a skilled tech writer with field experience in software development, agile, and fullstack JavaScript. She is a dev advocate and community builder, helping others navigate their dev journey.

More posts...

JavaScript Fundamentals

JavaScript Fundamentals: Fetch

What is fetch()? how did fetch() come about? why is fetch() important?

JavaScript Fundamentals

JavaScript Fundamentals: JSON

What is JSON? How does it work? what are some JSON methods in JavaScript?

JavaScript Fundamentals

JavaScript Fundamentals: Prototypical Inheritance

What is a prototype? How does prototypical inheritance works? What are some examples of prototypes in JavaScript?

JavaScript Fundamentals

JavaScript Fundamentals: Advanced Classes

What are class methods? how do you use class methods? what are some common default class methods you should know about.