Javascript

Arrays
By Mr. Arman Magsino
 What’s in it for you?

MAMANSKI3
How to create Access Elements Add an Element Object Method Remove an
an Array of an Array to an Array Element from an
Array
How to create an Array

MAMANSKI3
 How to create an Array

Using an array literal

The easiest way to create an array is by using an array literal [ ].

const array1 = ["eat", "sleep"];

MAMANSKI3
Using the new keyword

You can also create an array using JavaScript's new keyword.

const array2 = new Array("eat", "sleep");
 How to create an Array

The easiest way to create an array is by using an array literal [ ].

// empty array
const myList = [ ];
// array of numbers
const numberArray = [ 2, 4, 6, 8];

MAMANSKI3
// array of strings
const stringArray = [ 'eat', 'work', 'sleep’];
// array with mixed data types
const newData = ['work', 'exercise', 1, true];
 How to create an Array

You can also store arrays, functions and other objects inside
an array. For example,

const newData = [ {'task1': 'exercise’},

[1, 2 ,3],
function hello() {

MAMANSKI3
console.log('hello’)
}
];
 What’s in it for you?

MAMANSKI3
How to create Access Elements Add an Element Change the Remove an
an Array of an Array to an Array Elements of an Element from an
Array Array
Access Elements of an Array

MAMANSKI3
 Access Elements of an Array

You can access elements of an array using

indices (0, 1, 2 …). For example,

const myArray = ['h', 'e', 'l', 'l', 'o’];

// first element console.log(myArray[0]); // "h"

MAMANSKI3
// second element console.log(myArray[1]); // "e"
Access Elements of an Array

You can access elements of an array using

indices (0, 1, 2 …). For example,

MAMANSKI3
Note: Array's index starts with 0, not 1.
 What’s in it for you?

MAMANSKI3
How to create Access Elements Add an Element Change the Remove an
an Array of an Array to an Array Elements of an Element from an
Array Array
Add an Element to an Array

MAMANSKI3
 Add an Element to an Array

You can use the built-in method push() and unshift() to add elements to an
array.
The push() method adds an element at the end of the array. For example,

let dailyActivities = ['eat', 'sleep’]; // add an element at the end

dailyActivities.push('exercise’);
console.log(dailyActivities); // ['eat', 'sleep', 'exercise’]

MAMANSKI3
The unshift() method adds an element at the beginning of the array. For example,

let dailyActivities = ['eat', 'sleep’]; //add an element at the start

dailyActivities.unshift('work’);
console.log(dailyActivities); // ['work', 'eat', 'sleep’]
 What’s in it for you?

MAMANSKI3
How to create Access Elements Add an Element Change the Remove an
an Array of an Array to an Array Elements of an Element from an
Array Array
Change the Elements of an
Array

MAMANSKI3
 Change the Elements of an Array

You can also add elements or change the elements by accessing the index value.

let dailyActivities = [ 'eat', 'sleep’];

// this will add the new element 'exercise' at the 2 index
dailyActivities[2] = 'exercise’;
console.log(dailyActivities); // ['eat', 'sleep', 'exercise’]

Suppose, an array has two elements. If you try to add an element at index 3 (fourth element), the
third element will be undefined. For example,

MAMANSKI3
let dailyActivities = [ 'eat', 'sleep’];

// this will add the new element 'exercise' at the 3 index

dailyActivities[3] = 'exercise’;

console.log(dailyActivities); // ["eat", "sleep", undefined, "exercise"]

 What’s in it for you?

MAMANSKI3
How to create Access Elements Add an Element Change the Remove an
an Array of an Array to an Array Elements of an Element from an
Array Array
Remove an Element
from an Array

MAMANSKI3
 Remove an Element from an Array

You can use the pop() method to remove the last element from an array. The pop() method also
returns the returned value. For example,

let dailyActivities = ['work', 'eat', 'sleep', 'exercise’];

// remove the last element dailyActivities.pop();

console.log(dailyActivities); // ['work', 'eat', 'sleep’]

// remove the last element from ['work', 'eat', 'sleep’]

const removedElement = dailyActivities.pop();

MAMANSKI3
//get removed element
console.log(removedElement); // 'sleep’
console.log(dailyActivities); // ['work', 'eat’]
 Remove an Element from an Array

If you need to remove the first element, you can use the shift() method. The shift() method
removes the first element and also returns the removed element. For example,

let dailyActivities = ['work', 'eat', 'sleep’];

// remove the first element

dailyActivities.shift();
console.log(dailyActivities); // ['eat', 'sleep’]

MAMANSKI3
 Array Length

Array length

You can find the length of an element (the number of elements in an array) using
the length property. For example,

const dailyActivities = [ 'eat', 'sleep’];

// this gives the total number of elements in an array

MAMANSKI3
console.log(dailyActivities.length); // 2
 Array Method

Method Description Method Description

joins two or more arrays and returns a
concat() result unshift() adds a new element to the beginning of an
array and returns the new length of an array
indexOf() searches an element of an array and
returns its position
removes the last element of an array and
pop() returns the removed element
returns the first value of an array
find() element that passes a test
removes the first element of an array and
returns the first index of an array shift() returns the removed element
findIndex() element that passes a test

MAMANSKI3
forEach() calls a function for each element sort() sorts the elements alphabetically in strings
and in ascending order
checks if an array contains a specified
includes() element selects the part of an array and returns the
slice() new array
aads a new element to the end of an
push() array and returns the new length of an removes or replaces existing elements and/or
array splice() adds new elements
 Array Method

let dailyActivities = ['sleep', 'work', 'exercise’]

let newRoutine = ['eat’];

// sorting elements in the alphabetical order

dailyActivities.sort();
console.log(dailyActivities); // ['exercise', 'sleep', 'work’]

//finding the index position of string

const position = dailyActivities.indexOf('work’);
console.log(position); // 2

MAMANSKI3
// slicing the array elements
const newDailyActivities = dailyActivities.slice(1);
console.log(newDailyActivities); // [ 'sleep', 'work’]
// concatenating two arrays
const routine = dailyActivities.concat(newRoutine);
console.log(routine); // ["exercise", "sleep", "work", "eat"]