Explanation on Arrays and Arrays method

This content originally appeared on DEV Community and was authored by Abdulsemiu Wasilat

Certainly, let's break down arrays and their methods in JavaScript:

What is an Array?

In JavaScript, an array is a special type of object used to store a collection of values (elements) under a single variable name.
These values can be of different data types (numbers, strings, booleans, objects, even other arrays).

Key Characteristics:

Ordered: Elements in an array have a specific order, and their positions are indexed starting from 0.
Mutable: You can change the elements within an array after it's created.
Dynamic: Arrays can grow or shrink in size as needed.

Creating an Array:

Literal Notation:

   const myArray = [1, "hello", true, null];

Using the Array constructor:

   const anotherArray = new Array(5); // Creates an array with 5 empty slots
   const yetAnotherArray = new Array(1, 2, 3);

Accessing Array Elements:

Use square bracket notation with the index:

   const fruits = ["apple", "banana", "orange"];
   console.log(fruits[0]); // Output: "apple" (first element)
   console.log(fruits[2]); // Output: "orange" (third element)

Modifying Array Elements:

Assign a new value to the desired index:

   fruits[1] = "grape"; 
   console.log(fruits); // Output: ["apple", "grape", "orange"]

Common Array Methods:

push(): Adds one or more elements to the end of the array.

   fruits.push("mango");

pop(): Removes the last element from the array and returns it.

   const removedFruit = fruits.pop();

unshift(): Adds one or more elements to the beginning of the array.

   fruits.unshift("kiwi");

shift(): Removes the first element from the array and returns it.

   const firstFruit = fruits.shift();

slice(): Creates a shallow copy of a portion of the array.

   const citrusFruits = fruits.slice(1, 3); // Elements from index 1 to 2 (exclusive)

splice(): Adds/removes elements from an array at a specified position.

   fruits.splice(1, 0, "pear"); // Insert "pear" at index 1
   fruits.splice(2, 1); // Remove 1 element starting from index 2

concat(): Creates a new array by concatenating existing arrays.

   const combinedFruits = fruits.concat(["pineapple", "strawberry"]);

join(): Joins all array elements into a single string, separated by a specified separator.

   const fruitString = fruits.join(", ");

indexOf(): Returns the first index of a given element.

   const index = fruits.indexOf("apple");

includes(): Checks if an array includes a certain element.

   const hasBanana = fruits.includes("banana");

forEach(): Executes a provided function once for each array element.

   fruits.forEach(fruit => console.log(fruit));

map(): Creates a new array by applying a function to each element of the original array.

   const fruitLengths = fruits.map(fruit => fruit.length);

filter(): Creates a new array with only the elements that pass a test provided by a function.

   const longFruits = fruits.filter(fruit => fruit.length > 5);

This is a basic overview of arrays and their methods in JavaScript. There are many more methods available, each with its own specific purpose. I hope this helps!

This content originally appeared on DEV Community and was authored by Abdulsemiu Wasilat

Print Share Comment Cite Upload Translate Updates

APA

Abdulsemiu Wasilat | Sciencx (2025-01-20T16:19:31+00:00) Explanation on Arrays and Arrays method. Retrieved from https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/

MLA

" » Explanation on Arrays and Arrays method." Abdulsemiu Wasilat | Sciencx - Monday January 20, 2025, https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/

HARVARD

Abdulsemiu Wasilat | Sciencx Monday January 20, 2025 » Explanation on Arrays and Arrays method., viewed ,<https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/>

VANCOUVER

Abdulsemiu Wasilat | Sciencx - » Explanation on Arrays and Arrays method. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/

CHICAGO

" » Explanation on Arrays and Arrays method." Abdulsemiu Wasilat | Sciencx - Accessed . https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/

IEEE

" » Explanation on Arrays and Arrays method." Abdulsemiu Wasilat | Sciencx [Online]. Available: https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/. [Accessed: ]

rf:citation

» Explanation on Arrays and Arrays method | Abdulsemiu Wasilat | Sciencx | https://www.scien.cx/2025/01/20/explanation-on-arrays-and-arrays-method/ |

Please log in to upload a file.

There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts