Accessing object properties in another function

Question

I have been reading through a ton of questions posted and cannot find the answer to my problem. I have used JavaScript as procedural for about 2 years now and have decided it is now time for me to bite the bullet and get cleaner object-oriented code. I have declared an object as defined below:

function Driver(driverName, startAddress){
    this.driverName = driverName;
    this.address = address;
    this.inventory = 0;
    this.latCoord = 0;
    this.lngCoord = 0;
}

and have built functions for the Driver object by using the Driver.prototype.functionName = function(){}; syntax. That all is fine.

Then I declare a global variable FULL_LIST = []; and have a function as follows:

function initialize(){
    // init geocoder
    GEOCODER = new google.maps.Geocoder();

    // init map
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var mapOptions = {
        zoom: 8,
        center: latlng
    }
    MAP = new google.maps.Map($('#map-canvas'), mapOptions);

    // init list of all drivers
    $.ajax({
        type: "POST",
        url: "actions/getDriverInfo.php",
        dataType: "json",
        success: function(data){
            var names = data.names,
                addresses = data.addresses;
            for (var i = names.length - 1; i >= 0; i--) {
                var driver = new Driver(names[i], addresses[i]);
                FULL_LIST.push(driver);
            };
        }
    });

    run();
}

My big problem comes from the fact that I want to make a function like the following:

function run(){
    // plot points
    var bounds = new google.maps.LatLngBounds(); 
    for(var i=0; i<FULL_LIST.length; i++){
        var node = FULL_LIST[i];
        var marker = new google.maps.Marker({
            map: MAP,
            position: {
                node.latCoord,
                node.lngCoord
            },
            title: node.driverName
        });
        bounds.extend({
            node.latCoord,
            node.lngCoord
        });
        MAP.fitBounds(bounds);
    }
}

google.maps.event.addDomListener(window, 'load', initialize);

Because run() has no way of knowing that node is a Driver, I don't think it expects the .latCoord and I get a "TypeError unexpected ." on that line. Is there any way to cast node as a Driver? Is there a problem with not having a larger scale namespace wrapping it all? Or do I have an entirely messed up view of the problem?

Thanks to @fgb for his insight that the issue was a Google maps syntax issue. For those pointing out the async effects of AJAX, I am aware and that was not related to the issue I was having. I cut out a ton of my code for simplicity sake and with that I excluded a number of other ajax calls and dropped the run() fxn right in.

However, my original question still stands, albeit somewhat altered. Why does this work? I would have thought that because the object and its properties are defined in a different function that the run function wouldn't know that .latCoord was a potential property for an object because at no point does the system know to expect a Driver object. Wouldn't this be a big issue in something like c++?

It all has to happen upon `success` since AJAX is Asynchronous. — StackSlave, Oct 21 '14 at 23:03
you're calling `run()` before the ajax success function is complete, try moving `run` inside the callback — andrew, Oct 21 '14 at 23:04
Isn't `{ node.latCoord, node.lngCoord }` a syntax error? Try `{ lat: node.latCoord, lng: node.lngCoord }` — fgb, Oct 21 '14 at 23:08
@fgb thanks you answered the problem, but if any of you see my edits above, my main question still stands. — Timo Loescher, Oct 22 '14 at 03:06

score 1 · Accepted Answer · answered Oct 22 '14 at 16:44

You may define a constructor elsewhere, but once you create an object with it, you end up with a self-contained object. The object knows what properties it has and doesn't need a separate definition anywhere. This is different from languages like c++ where you need access to a class definition to use an instance.

Types in JavaScript are more flexible than in some other languages. It has the concept of duck typing where the types of objects are implicitly defined based on how they're used rather than strict type definitions.

So you could throw in some object literals like { latCoord: 5, lngCoord: 10, driverName: 'Name' } into FULL_LIST, and the run function will use them the same way as the constructor created objects.

Accessing object properties in another function

1 Answers1