JavaScript: Array & Methods

JavaScript: Array & Methods

ARRAYYYS, are the most used data structure in our programming life, they're used to store ordered collections.

const arr = [ 'hey', "what's", 'up?' ];

console.log(arr);   // [ 'hey', "what's", 'up?' ]

Previously we've gone through Strings and their methods, now we are going for a quick reference to array and its methods.

So, we have declared an array, now the foremost thing to know is how we access any element from array, it's pretty simple, we need to mention the index (remember arrays are zero indexed so you must start counting the first element from zero) of any element of array in a square box.

const arr = [ 'I', "don't", 'like', 'strawberries' ];

const accessedElement = arr[2];

console.log(accessedElement) // 'like'

Arrays are basically object types, where we store data in key-value pairs, now you may think where's key in an array, the index we used to extract a certain element from the array is key my friend, and the value we get in return is its value.


Methods

length => it returns the length of an array

const arr = [ 'I', "don't", 'like', 'strawberries' ];

console.log(arr.length); // 4

pop() => It removes/extracts last element from the array

const arr = [ 'I', "don't", 'like', 'strawberries' ];

const poppedElement = arr.pop(); //  'strawberries'

push() => It adds element to the end of array

const newArr = arr.push(poppedElement);

console.log(newArr); // [ 'I', "don't", 'like', 'strawberries' ];

shift() => it removes first element from the array

const arr = [ 'I', "don't", 'like', 'strawberries' ];

const shiftedElement = arr.shift(); // 'I'

unshift() => It adds element to the start of array

const newArr = arr.unshift(shiftedElement);

console.log(newArr); // [ 'I', "don't", 'like', 'strawberries' ];

Now, if you go by the name, shift and unshift may confuse you as they are totally opposite of their naming behaviour.

splice() => It insert, removes, replaces elements from the array and returns the array of removed elements, a multipurpose method to know

splice(start[deleteCount, elem1, ....., elemN )

It alters the array from start, removes deleteCount and inserts elem1, ....., elemN

const arr = [ 'I', "don't", 'like', 'strawberries' ];

const splicedArr = arr.splice(1,1,"do");

console.log(arr); // ['i', 'do', 'like', 'strawberries']
console.log(splicedArr); // ["don't"]

Here it starts from the 1st index removes one item, as delete count is 0, and inserts 'do' at 1st index, and returned the spliced array.

It also inserts element without deletion, for that we need to set deleteCount to 0.

const arr = [ 'I', 'do', 'like', 'strawberries' ];

const newSplicedArr = arr.splice(3, 0, 'mangoes', 'and' );

console.log(newSplicedArr); // [] as it doesn't removed anything
console.log(arr); // [ 'i', 'do', 'like', 'mangoes', 'and', 'strawberries' ]

slice() => returns a new array, starting from start index to end leaving the end one

const arr = [ 'I', 'do', 'like', 'mangoes', 'and', 'strawberries' ];

const slicedArr = arr.slice(3,5);

console.log(slicedArr); // [ 'mangoes', 'and' ]

It can also be used without arguements ( i.e slice() ) to copy the whole array for further array transformations.

concat() => It creates a new array that have values from another arrays and additional elements

arr.concat(arg1, arg2, ....., argN);

It accepts any number of arguements, either arrays or values.

const arr = [ 'I', "don't", 'like', 'strawberries' ];

const  concatedArr = arr.concat(['and'], 'kiwi');

console.log(concatedArr); // [ 'I', "don't", 'like', 'strawberries' , 'and', 'kiwi' ];

Since this article is getting big, so I will continue the left ones in next part of this, thanks for reading this till here, hope this helps in your programming journey.

BYE, FOR NOW