JavaScript Arrays

In JavaScript, an array is a special kind of object that stores a collection of items.

The items can be of any data type, including numbers, strings, and other objects.

Arrays are accessed using numerical indices, and they are zero-indexed, meaning that the first item in the array has an index of 0, the second item has an index of 1, and so on.

Arrays in JavaScript are dynamic, meaning that they can grow or shrink in size as needed.

They are widely used in JavaScript to store and manipulate data in various ways, such as in loops, to sort data, and to filter data.

Creating an Array

There are several ways to create an array in JavaScript:

  • Using the Array constructor:
    var arr = new Array();

  • Using an array literal:
    var arr = [];
    var arr = [1, 2, 3, 4, 5];

  • Using the Array.of() method:
    var arr = Array.of(1, 2, 3, 4, 5);

  • Using the Array.from() method:
    var arr = Array.from("abcdef");

  • Using the spread operator:
    var arr1 = [1, 2, 3];
    var arr2 = [...arr1, 4, 5];

In all the above examples, it creates an empty array or an array with values depending on the method used to create it.

Here are examples of each way to create an array in JavaScript:

Using the Array constructor:

var arr = new Array(); // creates an empty array
var arr = new Array(1, 2, 3, 4, 5); // creates an array with the values 1, 2, 3, 4, 5
var arr = new Array(5); // creates an array with 5 empty slots

Using an array literal:

var arr = []; // creates an empty array
var arr = [1, 2, 3, 4, 5]; // creates an array with the values 1, 2, 3, 4, 5

Using the Array.of() method:

var arr = Array.of(1, 2, 3, 4, 5); // creates an array with the values 1, 2, 3, 4, 5

Using the Array.from() method:

var str = "abcdef";
var arr = Array.from(str); // creates an array with the values "a", "b", "c", "d", "e", "f"

Using the spread operator:

var arr1 = [1, 2, 3];
var arr2 = [...arr1, 4, 5]; // creates an array with the values 1, 2, 3, 4, 5

In all the above examples, it creates an empty array or an array with values depending on the method used to create it.

Accessing Array Elements

In JavaScript, you can access an array element by using its index.

The index is the numerical position of an item in the array, and it is zero-based, which means that the first item has an index of 0, the second item has an index of 1, and so on.

Here's an example:

var arr = [1, 2, 3, 4, 5];
console.log(arr[0]); // Output: 1
console.log(arr[1]); // Output: 2
console.log(arr[2]); // Output: 3

You can also use a variable as the index:

var index = 2;
console.log(arr[index]); // Output: 3

You can also use negative indices which will access the element from the end of the array:

console.log(arr[-1]); // Output: 5
console.log(arr[-2]); // Output: 4

You can also use the Array.prototype.slice() method to access multiple elements of an array at once:

var subArr = arr.slice(1,3); // Output: [2,3]

You can also use the Array.prototype.splice() method to remove and add elements at specific index:

arr.splice(1,1); // remove element at index 1
console.log(arr); // Output: [1,3,4,5]

It's important to note that if you try to access an index that does not exist in the array, you will get undefined as the output.

Array Elements Can Be Objects

In JavaScript, an array element can be an object just like any other data type such as a number or a string.

You can create an array of objects and access the properties of the objects using the array index and the dot notation.

Here is an example:

var arr = [ {name: "John", age: 30}, {name: "Jane", age: 25}, {name: "Bob", age: 35}];
console.log(arr[0].name); // Output: "John"
console.log(arr[1].age); // Output: 25

You can also use a variable as the index:

var index = 2;
console.log(arr[index].name); // Output: "Bob"

You can also use the forEach method to loop through the array and access the properties of the objects:

arr.forEach(function(item){
  console.log(item.name);
});

You can also use the map method to create a new array with the properties of the objects:

var names = arr.map(function(item){
  return item.name;
});
console.log(names); // Output: ["John", "Jane", "Bob"]

You can also use the filter method to filter the array with the properties of the objects:

var filteredArr = arr.filter(function(item){
  return item.age > 30;
});
console.log(filteredArr); // Output: [{name: "Bob", age: 35}]

As you can see, using arrays with objects allows you to store and manipulate data in a structured and efficient way.

Array Properties and Methods

In JavaScript, an array is an object, so it has properties and methods that can be used to manipulate the data stored in the array.

Properties are values that describe the array, such as its length or a reference to its prototype.

Here are some examples of array properties:

  • length: returns the number of elements in the array
  • prototype: allows you to add new properties and methods to the array object

Methods are functions that can be called on the array to perform specific actions, such as adding or removing elements, sorting or reversing the array.

Here are some examples of array methods:

  • push() : adds one or more elements to the end of the array.
  • pop() : removes the last element of the array.
  • shift() : removes the first element of the array.
  • unshift() : adds one or more elements to the beginning of the array.
  • slice() : returns a new array with a copy of a portion of the original array.
  • splice() : adds and/or removes elements from the array.
  • sort() : sorts the elements of the array.
  • reverse() : reverses the order of the elements in the array.
  • concat() : joins two or more arrays.
  • indexOf() : returns the first index at which a given element can be found in the array, or -1 if it is not present.
  • forEach() : executes a provided function once for each array element.
  • map() : creates a new array with the results of calling a provided function on every element in this array.
  • filter() : creates a new array with all elements that pass the test implemented by the provided function.

This is just a small sample of the many properties and methods available for arrays in JavaScript. Each method has its own specific use case and should be used accordingly.

JS Basics