Getting array of one variable per object from API

Question

So I have the following in my API:

{
"rooms": [
    {
       "id": "01fa01fa5f685563",
      "name": "Main Bedroom",
      "meta": "{bedroom}"
    },
    {
      "id": "7bb6f6ec4dbed853",
      "name": "Laundry Room",
      "meta": "{laundry}"
    }
  ]
}

So now I want to get all the names under 'rooms' (in this case it would be "Main Bedroom" and "Laundry Room") as an array.

I have two .js files One is called api.js

var api = class {
    static get baseUrl() {
    return "http://127.0.0.1:8080/api/";
  }

  static get timeout() {
    return 60 * 1000;
  }
}

api.rooms = class {
  static get url() {
    return api.baseUrl + "rooms/";
  }

  static getRooms() {
       return $.ajax({
            url: api.room.url,
            method: "GET",
            dataType: "json",
            timeout: api.timeout
             .then(function(data) {
                 data.rooms.map(item => item.name);
               })

          }); 
    }
}

And then I have another .js called rooms.js where I want to call this getRooms() function and then do something with the array of names I want to get from it. How can I do this??? I though of something as simple as:

    $(document).ready(function() {

          $("#title").text(api.rooms.getRooms()[0]);

   });

I'm just starting with APIs and JSON and that stuff. If anyone has a good tutorial I can watch or read it would be appreciated as well.

31piy · Accepted Answer · 2018-05-09 03:06:46Z

2

Use Array#map for this. It iterates through the array and maps each element to the return value.

const data = {
  "rooms": [{
      "id": "01fa01fa5f685563",
      "name": "Main Bedroom",
      "meta": "{bedroom}"
    },
    {
      "id": "7bb6f6ec4dbed853",
      "name": "Laundry Room",
      "meta": "{laundry}"
    }
  ]
};

const result = data.rooms.map(item => item.name);
console.log(result);

Edit 1:

Your getRooms() function seems okay (assuming the value for URL and timeout are correct), but you need to use then() to get results from it:

getRooms()
  .then(function(data) {
    data.rooms.map( ... );
  })

edited May 9, 2018 at 3:06

answered May 9, 2018 at 2:51

31piy

23.9k6 gold badges51 silver badges69 bronze badges

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

1 Comment

31piy Over a year ago

@Stackoverflowed -- In the callback of map, instead of just returning the name, you can return an object containing id and name both.

Collectives™ on Stack Overflow

Getting array of one variable per object from API

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related