Getting access to scoped objects

Question

I have this code below:

<!DOCTYPE html>
<html>
<body>

<script>
function zz(){
var location = {
    firstName: "John",
    lastName : "Doe",
    id       : 5566,
    fullName : function() {
       return this.firstName + " " + this.lastName;
    }
};
return this;
}

var abc= zz();
console.log(abc);  //This works, but it is the the window objects location, I want the  location I have defined
console.log(some code here to print out John);
console.log(some code here to print out Doe);
</script>
</body>
</html>

I choose location as the object name to learn about more about scope collision.

But now I can't figure out how to get to the variables I have defined. I know I have an object named location wrapped in a function zz

I know the object location has a firstName property of John I know also the object location has a method fullName that will return the John Doe back to the calling reference.

So what do I need to do to output for example John to the console?

Thanks,

`return location;` ? After the function was run - the `location` object is not reachable anymore (since there are no active references to it) — zerkms, Apr 06 '15 at 22:37
^ that! `this` inside the function when called like that would be the window, that's why `window` is returned. — adeneo, Apr 06 '15 at 22:39

StackSlave · Answer 1 · 2015-04-07T23:25:00.247

vars are only available within the scope which they are defined with the keyword var. I'm pretty sure that you actually want this inside your location Object to refer to your location Object, while you may want more methods in zz. Here is how that can be achieved:

function zzLoc(context){
  this.firstName = 'John';
  this.lastName = 'Doe';
  this.id = 5566;
  this.fullName = function(){
    return this.firstName+' '+this.lastName;
  }
  this.parent = context;
}
function zz(){
  this.location = function(){
    return new zzLoc(this);
  }
  // more methods here
}
var wellNow = new zz, loc = wellNow.location();
console.log(loc.fullName());

PHPGlue thanks for your answer as well! I plan on studying both yours and chiliNUT's to understand the similarities and differences. — JimF, Apr 06 '15 at 23:29

score 0 · Accepted Answer · edited May 23 '17 at 11:43

How about this: Rather than use var, assign properties to this. And since it looks like you are trying to make an object constructor, try using the new keyword.

        function zz() {
            this.location = {
                firstName: "John",
                lastName: "Doe",
                id: 5566,
                fullName: function () {
                    return this.firstName + " " + this.lastName;
                }
            };

            this.getFirstName = function () {
                return this.location.firstName;
            };

            this.getLastName = function () {
                return this.location.lastName;
            };

        }

        var abc = new zz();
        console.log(abc);  // zz { location={...},  getFirstName=function(),  getLastName=function()}
        console.log(abc.getFirstName(), abc.location.firstName); //John, John
        console.log(abc.getLastName(), abc.location.lastName); //Doe, Doe
        console.log(abc.location.fullName()); //John Doe

Okay chiliNut that is just what I was looking for. Obviously I was missing the new() which I did not know at the time. I appreciate your answer and insight on this! — JimF, Apr 06 '15 at 22:53

Getting access to scoped objects

2 Answers2