JavaScript ARRAY Principle You Must Know!

Zahirul Islam Akash
4 min readMay 5, 2021

JavaScript is a high-level programming language. In old JavaScript only use for Client Side web interaction but now JavaScript is used Front-end and Back-end Both. JavaScript is more powerful language which have many many Framework and Libraries. Advantage of JavaScript are:

Speed. Client-side JavaScript is very fast because it can be run immediately within the client-side browser. Unless outside resources are required, JavaScript is unhindered by network calls to a backend serve.

Now i will share some principle of JavaScript that you need to know well for play with JavaScript.

ARRAY

Array is a list like of JavaScript Object, most used JavaScript Method that we use.

Its a Simple Array

let friendName = ['Najmul', 'Tanvir', 'Mahtab']

when you declare a variable but its have multiple elements, you must use Array. Here 'Najmul', 'Tanvir', 'Mahtab' are single elements of friendName array.

Access an Array item using the index position

let friendName = ['Najmul', 'Tanvir', 'Mahtab']
let first = friendsName[0];
it return you Najmul.

Array index is count from 0 — n. First element of an Array index is 0.

Array.push()

push() is commonly use for adding an element to an array. Example: are 3let friendName = ['Najmul', 'Tanvir', 'Mahtab'] element of an Array now but after you will need to add a new friend 'Mahbub'. Now we add new friend to this array using pop. Example:

let friendName = ['Najmul', 'Tanvir', 'Mahtab']
friendName.push('Mahbub');
console.log(friendsName);
it returns 'Najmul', 'Tanvir', 'Mahtab' 'Mahbub'

Remember , push() will add an element in end of an array.

Array.pop()

pop() is exactly doing same thing but in a reverse way. It will remove last element from an array. Example:

let friendName = ['Najmul', 'Tanvir', 'Mahtab']
friendName.pop();
console.log(friendsName);
it returns 'Najmul', 'Tanvir', 'Mahtab'

last element is removed from this array friendsName :D

Array.concat()

Its a very interseting. Imagine, You have two group of friends 1. Unversity friends and 2. Neighborhood friends , now you want to merge them in a one group. concat will do for you magically.

The concat() method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.

let universityFriend = ['Rahim', 'Karim', 'Nihsan', 'Turjo'];
let NeighborhoodFriend = ['Najmul', 'Tanvir', 'Mahtab']
let weAreOne = universityFriend.concat(NeighborhoodFriend);
console.log(weAreOne);
it return
['Rahim', 'Karim', 'Nihsan', 'Turjo', 'Najmul', 'Tanvir', 'Mahtab']

Array.filter()

Array filter() method is very commonly used method of Array. Its filter an elemnt which you exactly want to catch.

Imagine, you have a number of Array, you just want filter specific number which is bigger than 22. Example:

let numbers = [15, 17, 20, 25, 47, 33];
let number = numbers.filter(number => number > 22);
console.log(number)

Function is a predicate, to test each element of the array. Return a value that coerces to true to keep the element, or to false otherwise.

Array.find()

filter() and find() almost the same, but difference is filter() will return a new array which is satisfies condition on or more but find() will give you first element of array which is satisfies on condition. Example:

let numbers2 = [15, 17, 20, 25, 47, 33];
let number2 = numbers2.find(number => number > 22);
console.log(number)
it will return 25

47, 33 also satisfies the condition but it will be never return because find will give you only first satisfied condition of Array.

Array.indexOf()

indexOf() method is detects the position of element in Array.The indexOf() method returns the first index at which element can be found in the array, or -1 if it can not be found. Example:

let animal = ['cow', 'goat', 'tiger', 'lion', 'deer'];
animal.indexOf('tiger');
it will return 2

The index to start the search at. If the index is greater than or equal to the array’s length, -1 is returned, which means the array will not be searched.

Array.map()

map() is mostly used method. It returns a new Array with the results of calling a provided function on every single element in the calling array.

let animals = ['cow', 'goat', 'tiger', 'lion', 'deer'];
let animal1 = animals.map(animal => animal);
console.log(animal1);it will return ['cow', 'goat', 'tiger', 'lion', 'deer'];

when Callback Function that is called for every element of Array. Each time Callback executes, the returned value is added to newArray.

Array.slice()

slice() method is like cut an Array like a bread of a piece, it will give you a new Array without modify your existing original Array. But slice() method take 2 parameter Start point and end point Example:

array.slice(start? end)

Real example:

let animals = ['cow', 'goat', 'tiger', 'lion', 'deer'];
let animal = animals.slice(2, 4);
console.log(animal)it will return ["tiger", "lion"]

start point will remove before the element of start and end will remove element after end position.

Array.forEach()

forEach() is a method that you give each element of an Array individually. If you have an Array and you want to get each individual element without for and while syntax you can try it. Example:

let animals = ['cow', 'goat', 'tiger', 'lion', 'deer'];
animals.forEach(animal => console.log(animal));
it will return :
cow
goat
tiger
lion
deer

The forEach() method executes a provided function once for each array element.

<<<BONUS>>>

String.toLowerCase()

You can turn your every uppercase sentence to Lowercase simply. The toLowerCase method returns the value of the string converted to lower case. toLowerCase does not affect the value of the string itself.

let text = 'I am JavaScript Lover';
console.log(text.toLowerCase());
it will return iam javascript lover;

String.toUpperCase()

toUpperCase is almost the same like toLowerCase but Reverse way. The toUpperCase method returns the calling string value converted to uppercase value will be converted to a string if it isn't one.

let text = 'I am JavaScript Lover';
console.log(text.toUpperCase());
it will return I AM JAVASCRIPT LOVER;

A new string representing the calling string converted to upper case.

--

--