Day 10 of 30 of JavaScript

Introduction

Hey there, readers! 😊 I hope you’re doing well. In our last post, we discussed arrays and some of their methods. Today, we’ll continue our exploration by looking at more array methods. Let’s get started!

Converting Array to String

The JavaScript toString() method converts an array into a string, with the elements separated by commas.

Accessing Negative Indices

In JavaScript, you cannot use negative indices directly (e.g., arr[-2] will throw an error). However, starting from ES2022, an alternative was introduced to address this issue. You can now use at() to access elements using negative indices.

const arr = [1, 2, 3, 4, 5];
console.log(arr.at(-2)); // Outputs: 4 (the second to last element)

JavaScript Array join()

The join() method combines all elements of an array into a string, similar to toString(), but you can specify a custom separator.

const fruits = ['Apple', 'Banana', 'Cherry'];
console.log(fruits.join(', ')); // Outputs: "Apple, Banana, Cherry"

JavaScript Array pop()

The pop() method removes the last element from an array and returns that element.

const numbers = [1, 2, 3];
const lastNumber = numbers.pop(); // lastNumber is 3

Deleting from a Random Index

The delete() method can be used to remove an element from an array, but it leaves undefined holes in the array.

delete numbers[1]; // This leaves an undefined value at index 1

To avoid this issue, use the splice() method instead.

splice() Method

The splice() method allows you to remove elements from an array without leaving holes.

numbers.splice(1, 1); // Removes the element at index 1

The first argument specifies the starting index, while the second specifies the number of items to remove. Note that this method modifies the original array.

toSpliced() Method

Introduced in 2023, the toSpliced() method allows for safe splicing of an array without altering the original array.

const newArray = numbers.toSpliced(1, 1); // Creates a new array without modifying the original

slice() Method

The slice() method extracts a portion of an array and returns it as a new array without modifying the original.

const newNumbers = numbers.slice(1, 3); // Returns a new array containing elements from index 1 to 2

shift() and unshift() Methods

• The shift() method removes the first element from an array and returns it.
• The unshift() method adds a new element to the beginning of an array.

const firstFruit = fruits.shift(); // Removes 'Apple'
fruits.unshift('Orange'); // Adds 'Orange' at the beginning

Merging Arrays

To concatenate two arrays, you can use the concat() method, which creates a new array without changing the original arrays.

const moreFruits = ['Grapes', 'Pineapple'];
const allFruits = fruits.concat(moreFruits);

Search Methods

• indexOf(): Searches for a specific element and returns its position. If the element is not found, it returns -1.
• lastIndexOf(): Similar to indexOf(), but returns the last occurrence of the specified element.
• includes(): Checks if an element is present in the array. It can also check for NaN values.
• find(): Returns the first element that satisfies a provided testing function.
• findIndex(): Returns the index of the first element that satisfies the testing function.

Reversing an Array

The reverse() method reverses the order of the elements in an array, modifying the original array. If you want to reverse an array without altering the original, use the reversed() method, which is a safe alternative.

const reversedArray = [...numbers].reverse(); // Creates a reversed copy of the array

Conclusion

That’s all for today’s discussion on array methods! I hope you found this information helpful. If you have any questions, feel free to leave a comment and I’ll do my best to assist you. Stay connected, and don’t forget to follow for more updates! If you enjoyed the post, please leave a reaction! 😊