How can I get the index from a JSON object with value?

Question

This is my JSON string.

[{
    "name": "placeHolder",
    "section": "right"
}, {
    "name": "Overview",
    "section": "left"
}, {
    "name": "ByFunction",
    "section": "left"
}, {
    "name": "Time",
    "section": "left"
}, {
    "name": "allFit",
    "section": "left"
}, {
    "name": "allbMatches",
    "section": "left"
}, {
    "name": "allOffers",
    "section": "left"
}, {
    "name": "allInterests",
    "section": "left"
}, {
    "name": "allResponses",
    "section": "left"
}, {
    "name": "divChanged",
    "section": "right"
}]

Now, I have the value allInterests and I want to find out the index (this case; it is '7') of this object in the above string. I tried the following code, but it always returns -1.

var q = MY_JSON_STRING
console.log(q.indexOf( 'allInterests' ) );

What you posted is a plain old JavaScript array, not a JSON string. [`Array.prototype.indexOf()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf) isn't doing what you think it is. — Ted Hopp, Apr 05 '16 at 07:01

score 50 · Accepted Answer · edited Jan 07 '22 at 00:55

You will have to use Array.find or Array.filter or Array.forEach.

Since your value is array and you need the position of the element, you will have to iterate over it.

Array.find

var data = [{"name":"placeHolder","section":"right"},{"name":"Overview","section":"left"},{"name":"ByFunction","section":"left"},{"name":"Time","section":"left"},{"name":"allFit","section":"left"},{"name":"allbMatches","section":"left"},{"name":"allOffers","section":"left"},{"name":"allInterests","section":"left"},{"name":"allResponses","section":"left"},{"name":"divChanged","section":"right"}];
var index = -1;
var val = "allInterests"
var filteredObj = data.find(function(item, i){
  if(item.name === val){
    index = i;
    return i;
  }
});

console.log(index, filteredObj);

Array.findIndex() @Ted Hopp's suggestion

var data = [{"name":"placeHolder","section":"right"},{"name":"Overview","section":"left"},{"name":"ByFunction","section":"left"},{"name":"Time","section":"left"},{"name":"allFit","section":"left"},{"name":"allbMatches","section":"left"},{"name":"allOffers","section":"left"},{"name":"allInterests","section":"left"},{"name":"allResponses","section":"left"},{"name":"divChanged","section":"right"}];

var val = "allInterests"
var index = data.findIndex(function(item, i){
  return item.name === val
});

console.log(index);

Default Array.indexOf() will match searchValue to current element and not its properties. You can refer Array.indexOf - polyfill on MDN

It would make more sense to use [`Array.findIndex()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex) since OP wants the index of an element. — Ted Hopp, Apr 05 '16 at 07:03
You are correct, but I assumed, OP would access object after fetching index, so used `Array.find` — Rajesh, Apr 05 '16 at 07:05

score 26 · Answer 2 · edited Jan 02 '21 at 09:19

You can use Array.findIndex.

var data= [{
  "name": "placeHolder",
  "section": "right"
}, {
  "name": "Overview",
  "section": "left"
}, {
  "name": "ByFunction",
  "section": "left"
}, {
  "name": "Time",
  "section": "left"
}, {
  "name": "allFit",
  "section": "left"
}, {
  "name": "allbMatches",
  "section": "left"
}, {
  "name": "allOffers",
  "section": "left"
}, {
  "name": "allInterests",
  "section": "left"
}, {
  "name": "allResponses",
  "section": "left"
}, {
  "name": "divChanged",
  "section": "right"
}];
var index = data.findIndex(obj => obj.name=="allInterests");

console.log(index);

score 4 · Answer 3 · answered Apr 05 '16 at 07:05

Traverse through the array and find the index of the element which contains a key name and has the value as the passed param.

