Array and it's methods in JavaScript

Introduction to Arrays in JS

An array is a data structure in JavaScript that enables you to store and manage a set of values. It is a technique for combining related data under a single variable name.

Arrays in JavaScript are dynamic, which means you can add or remove elements from them at runtime.

Arrays in JavaScript can be defined in several ways:

1. Using square brackets:

    const myArray = [1, 2, 3, 4, 5];
   

2. Using the new keyword:

    const myArray = new Array(1, 2, 3, 4, 5);
   

3. Using the Array.from() method:

    const myArray = Array.from([1, 2, 3, 4, 5]);
   

Arrays in JavaScript can contain any type of data, including other arrays, objects, and functions. The elements in an array are indexed starting from 0, so the first element in the array can be accessed with myArray[0].

Array Method

Length

1. The length property determines or returns the array's element count.

2. Syntax: array.length

names = ["loe", "joe", "zoe", "tom"]
console.log(names.length); // Length of Array
// OP: 4

Push

1. Adds new items to the end of an array.

2. Changes the length of the array.

3. Syntax: array.push("Values")

names = ["loe", "joe", "zoe", "tom"]
names.push("bob")
console.log(names); 
// OP: ["loe", "joe", "zoe", "tom", "bob"]

Slice

1. Returns selected elements in an array, as a new array.

2. Selects from start to end(not inclusive)

3. Did not change the original array.

4. Syntax: array.slice(start, end)

names = ["loe", "joe", "zoe", "tom"]
array.slice(1, 3)
console.log(names); 
// OP: ["joe", "zoe"]

Splice

1. Adds and/or removes array elements.

2. Overwrites the original array.

3. syntax: array.splice(index, howmany, item1, ....., itemX)

   index: from ehere to start

   howmany: how many to del

   items: list of items

names = ["loe", "joe", "zoe", "tom"]
names.splice(2, 0, "lilo")
console.log(names); 
// OP: ["loe", "joe", "lilo", "zoe", "tom", "bob"]

Concatenation

1. Join two or more arrays.

2. Returns a new array, containing the joined arrays.

3. Do not change the existing arrays.

4. Syntax: array1.concat(array2, array3, ..., arrayX)

name1 = ["loe", "joe"]
name2 = ["zoe", "tom"]
console.log(name1.concat(name2)); 
// OP: ["loe", "joe", "zoe", "tom"]

Fill

1. Fills specified elements in an array with a value.

2. Overwrites the original array.

3. Syntax: array.fill(value, start, end)

let arr = [1, 2, 3, 4, 5, 6, 7]
arr.fill('nandini', 2, 5)
console.log(arr)
// OP: [1, 2, 'nandini', 'nandini', 'nandini', 6, 7]

Includes

1. Returns true if an array contains a specified value.

2. Returns false if the value is not found.

3. Includes method is case sensitive.

4. array.includes(element, start)

   element: The value to search for

   start: Start position, default is 0.

let num = [1, 2, 3, 4, 5, 6, 7, 8];
console.log(num.includes(7, 7));
// OP: False

IndexOf

1. Returns the first index of a specified value.

2. Returns -1 if the value is not found.

3. Starts at a specified index and searches from left to right.

4. By default, the search starts at the first element and ends at the last.

5. Negative start values count from the last element (but still search from left to right).

6. Syntax: array.indexOf(item, start)

let num = [1, 2, 3, 'Nandini', 4, 5, 6, 7, 8, 'Nandini', 'Nandini'];
console.log(num.indexOf('Nandini'));
// OP: 3

lastindexOf

1. Returns the last index (position) of a specified value.

2. Returns -1 if the value is not found.

3. Starts at a specified index and searches from left to right.

4. By default, the search starts at the last element and ends at the first.

5. Negative start values count from the last element (but still search from left to right).

6. Syntax: array.lastIndexOf(item, start)

let num = [1, 2, 3, 'Nandini', 4, 5, 6, 7, 8, 'Nandini', 'Nandini'];
console.log(num.lastIndexOf('Nandini'));
// OP: 10

isArray

1. Returns true if an object is an array, otherwise false.

2. Syntax: Array.isArray(obj)

let num = [1, 2, 3, 'Nandini', 4, 5, 6, 7, 8, 'Nandini', 'Nandini'];
let num1 = 'Nandini';
console.log(Array.isArray(num1));
console.log(Array.isArray(num));

// OP
// false
// true

Map

1. Whatever is written inside the map will be linked with all the elements of an array

2. Creates a new array by calling a function for every array element.

3. Does not execute the function for empty elements.

4. Does not change the original array.

5. Syntax: array.map(function(currentValue, index, arr), thisValue)

   function(): Required, A function to be run for each array element.

   currentValue: Required, The value of the current element.

   index: Optional, The index of the current element.

   arr: Optional, The array of the current element.

   thisValue: Optional, Default value is undefined.

   A value passed to the function is to be used as this value.

let maths = [1, 4, 9, 16, 25];
console.log(maths.map(Math.sqrt));
// OP: [1, 2, 3, 4, 5]

Pop

1. 12.Removes the last element of an array.

2. Changes the original array.

3. Returns the removed element.

4. Syntax: array.pop()

let maths = [1, 4, 9, 16, 25];
console.log(maths.pop());
console.log(maths);

// OP
// 25
// [1, 4, 9, 16]

Reverse

1. Reverses the order of the elements in an array.

2. Overwrites the original array.

3. Syntax: array.reverse()

let maths = [1, 4, 9, 16, 25];
console.log(maths.reverse());
// OP: [25, 16, 9, 4, 1]

Shift

1. Removes the first item of an array.

2. Changes the original array.

3. Returns the shifted element.

4. Syntax: array.shift()

let maths = ['Nandini', 1, 4, 9, 16, 25];
console.log(maths.shift());
console.log(maths);

// OP
// Nandini
// [1, 4, 9, 16, 25]

unShift

1. Adds new elements to the beginning of an array.

2. Overwrites the original array.

3. Syntax: array.unshift(item1, item2, ..., itemX)

let fruit = ['Apple', 'Bada Apple', 'Chota Apple', 'Double Apple'];
fruit.unshift('Apple 1', 'Grapes 2');
console.log(fruit);

// OP: ['Apple 1', 'Grapes 2', 'Apple', 'Bada Apple', 'Chota Apple', 'Double Apple']

Join

1. Returns an array as a string.

2. Does not change the original array.

3. Syntax: array.join(separator)

   Any separator can be specified. The default is comma (,)

let Arr1 = [1, 2, 3, 4, 5, 6, 7];
let var1 = Arr1.join(' | ');
console.log(var1);
console.log(typeof var1);

// OP
// 1 | 2 | 3 | 4 | 5 | 6 | 7
// string

Sort

1. Sorts the elements of an array.

2. Overwrites the original array.

3. Sorts the elements as strings in alphabetical and ascending order.

4. Syntax: array.sort()

let names = ['Hitesh Sir', 'Anurag', 'Surya', 'Anirudh', 'Bipul'];
console.log(names.sort());

// OP: ['Anirudh', 'Anurag', 'Bipul', 'Hitesh Sir', 'Surya']

At

1. Returns an indexed element from an array.

2. Does not change the original array.

3. Syntax: array.at(index)

   index: Optional, position of the array element to be returned, default is 0.
   -1 returns the last element.

names = ["loe", "joe", "zoe", "tom"]
console.log(names.at(2));
// OP: zoe

With these powerful array methods at your disposal, you can unlock the full potential of JavaScript and take your coding skills to the next level.