A must learn JavaScript array methods

introduction to arrays

The proper organisation and storing of data is called a data structure.

The use of data structure is very common in the field of software engineering.

The use of data structures is applicable in almost all the programs and soft wares from eCommerce applications to puzzle games

The data is stored in a programmatic way hence can be used efficiently

Data structures allows for efficiency in:

• searching data
• faster processing speed
• multitasking and requesting

Since the storing of data is made in an organised way,

we can have various operations applied to the data structure such as adding,subtracting,etc

Data Structure comes hand in hand with algorithms which is a step by step procedure for solving a problem,

The various algorithms applied on a data structure may include

• searching – searches for an item in a data structure
• inserting – inserts an item in a data structure
• deleting – deletes an item in a data structure
• sorting – sorts the items in the data structure
• updating – updates the items in the data structure

Hence its easier to solve computer problems.

Data structures and algorithms is a very essential area of concern to computer scientists and software engineers.

Since they aid in approaching a problem in a number of ways and solving the problem in an easier and faster way.

Before we begin lets tackle one problem from code wars on the application of data structures and algorithm in order to have an in depth understanding

Problem

If we list all the natural numbers below 10 that are multiples of 3 or 5, we get 3, 5, 6 and 9. The sum of these multiples is 23.

Finish the solution so that it returns the sum of all the multiples of 3 or 5 below the number passed in. Additionally, if the number is negative, return 0 (for languages that do have them).

Note: If the number is a multiple of both 3 and 5, only count it once.

Now here is our data structure problem that we need to tackle.

Program break down/data structure

• Our program here sorts the numbers and then returns those that are multiples of 3 or 5
• After getting those that are divisors of 3 or 5 we find their sum

solution/algorithm

• we first declare a function with the number as the parameter

• then we define a loop that is going to start form zero and end at the parameter given

• then we use an if statement to check whether the loop of number is divisible by 3 or 5

• if the condition is satisfied then we proceed to add the numbers generated

program

function solution(number){
  let x =[]
  for(let i=3; i<number; i++){   
    if(i % 3 == 0 || i % 5 ==0 ){
      x.push(i)
    }
  }
  return x.reduce((a,b)=> a+b,0)  
}

From the above we see how data structure and algorithm is used to solve the programming problems.

Arrays

An array is one type of a data structure.

This means that the data in the array can be:

• organised
• retrieved
• processed
• stored

Array

First lets get to know what an array is.

An array is a variable that holds different values at different indexes holding items of the same data type

The values may include numbers,strings,boolean values.

We can access these arrays easily using their indexes.

Lets have an array X holding different values containing numbers and strings.

Let x = ['house',34,'jesicah',true,34,67,8]

In our example above our array contains the different numbers,a boolean and strings and the name of the array is X

The values in the arrays contain different indexes i.e from 0 going onwards.

The first index which is 0 is the first element from the left hand side that is ‘house’.

The array X here stores and holds the different values.

Now lets get back to our topic of discussion today.

Since an array is a type of data structure , we can perform different operation in it such as addition,subtraction,multiplication etc.

What are JavaScript array methods?

First lets get to know what a method is.

A method is an inbuilt array function applied to an array to easen our operation on the array.

The work load here may include:

• getting the sum of an array
• removing an item from an array
• finding an item in an array
• sorting the array
• comparing the arrays
• joining two different arrays

So instead of writing the function from scratch we will use an array method to solve our problem.

For example if we wanted to get the sum the numbers in an array we would create our function and loop in through the array in order to get the sum.

But using an array method gives us an easier root to use to get our sum.

METHODS

The common methods include:

Ill show you how to use these methods and their practical examples in the practical real world situation

First lets create an array of numbers

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]

1 reverse() – returns the inverse of the array, the last index comes to the first and vice versa

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.reverse()) // [
  24, 234, 56, 1000,
  66,   5,  4,    3,
  12,   1
]

2 slice() – returns the selected items in an array as the new object

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]



//console.log(array.slice(start, end))

console.log(array.slice(2, 4)) // [ 3, 4, 5, 66 ]

3 push() – used to add an element into an array

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
array.push('ian')
console.log(array) // [
  1,    12,    3,
  4,    5,     66,
  1000, 56,    234,
  24,   'ian'
]

4 concat() – used to join two or more arrays

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]

let array1 = [11, 112, 311, 41, 53, 636, 10, 5, 2]
console.log(array.concat(array1)) // [
    1,   12,   3,   4,  5,
   66, 1000,  56, 234, 24,
   11,  112, 311,  41, 53,
  636,   10,   5,   2
]

5 includes() – determines whether an array contains a specified element return type is a Boolean

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.includes(5)) // true since 5 is an element of the array

6 map() – creates a new array with the result of calling the function provided

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.map((array) => array * 10)) // [
     10, 120,   30,
     40,  50,  660,
  10000, 560, 2340,
    240
]

7 sort() – rearanges the array in the correct order

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.sort((a, b) => a - b)) // sorts in an ascending order [
    1,    3,  4,  5,
   12,   24, 56, 66,
  234, 1000
]

8 toString() – converts the array values to strings

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.toString()) // 1,12,3,4,5,66,1000,56,234,24

9 forEach() – used to loops through each element in an array but uses a function

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
array.forEach((array) => console.log(array)) /* 1
12
3
4
5
66
1000
56
234
24 
*/

10 findIndex() – returns the index of an array satisfying the condition or -1 if not found

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.findIndex(array => array === 4)) // 3

11 find() – returns the element in an array satisfying the condition or undefined if not found

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.find(array => array === 4)) // 4

12 filter() – creates a new element with all arrays that pass the test

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.filter(array => array % 2 !== 0)) // [ 1, 3, 5 ]

13 fill() – fills all array values with a static value defined

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.fill(11)) // [
  11, 11, 11, 11, 11,
  11, 11, 11, 11, 11
]

14 every() – returns true if the condition is correct

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.every(array => array == 3)) //false

15 join() – returns the elements separated by a specific separator

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.join(' ')) // returns 1 12 3 4 5 66 1000 56 234 24

16 length – returns the length of an array

let array = [1, 12, 3, 4, 5, 66, 1000, 56, 234, 24]
console.log(array.length) // returns 10

From this article we see how the searching, sorting,inserting,deleting and updating of data in the array is possible since there is an implementation of a data structure : array

the data in the array has been organised well hence the application of the above algorithms have been made easier, more efficient and more practical

The combination of these methods is possible in one array in order to get the desired out put in a simpler way.

You can keep on practicing more and more on data structures and algorithms to gauge your mind more

That’s all on A must learn JavaScript array methods

Learn more here