Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

When mapping through an array check next item property

I'm currently mapping through an array i.e.

contents.map((content) => {
 switch(content.type) {
   case: 1
     console.log("type is one and next type is ..");
   case: 2
     console.log("type is two")
 }
})

And as you can see in case 1 I need to grab type of next item. I know that this is possible using for loop with i increment, but need to do it within a map. I'm open for suggestions using libraries like lodash (wasn't able to find anything in the documentation).

like image 933
Ilja Avatar asked Feb 08 '16 16:02

Ilja


People also ask

How do you map an array of objects?

The syntax for the map() method is as follows: arr. map(function(element, index, array){ }, this); The callback function() is called on each array element, and the map() method always passes the current element , the index of the current element, and the whole array object to it.

How does an array map work?

The map() method in JavaScript creates an array by calling a specific function on each element present in the parent array. It is a non-mutating method. Generally map() method is used to iterate over an array and calling function on every element of array.

What is map method to add the objects and how do you iterate?

map() is a built-in array method for iterating through the elements inside an array collection in JavaScript. Think of looping as a way to progress from one element to another in a list, while still maintaining the order and position of each element.


2 Answers

Array.prototype.map calls it's callback actually with 3 parameters:

currentValue // current element
index // current index
array // original array

That means you can of course access the array via it's index within a callback routine. For instance:

contents.map((content, index, array) => {
    switch(content.type) {
        case 1:
            console.log("type is one and next type is: ", array[index+1] ? array[index+1].type : 'empty');
            break;
        case 2:
            console.log("type is two")
            break;
    }
});

Example: https://jsfiddle.net/z1sztd58/ Reference: MDN

like image 84
jAndy Avatar answered Oct 12 '22 22:10

jAndy


First of all, Array.prototype.map requires you to return the mapped value, which you aren't doing.

In a simple example:

const primes = [2, 3, 5, 7, 11, 13];

const primesSquared = primes.map((prime) => {
  return prime * prime;
});

Array.prototype.map takes three arguments:

  • element: the current array element

  • index: the index of the current element within the array

  • array: the entire array

You've also got a syntax error in your switch statement. Note the position of the : in the case statement in the example below.

You could accomplish what you're trying to do with something like the following:

const newArray = oldArray.map((elem, index, array) => {
  switch(elem.type) {
    case 1:
      return "something";
    case 2:
      return "something else";
    default:
      return "default value";
  }
});

Without using a switch statement, you can easily accomplish what you're trying to accomplish:

const newArray = oldArray.map((elem, index, array) => {
  if (index+1 < array.length && elem < array[index+1]) { //ensure you're not at the end of the array before checking your condition
    return "something";
  } else {
    return "something else"; 
  }
});

Refs:

  • Switch statement: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch

  • Map: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

like image 29
Ashwin Balamohan Avatar answered Oct 13 '22 00:10

Ashwin Balamohan