How can I return an Index location for an item in a JSON array by searching with text?

Question

Here is my JSON array:

var planets = [{
  "Name": "Mercury",
  "Temperature": "427°C",
  "Position" : 1
}, {
  "Name": "Venus",
  "Temperature": "462°C",
  "Position" : 2

}, {
  "Name": "Earth",
  "Temperature": "16°C",
  "Position" : 3
}]

Using the text "Earth" is there a method that would return me the index location of the item Earth in my Planets array?

For example:

planets.find("Earth")

1. This is a JavaScript _object_ (or more specifically, an array) not a JSON array. JSON = literally text format that would represent JS objects. 2. You can use [`findIndex`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex) but it's not well supported everywhere yet. If you don't need the _index_ but the actual _object_, then just use straight `find` — VLAZ, Sep 13 '16 at 12:39

Roger · Answer 1 · 2016-09-13T13:33:11.317

2

Plain JS: findIndex

The findIndex() method returns an index in the array, if an element in the array satisfies the provided testing function. Otherwise -1 is returned.

[{
  "Name": "Mercury",
  "Temperature": "427°C",
  "Position" : 1
}, {
  "Name": "Venus",
  "Temperature": "462°C",
  "Position" : 2

}, {
  "Name": "Earth",
  "Temperature": "16°C",
  "Position" : 3
}].findIndex(x => x.Name === "Earth")

If you're in IE 9+, you can however use the reduce function

The reduce() method applies a function against an accumulator and each value of the array (from left-to-right) to reduce it to a single value.

[{
  "Name": "Mercury",
  "Temperature": "427°C",
  "Position" : 1
}, {
  "Name": "Venus",
  "Temperature": "462°C",
  "Position" : 2

}, {
  "Name": "Earth",
  "Temperature": "16°C",
  "Position" : 3
}].reduce(function (foundSoFar, x, i) { // Note no arrow funcion
  if (foundSoFar < 0 && x.Name === "Earth") {
    return i;
  } else {
    return foundSoFar;
  }
}, -1);

Alternatively, use an implementation of a library like ramda

edited Sep 13 '16 at 13:33

answered Sep 13 '16 at 12:39

Roger

2,912
2
31
39

what is findIndex? where does it comes from? can you explain? – vsync Sep 13 '16 at 12:40
This is a great answer but the linked article suggests you won't get any support from IE. – Adam Waselnuk Sep 13 '16 at 12:42
@AdamWaselnuk how about now? – Roger Sep 13 '16 at 12:53
Great use of reduce :) – Adam Waselnuk Sep 15 '16 at 15:06

vsync · Answer 2 · 2016-09-13T12:46:15.477

with regular js:

function getIndexOfPlanet(name){
  for( var i in planets )
    if( planets[i].Name == name )
       return i;

}

Using Lodash utility method findIndex, it's as easy as:

var planets = [{
  "Name"        : "Mercury",
  "Temperature" : "427°C",
  "Position"    : 1
}, {
  "Name"        : "Venus",
  "Temperature" : "462°C",
  "Position"    : 2
}, {
  "Name"        : "Earth",
  "Temperature" : "16°C",
  "Position"    : 3
}]

function getIndexOfPlanet(name){
  return _.findIndex(planets, { 'Name':name});
}

console.log( getIndexOfPlanet('Earth') );

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script>

Yosvel Quintero · Answer 3 · 2016-09-16T09:01:58.787

1

You can use Array#find index of the current element being processed in the array:

var planets = [{"Name": "Mercury","Temperature": "427°C","Position": 1}, {"Name": "Venus","Temperature": "462°C","Position": 2}, {"Name": "Earth","Temperature": "16°C","Position": 3}],
    earthIndex = -1,
    earth = planets.find(function(item, index) {
        if (item.Name === 'Earth') {
            earthIndex = index;
            return true;
        }
        return false;
    });

console.log('Earth index is:', earthIndex);

edited Sep 16 '16 at 09:01

answered Sep 13 '16 at 12:40

Yosvel Quintero

18,669
5
37
46

1

This is going to be more widely supported than `findIndex`. I suppose the only change I'd make is to return `-1` if the element is not found as that would make it behave more like a `findIndex` function but that might or might not be relevant for different use cases. – VLAZ Sep 13 '16 at 12:47

Simo · Accepted Answer · 2016-09-13T14:23:10.240

1

Try this:

var index = -1;
var val = 'Earth';
var filteredObj = planets.find(function(item, i){
  if(item.Name === val){
    index = i;
    return i;
  }
});

console.log(index, filteredObj);

edited Sep 13 '16 at 14:23

answered Sep 13 '16 at 12:45

Simo

431
1
7
20

I'll assume data would be 'planets' in my case? – Maximillion Bartango Sep 13 '16 at 13:58

score 1 · Answer 5 · answered Sep 13 '16 at 12:48

1

var locationIndex; planets.forEach(function(ele,ind){if(ele.Name === "Earth") locationIndex = ind;}); console.log(locationIndex);

find or findIndex may not support some browsers like IE..

answered Sep 13 '16 at 12:48

AB Udhay

643
4
9

How can I return an Index location for an item in a JSON array by searching with text?

5 Answers5

Linked