Javascript object creation on the fly

Question

I'm sure I've seen some examples of this in jquery. But for me, the following code does not work. The firebug debugger tells me that: 'Location is undefined'. Could you tell me if this is possible?

function ResolveGeoCode() {
    var Location;
    Location.Ad1 = "Hello ";
    Location.Ad2 = "World";

    return Location;
}

var loc = ResolveGeoCode();
var String1 = loc.Ad1; //This contains "Hello "?
var String2 = loc.Ad2; //This contains "World"?

Could a name be given to this type of feature I'm looking for?

Thanks.

Answer 1

This is what's happening:

function ResolveGeoCode() {
    // Location is declared, but its value is `undefined`, not `object`
    var Location;
    alert(typeof Location); // <- proof pudding

    // Failing here because you're trying to add a 
    // property to an `undefined` value

    Location.Ad1 = "Hello "; 
    Location.Ad2 = "World";

    return Location;
}

Fix it by declaring Location as an empty object literal before trying to add properties to it:

function ResolveGeoCode() {
    var Location = {};
    alert(typeof Location); // now it's an object

    // Programmatically add properties
    Location.Ad1 = "Hello "; 
    Location.Ad2 = "World";

    return Location;
}

If you know the properties and their corresponding values ahead of time, you can use a more inline approach:

function ResolveGeoCode() {
    var Location = {
        Ad1: "Hello ",
        Ad2: "World"
    };

    // ...further manipulations of Location here... 

    return Location;
}

Read here for more on object literals.

Answer 2

This is the syntax for inline object creation (In this case returned from a function.).

function ResolveGeoCode() {
    return {
        Ad1: "Hello ",
        Ad2: "World"
    };
}