var data = [{
  "name": "placeHolder",
  "section": "right"
}, {
  "name": "Overview",
  "section": "left"
}, {
  "name": "ByFunction",
  "section": "left"
}, {
  "name": "Time",
  "section": "left"
}, {
  "name": "allFit",
  "section": "left"
}, {
  "name": "allbMatches",
  "section": "left"
}, {
  "name": "allOffers",
  "section": "left"
}, {
  "name": "allInterests",
  "section": "left"
}, {
  "name": "allResponses",
  "section": "left"
}, {
  "name": "divChanged",
  "section": "right"
}];

Array.prototype.getIndexOf = function(el) {

  var arr = this;

  for (var i=0; i<arr.length; i++){
     console.log(arr[i].name);
     if(arr[i].name==el){
       return i;
     }
     
  }
  
  return -1;

}

alert(data.getIndexOf("allResponses"));

Why reinvent the wheel. There's already [`Array.prototype.findIndex`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex) that does the same job as your `getIndexOf`. — Ted Hopp, Apr 05 '16 at 07:07

score 2 · Answer 4 · answered Sep 20 '19 at 05:17

In all previous solutions, you must know the name of the attribute or field. A more generic solution for any attribute is this:

let data = 
[{
    "name": "placeHolder",
    "section": "right"
}, {
    "name": "Overview",
    "section": "left"
}, {
    "name": "ByFunction",
    "section": "left"
}, {
    "name": "Time",
    "section": "left"
}, {
    "name": "allFit",
    "section": "left"
}, {
    "name": "allbMatches",
    "section": "left"
}, {
    "name": "allOffers",
    "section": "left"
}, {
    "name": "allInterests",
    "section": "left"
}, {
    "name": "allResponses",
    "section": "left"
}, {
    "name": "divChanged",
    "section": "right"
}]    

function findByKey(key, value) {
    return (item, i) => item[key] === value
}

let findParams = findByKey('name', 'allOffers')
let index = data.findIndex(findParams)

score 1 · Answer 5 · answered Apr 11 '19 at 06:14

Function base solution for get index from a JSON object with value by VanillaJS.

Exemple: https://codepen.io/gmkhussain/pen/mgmEEW

    var data= [{
      "name": "placeHolder",
      "section": "right"
    }, {
      "name": "Overview",
      "section": "left"
    }, {
      "name": "ByFunction",
      "section": "left"
    }, {
      "name": "Time",
      "section": "left"
    }, {
      "name": "allFit",
      "section": "left"
    }, {
      "name": "allbMatches",
      "section": "left"
    }, {
      "name": "allOffers",
      "section": "left"
    }, {
      "name": "allInterests",
      "section": "left"
    }, {
      "name": "allResponses",
      "section": "left"
    }, {
      "name": "divChanged",
      "section": "right"
    }];
    
    
    // create function
    function findIndex(jsonData, findThis){
      var indexNum = jsonData.findIndex(obj => obj.name==findThis);  

    //Output of result
          document.querySelector("#output").innerHTML=indexNum;
          console.log(" Array Index number: " + indexNum + " , value of " + findThis );
    }
    
    
    /* call function */
    findIndex(data, "allOffers");

Output of index number : <h1 id="output"></h1>

score 0 · Answer 6 · edited Jul 28 '19 at 19:51

0

Once you have a json object

obj.valueOf(Object.keys(obj).indexOf('String_to_Find'))

edited Jul 28 '19 at 19:51

deHaar

17,687
10
38
51

answered Jul 28 '19 at 19:32

Saurav

1
2

score 0 · Answer 7 · answered Jul 20 '22 at 21:59

0

var MYarry=["13","18","77","4543"];
for (var i=0;i<=MYarry.length;i++){
           if(MYarry[i] === "18") {
           console.log(i);
           }
        }

answered Jul 20 '22 at 21:59

sahba

39
4

How can I get the index from a JSON object with value?

7 Answers7

Array.find

Array.findIndex() @Ted Hopp's suggestion

Linked

Related