JavaScript Arrays Final Words

Kinanee Samson - Dec 17 '20 - - Dev Community

This will be our final thoughts on JavaScript arrays.
In our last artivke we talked about arrays that holds object and other arrays as items(multi dimensional arrays). We saw that we could only use an integer as an index to an array, but not named identifiers. If we try to do that we also saw that the item would be added to the object property of the array instead of the items inside the array. You can check it Here if you missed it.

We will now look at more methods that are provided on the array object in JavaScript so we can familiarize our self with arrays and manipulating arrays.

Popping out the last item

We can remove the last item from an array (the item whose index is one less than the length of the array) by using a method pop() on the array. It simply removes the last item from in the array from the list of the items in the array. This example below clarifies it.

let myArr = [1,2,4]
myArr.pop()
//returns 4
Enter fullscreen mode Exit fullscreen mode

Shift Some Items

If we want to remove the first item in the array we can use array.shift() to remove the first item in an array, it is similar to the array.pop() only it removes the first item instead of the last.

let myArr = [2,4,6,8,10]
console.log(myArr.length)
//Prints out (5)
myArr.shift()
console.log(myArr)
//Prints out [4,6,8,10]
console.log(myArr.length)
//Prints out (4)
Enter fullscreen mode Exit fullscreen mode

From a List

We can convert an array-like item into an array using Array.from(arrayLikeObject), by "an array" here i mean items that we can loop through using a for loop e.g a node list. The key difference between an array and a node list or any other array like structure is that although you can use a for loop for both of them you, you can't use the methods we have been discussing in this series on only arrays!!!. Not nodelists or iterators.

//get a nodelist somehow
//let myArr = document.querySelector(selector)
let myNewArr = Array.from(myArr)
//now we can use the array
//array methods on myNewArr
Enter fullscreen mode Exit fullscreen mode

Printing an array

We do not always have to use console.log(array) to display the contents of an array. We cab use array.toString() on an array and this function simply prints out the items inside an array.

let myArr = [2,3,4,5]
myArr.toString()
//prints out 2,3,4,5
Enter fullscreen mode Exit fullscreen mode

Every Item?

We can check if all the items in an array can pass a certain condition. It syntax is array.every(item => //check for a condition)
It accepts an item that represents each item in the array. Let's see an example

let myArr = [2,3,4,5]
myArr.every(item => item > 0)
//it returns a boolean 
//true if all items pass the condition
//returns false if at least one or more of the items do
//pass the condition
Enter fullscreen mode Exit fullscreen mode

some Items

We can also check if some items in an array pass a certain test. We use array.some(item => //check for condition), returns a boolean if at least one item in the array passes the test.

let myArr = [2,3,4,5]
myArr.some(item => item > 4)
//returns true because
//5 is greater than 4. Only
//one item the array passed the test
Enter fullscreen mode Exit fullscreen mode

Merge an array

We can tack on a new array to a previous array and have a new array whose items is a combination of the both arrays
We use array.concat(array or array like object), I
It returns the new array
Let's see an example

let myArr = [2,3,4,5]
myArr.concat([6,7,8,9,10])
//prints out 2,3,4,5,6,7,8,9,10
Enter fullscreen mode Exit fullscreen mode

Sorting an array

We can also sort the items in an array, if they are integers the items are sorted in ascending order, while if they are strings they are sorted alphabetically. Its syntax is array.sort()

let myArr = [3,5,4,2]
myArr.sort()
//prints our 2,3,4 5
let myArr = ['foo','bar','goof','spunk','look','map']
myArr.sort()
//prints out 'bar','foo', 'look','map','spunk'
//we use unsort() to reverse
//the order if items in the array
Enter fullscreen mode Exit fullscreen mode

Filter an array

We can filter through an array and return a value, this method accepts a value which is item and the we can check the item against a condition and it returns the item that passes that test. If more than one item pass the test an array of those items is returned

let myArr = ['foo','bar','goof','spunk','look','map']
myArr.filter(item => item.match(/o/g))
//We use a regex here for the test
//forgive me if you are not familiar with reg ex
//we get ['foo','goof','look']
Enter fullscreen mode Exit fullscreen mode

This is it for these series . Hope you found it interesting and educative. Feel free to drop a word. We will focus on a this article next

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .