558

I am missing a option how to get the index number inside the map function using List from Immutable.js:

var list2 = list1.map(mapper => { a: mapper.a, b: mapper.index??? }).toList();

Documentation shows that map() returns Iterable<number, M>. Is there any elegant way to what I need?

Zygimantas
  • 8,547
  • 7
  • 42
  • 54
  • Keep in mind that `map` is supposed to preserve the structure of the array that is, only its values should be transformed not the array itself. –  Jul 14 '16 at 06:12
  • Array.prototype.map() create a new array using the callback function as transformation – Carmine Tambascia Oct 15 '21 at 20:18

4 Answers4

970

You will be able to get the current iteration's index for the map method through its 2nd parameter.

Example:

const list = [ 'h', 'e', 'l', 'l', 'o'];
list.map((currElement, index) => {
  console.log("The current iteration is: " + index);
  console.log("The current element is: " + currElement);
  console.log("\n");
  return currElement; //equivalent to list[index]
});

Output:

The current iteration is: 0 <br>The current element is: h

The current iteration is: 1 <br>The current element is: e

The current iteration is: 2 <br>The current element is: l

The current iteration is: 3 <br>The current element is: l 

The current iteration is: 4 <br>The current element is: o

See also: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array/map

Parameters

callback - Function that produces an element of the new Array, taking three arguments:

1) currentValue
The current element being processed in the array.

2) index
The index of the current element being processed in the array.

3) array
The array map was called upon.

Samuel Toh
  • 18,006
  • 3
  • 24
  • 39
  • Should the map's callback function always have a return statement? What does 'X' mean in your code? – anotherDev Dec 08 '17 at 09:09
  • 1
    @HarshKanchina The `map` operation is use for constructing a new array by iterating through the elements of a given array. To answer your question, yes a return statement is required, and for this case it is returning the value 'X' on each iteration. Thus the final product of the code will be `[ 'X', 'X','X','X' ]` – Samuel Toh Dec 11 '17 at 01:35
  • @But 'X' isn't defined anywhere. So what is it referring to? How does the function know what X refers to here? – anotherDev Dec 11 '17 at 09:11
  • 3
    @HarshKanchina `'X'` is a string. – Samuel Toh Dec 11 '17 at 23:45
  • I want this index to start with 1, how could i achieve this? – Reema Parakh Jan 01 '19 at 06:15
  • @ReemaParakh You can use simple math for that, e.g. `(index + 1)` like `console.log("The current iteration is: " + (index + 1));` – luckydonald Mar 23 '19 at 16:08
  • Having index as a second parameter is the Ruby way, and I mean it in the most positive way. – wintermute Apr 19 '19 at 16:11
  • This answer explains native javascript arrays, while the question is about ImmutableJS. However, [not quite] _coincidentally_, the callback function has the same signature. While it links to the wrong docs, it unintentionally gives the correct answer – dube May 07 '19 at 12:16
75

Array.prototype.map() index:

One can access the index Array.prototype.map() via the second argument of the callback function. Here is an example:

const array = [1, 2, 3, 4];

const map = array.map((x, index) => {
  console.log(index);
  return x + index;
});

console.log(map);

Other arguments of Array.prototype.map():

  • The third argument of the callback function exposes the array on which map was called upon
  • The second argument of Array.map() is a object which will be the this value for the callback function. Keep in mind that you have to use the regular function keyword in order to declare the callback since an arrow function doesn't have its own binding to the this keyword.

For example:

const array = [1, 2, 3, 4];

const thisObj = { prop1: 1 }

const map = array.map((x, index, array) => {
  console.log(array);
  console.log(this)
}, thisObj);
Kaspar Lee
  • 5,446
  • 4
  • 31
  • 54
Willem van der Veen
  • 33,665
  • 16
  • 190
  • 155
9
  • suppose you have an array like

   const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]
    
    
    arr.map((myArr, index) => {
      console.log(`your index is -> ${index} AND value is ${myArr}`);
    })
> output will be
 index is -> 0 AND value is 1
 index is -> 1 AND value is 2
 index is -> 2 AND value is 3
 index is -> 3 AND value is 4
 index is -> 4 AND value is 5
 index is -> 5 AND value is 6
 index is -> 6 AND value is 7
 index is -> 7 AND value is 8
 index is -> 8 AND value is 9
Gouranga Satapathy
  • 308
  • 2
  • 4
3

Using Ramda:

import {addIndex, map} from 'ramda';

const list = [ 'h', 'e', 'l', 'l', 'o'];
const mapIndexed = addIndex(map);
mapIndexed((currElement, index) => {
  console.log("The current iteration is: " + index);
  console.log("The current element is: " + currElement);
  console.log("\n");
  return 'X';
}, list);
David
  • 15,894
  • 22
  • 55
  • 66