How to Play with Arrays in JavaScript Like a Pro?

1. How to Create an Array in JavaScript?

You can use ‘[ ] symbol’ to create an array in JavaScript.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
console.log(cars)
// ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche']

2. How to Check Array Length in JavaScript?

You can check total numbers of items defined in an array by using the method below.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
console.log(cars.length)
// 8

3. How to Access Array Item using Index Number in JavaScript?

You can use the specific number to access the item in an array, like given below.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
console.log(cars[0])
// Tesla
console.log(cars[4])
// Ford
console.log(cars[6])
// Nissan

4. How to Access the Last Item in an Array in JavaScript?

You can access the last item of an array by using the below method.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
console.log(cars[cars.length - 1])
// Porsche

5. How to Run a Loop Over an Array in JavaScript?

Best and modern way to loop through an Array item in JavaScript.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
cars.forEach(function(arrayItem, index){
  console.log(arrayItem, index)
})
// Tesla 0
// Toyota 1
// BMW 2
// Honda 3
// Ford 4
// Hyundai 5
// Nissan 6
// Porsche 7

6. How to Add an Item to the Starting of an Array in JavaScript?

You can add an item at the starting point of an array.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
// unshift() method adds 'Mercedes' to the starting of 'cars' array
var newArray = cars.unshift('Mercedes') 
console.log(cars)
// New cars array
// [ 'Mercedes', 'Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche' ]

7. How to Remove an Item from the Starting of an Array in JavaScript?

You can also remove an item from the starting point of an array.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
// shift() method removes the first item from the array
var newArray = cars.shift() 
console.log(cars)
// New cars array
// Tesla has been removed from the array
// [ 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche' ]

8. How to Find the Index of an Item in an Array in JavaScript?

You can find the index number of a particular item in an array.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];
// indexOf() method returns the index number of an item in an array
var getBMWIndex = cars.indexOf('BMW');
var getHyundaiIndex = cars.indexOf('Hyundai');
var getPorscheIndex = cars.indexOf('Porsche');
console.log(getBMWIndex)
// 2
console.log(getHyundaiIndex)
// 5
console.log(getPorscheIndex)
// 7

Conclusion

In this article, I have discussed the basic features and methods of an array in javascript.

We learn to create an array, access the item, find out the position of an item, remove an item, add an item and run a loop over an array.

In this tutorial, I’ve covered the basics of an array. I’ll talk about more advanced methods in the near future or you can visit MDN Web Docs to explore more.

Meanwhile, If I’ve left something then do let me know, it’ll help me to improve this topic. Thanks in advance.