Arrays Methods in Javascript

Imagine you’re someone who really loves perfumes. You have a huge collection, each perfume is unique with its own price and smell. You keep them arranged neatly on a shelf, each with a sticky note that shows the price.

You like to show your collection to your friends, but here’s the problem: you always reach for your favorite perfumes, and they run out quickly. Now, you’re thinking: how can you keep enjoying your favorites while managing your growing collection?

1. The Favorite Perfume That Gets Used Up (Shift)

You have a favorite perfume that you use the most. Let’s say it costs $130. Since you love it so much, it gets used up quickly. You see it right at the front of your row of perfumes on the shelf. You just grab it and take it out of the row.

In JavaScript, this is like the shift() method, which removes the first item from an array and gives it to you.

removedPerfume = row.shift(); // Takes out the first perfume (130)
console.log(removedPerfume); // 130 (Your favorite perfume)
console.log(row); // [350, 150, 95, 130, 25, 135, 40]

Now, the row is a bit shorter, but that's fine. You still have plenty of perfumes left.

2. Getting Rid of the Least Used Perfume (Pop)

As your collection grows, you start feeling overwhelmed. You see some perfumes sitting on the shelf that you don’t use very often. Maybe one of them isn't your favorite anymore.

You decide to get rid of the least used perfume. You look at the very end of your row and remove the perfume you like the least.

In JavaScript, this is like the pop() method, which removes the last item in the array.

removedPerfume = row.pop(); // Removes the last perfume (40)
console.log(removedPerfume); // 40 (Your least favorite)
console.log(row); // [350, 150, 95, 130, 25, 135]

Now, your shelf has some extra space for new perfumes, and you feel more organized.

3. Receiving a Surprise Gift (Push, Splice, Unshift)

One day, your friends surprise you with a new perfume. You try it on, and it smells good. Now, you need to decide where to put it in your collection.

If you really love it, you’ll put it in the front of the row. If you don’t like it, you’ll put it at the end. If it’s somewhere in between, you’ll put it in the middle.

Let’s break it down:

• Best Perfume Ever (Unshift): If it’s your new favorite, you put it at the front of your row. This is like using the unshift() method in JavaScript, which adds an item to the start of the array.

row.unshift(250); // Your new favorite goes to the front
console.log(row); // [250, 350, 150, 95, 130, 25, 135]

• Worst (Push): If you don’t love it, , you put it at the end since it is a gift from your friend .This is like using the push() method, which adds an item to the end of the array.

row.push(200); // The perfume you don't love as much goes to the end
console.log(row); // [250, 350, 150, 95, 130, 25, 135, 200]

• In the Middle (Splice): If you’re somewhere in between, you put it in the middle. This is like using the splice() method in JavaScript, which lets you insert something in the middle of an array.

row.splice(3, 0, 180); // Inserting a perfume in the middle of the row
console.log(row); // [250, 350, 150, 180, 95, 130, 25, 135]

4. Your Friend Wants a Budget Perfume (Filter)

One of your friends comes to you asking for a budget-friendly perfume. They don’t want to spend much, and you know they’re looking for something under $150. So, you decide to filter out the more expensive perfumes and show them the ones that fit within the budget.

In JavaScript, this is like the filter() method, which allows you to return only the elements that meet a certain condition.

affordablePerfumes = row.filter(price => price < 150);
console.log(affordablePerfumes); // [95, 130, 25, 130]

Now, your friend has a selection of perfumes that are within their price range!

5. Discounting the Entire Collection (Map)

Feeling generous, you decide to offer a discount on all your perfumes to your friends, maybe to help them get in on your perfume obsession. You decide that all perfumes will now be sold for half the price.

This is similar to using the map() method in JavaScript, where you apply a function (in this case, dividing by half) to every element in the array.

discountedPerfumes = row.map(price => price / 2);
console.log(discountedPerfumes); // [125, 175, 75, 47.5, 90, 12.5, 67.5, 100]

6. Remembering the Position of a Specific Perfume (IndexOf)

One day, a friend asks you about a specific perfume from your collection, but you forget the exact price and can’t remember the brand. You only know where it’s positioned on the shelf. You use your muscle memory to recall the position where the perfume was kept, and you find it by its position in the row.

In JavaScript, this is like the indexOf() method, which returns the position of an item in the array.

position = row.indexOf(150);
console.log(position); // 1 (Position of the perfume priced 150)

7. Rearranging Perfumes by Price (Sort)

Over time, you decide to reorganize your entire collection to see which perfumes are the most expensive and which are the least. You want to arrange them from most expensive to least expensive. This is like using the sort() method in JavaScript, which allows you to sort an array in a particular order.

row.sort((a, b) => b - a); // Sorting the row from high to low
console.log(row); // [350, 250, 200, 180, 150, 130, 130, 95]

Now, you can easily pick your most luxurious perfumes when you want to impress!

8. Changing the Order (Reverse)

Eventually, you get a bit bored of the way your perfumes are lined up, and you decide to flip the order. You want to see your least favorite perfumes on the left and your best ones on the right for a change. This is similar to using the reverse() method in JavaScript, which reverses the order of elements in an array.

row.reverse();
console.log(row); // [95, 130, 130, 180, 150, 200, 350, 250]

Now, your shelf looks completely different—it’s like a fresh perspective!

Conclusion

This makes your collection more manageable while still keeping it fun and exciting. Thankyou!!