target an item in an array returned by a function

Question

Hey guys, I decided to revamp my JavaScript from my previous post found here https://teamtreehouse.com/forum/javascript-utc-time-format where Marcus Parsons and Dave McFarland helped me out.

Previously I have a function googleMapsApi that took in some data did some things and then called another function inside of it to do more work. I wanted to separate them out and make them more flexible, robust and reusable. so I came up with a new function geocoder which is to replace my googleMapsApi function. Geocoder returns an array but now I don't know how to call a specific part of that function for example

the below code is simply pseudo code

geocoder(input).array[0].output;

here is my original go for the googleMapsApi

function googleMapsApi () {
        var url = "http://maps.googleapis.com/maps/api/geocode/json?address=" + zipcode + "&sensor=false";
        $.ajax(url, {
            data : null,
            type : "GET",
            success : function (response) {
                //3.2 Check to see if connection is successful
                if (response.status !== "OK") {
                    //3.2a If connection is unsucessful message
                    alert("Location Not Found");
                } else {
                    //3.2b If connection is successful, Convert user input to Latitude & Longitude
                    latitude = response.results[0].geometry.location.lat;
                    longitude = response.results[0].geometry.location.lng;
                    var zip = response.results[0].address_components[0].long_name;
                    var city = response.results[0].address_components[1].long_name;
                    var state = response.results[0].address_components[2].short_name;
                    var country = response.results[0].address_components[3].short_name;
                    loc = city + ", " + state;
                }
                //console.dir(response);
                forecast();
            }
        });
    }

Here is my geocoder

function geocoder (zipcode) {
            var url = "http://maps.googleapis.com/maps/api/geocode/json?address=" + zipcode + "&sensor=false";
            $.ajax(url, {
                data : null,
                type : "GET",
                success : function (response) {
                    //3.2 Check to see if connection is successful
                    if (response.status !== "OK") {
                        //3.2a If connection is unsucessful message
                        alert("Location Not Found");
                    } else {
                        //3.2b If connection is successful, Convert user input to Latitude & Longitude
                        var results = [
                            {
                                latlng : response.results[0].geometry.location.lat + "," + response.results[0].geometry.location.lng
                            },
                            {
                                "zip" : response.results[0].address_components[0].long_name,
                                "city" : response.results[0].address_components[1].long_name,
                                "state" : response.results[0].address_components[2].short_name,
                                "country" : response.results[0].address_components[3].short_name,
                                "loc" : "city" + ", " + "state"
                            }
                        ];
                    }
                    console.dir(results[0].latlng);
                    return results;
                }
            });
        }

Answer 1 · 2015-01-23T00:04:21Z

January 23, 2015 12:04am

Hi John,

I did some changes to your code. Basically i added a callback function which is called when the ajax request receives the response.

This allows you to do something with the data, in this case I just did a console log of the response.

To call ii just go to your console and write geocoder(2000, callback) for example.

function callback(response){

        console.log(response);
    }




    function geocoder (zipcode, callback) {
        var url = "http://maps.googleapis.com/maps/api/geocode/json?address=" + zipcode + "&sensor=false";

        $.ajax(url, {
                data : null,
                type : "GET",
                success : function (response) {
                    //3.2 Check to see if connection is successful
                    if (response.status !== "OK") {
                        //3.2a If connection is unsucessful message
                        alert("Location Not Found");
                    } else {

                        var city = response.results[0].address_components[1].long_name,
                        state = response.results[0].address_components[2].short_name,
                        zip = response.results[0].address_components[0].long_name,
                        country = response.results[0].address_components[2].long_name;

                        //3.2b If connection is successful, Convert user input to Latitude & Longitude
                        var results = {
                            'latlng' : response.results[0].geometry.location.lat + "," + response.results[0].geometry.location.lng,
                            'location': {
                                'zip' : zip,
                                'city' : city,
                                'state' : state,
                                'country' : country,
                                'loc' : city + ", " + state
                            }
                        };

                        callback(results);

                    }

                }
            });
        }

Welcome to the Treehouse Community

Looking to learn something new?

John Weland

John Weland

target an item in an array returned by a function

1 Answer

Hugo Paz

Hugo Paz

John Weland

John Weland

John Weland

John Weland

John Weland

John Weland

Hugo Paz

Hugo Paz

John Weland

John Weland