Let’s Play With JavaScript Array

1.0 — Do you know what is array? 🙋🏼

Array is one kind of variable where we can store multiple data in a single variable. Arrays are used when we want to access elements in an orderly fashion using a single variable. We can store strings, boolean and numbers in a single array.

What we can store in JavaScript array????

JavaScript array is dynamic array. Do you know, what does dynamic array mean? 🤷

Dynamic array means:

• Don’t need to specific array length.
• Dynamically increase or decrease array size.
• Don’t need to collected garbage.
• Can store any kind of data.

store different types of data

Step-1 : Create an instance :

let arr = [] // initialize an array

Step-2 : Add elements

let arr = [] // initialize an array
arr[0] = 'Karim'
arr[1] = 'Rahim'
arr[2] = 'Selim'
arr[3] = 'Jasim'
console.log(arr);
// expected output:
[ 'Karim', 'Rahim', 'Selim', 'Jasim' ]

Now I will discuss some of the array methods with you.

1.1.1 — Push()

Generally push() method used to add one or more elements in an array to the position of end. Noted that, this method changes the length of an array.

//Example = 1
const students = ['Fayez', 'Morshed', 'Sakib', 'Abraul'];
const NewStudent = students.push('Riyad');
console.log(students);
// expected output:
[ 'Fayez', 'Morshed', 'Sakib', 'Abraul', 'Riyad' ]
//===============================================================
//Example = 2
const students = ['Fayez', 'Morshed', 'Sakib', 'Abraul'];
const NewStudent = students.push('Riyad', 'Shahed', 'Mehedi');
console.log(students);
// expected output:
[ 'Fayez', 'Morshed', 'Sakib', 'Abraul', 'Riyad', 'Shahed', 'Mehedi' ]

1.1.2 — Pop()

Generally pop() method used to remove one items or element from an array to the position of end. Noted that, this method changes the length of an array.

//Example = 1
const students = ['Fayez', 'Morshed', 'Sakib', 'Abraul'];
const NewStudent = students.push();
console.log(students);
// expected output:
[ 'Fayez', 'Morshed', 'Sakib'];

1.1.3 — Shift()

Generally shift() method used to remove an item or element from the beginning of an array collection. Noted that, this method will change the original array.

//Example = 1
const students = ['Fayez', 'Morshed', 'Sakib', 'Abraul'];
const NewStudent = students.shift();
console.log(students);
// expected output:
[ 'Morshed', 'Sakib', 'Abraul' ]

1.1.4— Unshift()

Generally unshift() method used to add one or more elements of an array to the position of beginning. Noted that, this method will change the original array.

//Example = 1
const students = ['Fayez', 'Morshed', 'Sakib', 'Abraul'];
const NewStudent = students.unshift('Kamrul');
console.log(students);
// expected output:
[ ‘Kamrul’, 'Morshed', 'Sakib', 'Abraul' ]
//===============================================================
//Example = 2
const students = ['Fayez', 'Morshed', 'Sakib', 'Abraul'];
const NewStudent = students.unshift('Kamrul', 'Shahed', 'Mehedi');
console.log(students);
// expected output:
[
  'Kamrul',  'Shahed',
  'Mehedi',  'Fayez',
  'Morshed', 'Sakib',
  'Abraul'
]

1.3 — Find()

find() method is used to get the value of the first element in the array that satisfies the provided condition. It checks all the elements of the array and whichever the first element satisfies the condition is going to print.

/Example = 1
const number = [5, 12, 8, 130, 44];
const checkFind = number.find(element => element > 10);
console.log(checkFind);
// expected output:
12

1.4 — Filter()

The filter () method used to search or filter elements from an array conditionally. Noted that, filter() method does not change the original array.

/Example = 1
const pHero = [
{studentName: "Foyez",
 Marks: 50},
{studentName: "Monsur",
 Marks: 55},
{studentName: "Rakib",
 Marks: 45}
]
const filterStudent = pHero.filter(stu => stu.Marks >= 50);
console.log(filterStudent);
// expected output:
[
  { studentName: 'Foyez', Marks: 50 },
  { studentName: 'Monsur', Marks: 55 }
]

1.5 — Map()

The map() method creates a new array with the results of calling a function for every array element. The map() method calls the provided function once for each element in an array, in order. Note: map() does not execute the function for array elements without values.

/Example = 1
const pHero = [
{studentName: "Foyez",
 Marks: 50},
{studentName: "Monsur",
 Marks: 55},
{studentName: "Rakib",
 Marks: 45}
]
const checkMap = pHero.map(stu => stu);
console.log(checkMap);
// expected output:
[
  { studentName: 'Foyez', Marks: 50 },
  { studentName: 'Monsur', Marks: 55 },
  { studentName: 'Rakib', Marks: 45 }
]

1.6 — ForEach()

forEach() method calls the provided function once for each element of the array. The provided function may perform any kind of operation on the elements of the given array

/Syntax
arrayName.forEach(num => {
  //coding
});
//example = 1
const number = [14, 12, 36, 52, 14, 23, 32, 24];
number.forEach(num => {
   console.log(num)
});
// expected output:
14
12
36
52
14
23
32
24

1.7 — Reduce()

reduce() method in JavaScript is used to reduce the array to a single value and executes a provided function for each value of the array (from left-to-right) and the return value of the function is stored in an accumulator.

//example = 1
const number = [14, 2, 6, 5];
const checkReduce = number.reduce((accumulator, currentValue) => accumulator + currentValue);
console.log(checkReduce)
// expected output:
27

1.8 — Concat()

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.

//example = 1
const country = ['Bangladesh', 'India'];
const capital = ['Dhaka', 'Dhilli'];
const newState = country.concat(capital);
console.log(newState);
// expected output:
[ 'Bangladesh', 'India', 'Dhaka', 'Dhilli' ]

1.9 — Slice()

slice() method returns a new array containing a portion of the array on which it is implemented. The original remains unchanged.

/Syntax
arrayName.slice(begin, end)
//example = 1
const friends = ['Fayez', 'Morshed', 'Rahim', 'Karim', 'Shihad', 'Manik'];
const checkSlice = friends.slice(1, 3);
// expected output:
[ 'Morshed', 'Rahim' ]

1.10 — Splice()

The splice() method adds/removes items to/from an array, and returns the removed item(s). Noted that, splice() method changes the original array.

/Syntax
arrayName.slice(begin, end)
//example = 1
const friends = ['Fayez', 'Morshed', 'Rahim', 'Karim', 'Shihad', 'Manik'];
const checkSplice = friends.splice(2, 0, 'Sakib');
// expected output:
//here add new element in array collection at idexOf 2
[
  'Fayez', 'Morshed',
  'Sakib', 'Rahim',
  'Karim', 'Shihad',
  'Manik'
]

Thank you for give me your valuable time & reading my blog.❤