JavaScript - Array Methods

JavaScript - Array Methods

Introduction: In JavaScript, arrays are a fundamental data structure used to store multiple values in a single variable. JavaScript provides several built-in methods that allow you to manipulate arrays efficiently. These methods enable you to perform various operations such as adding, removing, and modifying elements within an array. In this documentation, we will explore some commonly used array methods in JavaScript along with code examples and explanations.

Table of Contents:

1. push() Method
2. pop() Method
3. shift() Method
4. unshift() Method
5. concat() Method
6. slice() Method
7. splice() Method
8. indexOf() Method
9. includes() Method
10. forEach() Method

1. push() Method: The push() method appends one or more elements to the end of an array and returns the new length of the array. It modifies the original array.

Code Example:

javascript
let fruits = ['apple', 'banana'];
fruits.push('orange', 'mango');
console.log(fruits); // Output: ['apple', 'banana', 'orange', 'mango']

2. pop() Method: The pop() method removes the last element from an array and returns that element. It modifies the original array.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange'];
let lastFruit = fruits.pop();
console.log(lastFruit); // Output: 'orange'
console.log(fruits); // Output: ['apple', 'banana']

3. shift() Method: The shift() method removes the first element from an array and returns that element. It modifies the original array.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange'];
let firstFruit = fruits.shift();
console.log(firstFruit); // Output: 'apple'
console.log(fruits); // Output: ['banana', 'orange']

4. unshift() Method: The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array. It modifies the original array.

Code Example:

javascript
let fruits = ['banana', 'orange'];
fruits.unshift('apple', 'mango');
console.log(fruits); // Output: ['apple', 'mango', 'banana', 'orange']

5. concat() Method: The concat() method combines two or more arrays and returns a new array. It does not modify the original arrays.

Code Example:

javascript
let fruits = ['apple', 'banana'];
let moreFruits = ['orange', 'mango'];
let allFruits = fruits.concat(moreFruits);
console.log(allFruits); // Output: ['apple', 'banana', 'orange', 'mango']
console.log(fruits); // Output: ['apple', 'banana']
console.log(moreFruits); // Output: ['orange', 'mango']

6. slice() Method: The slice() method extracts a section of an array and returns a new array. It does not modify the original array.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange', 'mango'];
let citrusFruits = fruits.slice(1, 3);
console.log(citrusFruits); // Output: ['banana', 'orange']
console.log(fruits); // Output: ['apple', 'banana', 'orange', 'mango']

7. splice() Method: The splice() method changes the contents of an array by removing or replacing existing elements or adding new elements. It modifies the original array.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange', 'mango'];
fruits.splice(2, 1, 'kiwi');
console.log(fruits); // Output: ['apple', 'banana', 'kiwi', 'mango']

8. indexOf() Method: The indexOf() method returns the first index at which a given element can be found in an array, or -1 if the element is not present.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange', 'banana', 'mango'];
let bananaIndex = fruits.indexOf('banana');
console.log(bananaIndex); // Output: 1

9. includes() Method: The includes() method determines whether an array includes a certain value and returns true or false.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange', 'mango'];
let hasApple = fruits.includes('apple');
console.log(hasApple); // Output: true

10. forEach() Method: The forEach() method executes a provided function once for each array element.

Code Example:

javascript
let fruits = ['apple', 'banana', 'orange', 'mango'];
fruits.forEach(function(fruit) {
  console.log(fruit);
});
// Output:
// 'apple'
// 'banana'
// 'orange'
// 'mango'

Conclusion: These are just a few of the many array methods available in JavaScript. By utilizing these methods, you can efficiently manipulate and work with arrays in your JavaScript programs. Experiment with these methods and explore the official JavaScript documentation for more information and advanced usage.