How to access JSON database using javascript

Question

How can I find "firstname" with value "Anna" and display her "lastname" at the end using JavaScript? This is just a dummy example for me to understand how it works.

var employees = [
    {
    "firstName":"John",
    "lastName":"Doe"
    }, 
    {
    "firstName":"Anna",
    "lastName":"Smith"
    },
    {
    "firstName":"Peter",
    "lastName":"Jones"
    }
];

document.getElementById("demo").innerHTML =
employees.firstName;

<p id="demo"></p>

tymeJV · Accepted Answer · 2015-08-19 15:22:12Z

1

You'd have to iterate and check for that value, then do what you want:

for (var i = 0; i < employees.length; i++) {
    if (employees[i].firstName == "Anna") {
        document.getElementById("demo").innerHTML = employees[i].lastName;
        break;
    }
}

To display more than 1 Anna - I'd use filter on the array, and then join:

var lastNames = employees.filter(function(employee) {
    return employee.firstName == "Anna";
}).map(function(employee) {
    return employee.lastName;
}).join(",");

document.getElementById("demo").innerHTML = lastNames;

edited Aug 19, 2015 at 15:22

answered Aug 19, 2015 at 14:45

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

THE AMAZING Over a year ago

For some older browsers, you can not get an Object length. But if you had an Array instead of an Object i would suggest using this method. but loop backward instead of forward.

tymeJV Over a year ago

@RichardGrant -- This is an array - the above code never uses an object length. And why loop backwards instead of forwards?

THE AMAZING Over a year ago

Woops i didnt really look at the code to much your right. your code would work. i apologize. when you loop forward your loop needs to constantly keep checking the item length causing the loop to run much slower. there is plenty of documentation about this.

tymeJV Over a year ago

@RichardGrant -- Idk about much slower, the performance gain is extremely minimal - no need to optimize so soon.

Vasiliy Over a year ago

Great! Thanks a lot. Just a final question, what if I have more then one "Anna", how can I display all of their "lastNames" in a row?

Jordan · Accepted Answer · 2015-08-19 14:51:58Z

0

I've done something similar like this

var quality = function(obj) {
  if (obj.quality === 'source') {
    return obj;
  }
};

context.download.filter(quality)[0].link;

This filter should return each object that matches the filter in a new array.

answered Aug 19, 2015 at 14:51

Jordan

2,5234 gold badges34 silver badges66 bronze badges

Comments

aergistal · Accepted Answer · 2015-08-19 14:58:48Z

0

For more complex queries you can also use a JSON query language such as JSON Query (surprise!)

var jsonQuery = require('json-query')

var data = {
  employees: [
    {firstName: 'John', lastName: 'Doe'},
    {firstName: 'Anna', lastName: 'Smith'},
    {firstName: 'Peter', lastName: 'Jones'}
  ]
}

jsonQuery('employees[firstName=Anna].lastName', {
  data: data
})

answered Aug 19, 2015 at 14:58

aergistal

31.4k5 gold badges76 silver badges98 bronze badges

Comments

THE AMAZING · Accepted Answer · 2015-08-19 15:00:20Z

0

var e = [
    {
    "firstName":"John",
    "lastName":"Doe"
    }, 
    {
    "firstName":"Anna",
    "lastName":"Smith"
    },
    {
    "firstName":"Peter",
    "lastName":"Jones"
    }
];

for (var i = e.length - 1; i >= 0; i--) {
    if (e[i].firstName == "Anna") {
        console.log(e[key]['firstName'] + ', ' + e[key]['lastName']);
        break;
    }
};

You need to loop through the Object And find the value for the key you are looking for. http://jsfiddle.net/mjs2avag/

edited Aug 19, 2015 at 15:00

answered Aug 19, 2015 at 14:49

THE AMAZING

1,6132 gold badges18 silver badges38 bronze badges

3 Comments

tymeJV Over a year ago

Don't use the for in syntax with arrays, it's meant to iterate object properties.

THE AMAZING Over a year ago

There is no reason to believe that this type of for loop is for Arrays only. The only difference is that the for loop will capture the item prototype.

tymeJV Over a year ago

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… - Used to iterate object properties.

Jijo John · Accepted Answer · 2015-08-19 15:24:09Z

Iterate through the first array and use a condition to find the value 'anna' , then access it like employees[i].lastName . Here is the working example. JSFIDDLE LINK

Html

 var employees = [{
            "firstName": "John",
                "lastName": "Doe"
        }, {
            "firstName": "Anna",
                "lastName": "Smith"
        }, {
            "firstName": "Peter",
                "lastName": "Jones"
        }];
        
       
       for (var i in employees) {
             if (employees[i].firstName == 'Anna') {
                
                document.getElementById("demo").innerHTML = employees[i].lastName;
        
            }
        
        
        
        }

 <h3 id="demo"></h3> <!--This one will print smith Anna's lastname -->

Collectives™ on Stack Overflow

How to access JSON database using javascript

5 Answers 5

5 Comments

Comments

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

5 Comments

Comments

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related