0% found this document useful (0 votes)
10 views

7 - JavaScript Arrays

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
10 views

7 - JavaScript Arrays

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

JavaScript Arrays

by : Emmersive Learning

Join us :
Telegram : https://t.me/EmmersiveLearning

Youtube : https://www.youtube.com/@EmmersiveLearning/
JavaScript Arrays
Arrays in JavaScript are used to store multiple values in a single variable. Arrays
are one of the most common data structures in JavaScript. Here’s a detailed
guide on how to work with arrays:

1. Creating Arrays

You can create arrays using:

Array literal notation (most common):

const fruits = ["apple", "banana", "cherry"];

Array constructor:
const fruits = new Array("apple", "banana", "berry");

2. Accessing Array Elements

Array elements are accessed by their index. Indexes start from 0 (zero-based
index):

const fruits = ["apple", "banana", "cherry"];


console.log(fruits[0]); // Output: "apple"
console.log(fruits[2]); // Output: "cherry"

3. Modifying Array Elements

You can modify array elements by accessing their index:

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

4. Array Properties
Length: The length property returns the number of elements in the array:

console.log(fruits.length); // Output: 3

5. Common Array Methods


Here are some important array methods:

push(): Adds an element to the end of the array.

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

pop(): Removes the last element from the array.

fruits.pop();
console.log(fruits); // Output: ["apple", "orange", "cherry"]
shift(): Removes the first element from the array.

fruits.shift();
console.log(fruits); // Output: ["orange", "cherry"]

unshift(): Adds an element to the beginning of the array.

fruits.unshift("kiwi");
console.log(fruits); // Output: ["kiwi", "orange", "cherry"]

indexOf(): Finds the index of an element.

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


console.log(index); // Output: 1

includes(): Checks if the array contains a specific element.

const hasApple = fruits.includes("apple");


console.log(hasApple); // Output: false

slice(): Returns a portion of an array without modifying the original array.


const sliced = fruits.slice(1, 3);
console.log(sliced); // Output: ["orange", "cherry"]

splice(): Adds or removes elements from an array.

fruits.splice(1, 1, "strawberry"); // Replaces 1 element at


index 1
console.log(fruits); // Output: ["kiwi", "strawberry", "cherry"]
6. Iterating Over Arrays

You can loop through an array using different loops:

for loop:

for (let i = 0; i < fruits.length; i++) {


console.log(fruits[i]);
}

forEach(): A higher-order function to iterate over arrays.

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

map(): Returns a new array by transforming every element.

const upperFruits = fruits.map(fruit => fruit.toUpperCase());


console.log(upperFruits); // Output: ["KIWI", "STRAWBERRY",
"CHERRY"]
7. Multi-dimensional Arrays

Arrays can hold other arrays (multi-dimensional arrays):

const matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
console.log(matrix[1][2]); // Output: 6

8. Destructuring Arrays

You can use destructuring to extract values from an array into variables:

const [first, second] = fruits;


console.log(first); // Output: "kiwi"
console.log(second); // Output: "strawberry"

9. Spread Operator in Arrays

The spread operator (...) can be used to copy and merge arrays:

Copying an array:
const newFruits = [...fruits];

Merging arrays:

const moreFruits = ["grape", "mango"];


const allFruits = [...fruits, ...moreFruits];
console.log(allFruits); // Output: ["kiwi", "strawberry",
"cherry", "grape", "mango"]

10. Array Challenges

Here are a few array challenges for practice:

1. Write a function that returns the largest number in an array.


2. Write a function that removes duplicates from an array.
3. Write a function that finds the sum of all numbers in an array.
4. Write a function that reverses an array.

By mastering arrays, you'll be better equipped to handle collections of data in


JavaScript! Let me know if you'd like more examples or explanations on any part
of arrays.

You might also like