PDA

Click to See Complete Forum and Search --> : object literal creation

SnowCrash
10-17-2003, 11:04 AM
I need help with an object literal creation. I would like to refer within the creation to an already created one. See follwing code example:

obj = {
PosX: 10,
PosY: 10,
Style: "left:" + this.PosX + "px; top:" + this.PoxY + "px;"
};

How do I refer in the Style creation to obj.PosX? this.PosX and obj.PosX don't work of course. What would the correct notion be ?

Thanx for any help.
SnowCrash
Phil Karras
10-17-2003, 11:28 AM
Doesn't using just PosX work? Have you tried that?
SnowCrash
10-29-2003, 08:15 AM
No, doesn' work ether. Creates an undefined error.
AdamGundry
10-29-2003, 08:43 AM
I think you will need to do something like this:

function myObj(){
this.PosX = 10;
this.PosY = 10;
this.Style = "left:" + this.PosX + "px; top:" + this.PoxY + "px;";
}

obj = new myObj();
fredmv
10-29-2003, 08:53 AM
var o =
{
x: 5,
y: 5,
z: function()
{
alert( this.x + "," + this.y );
}
}

o.z();
Phil Karras
10-29-2003, 09:09 AM
I believe Fredmv and the fellow before got it right for the object. You can simply cut & paste fredmv's stuff into a <script...> section in the <head> section of your HTML file and see it work.

Also try this, leave fredmv's stuff in and include this:

<body onLoad='alert(o.x); o.z();'>

you'll notice this is also able to call those objects & methods as well.

You can also put the code from AdamGundry in your <head> section and try this <body>:

<body onLoad='alert(o.x); o.z(); alert(obj.Style);'>

so you can see that they were both valid ways of doing this.

ERROR * ERROR: One small error you'll need to change the this.PoxY to this.PosY in the

this.Style = "left:" + this.PosX + "px; top:" + this.PoxY + "px;";

line.

Good-luck!
SnowCrash
10-29-2003, 09:09 AM
AdamGundry:
Your version works fine of course, but I wanted to use the short literal notation.

fredmv:
Your version works, too, but now o.z() is a method and not a property of obj (obj.Style needs to be a string) as in my original and in AdamGundry's version.

I'm new to OOP. Maybe I can't shorten AdamGundry's version so I just use his or this (works):

obj = {
PosX: 10,
PosY: 10,
Style: ""
}

obj.Style = "left:" + obj.PosX + "px; top:" obj.PoxY + "px;"
fredmv
10-29-2003, 12:12 PM
I suppose you could make the method return a string. ;)var o =
{
x: 5,
y: 5,
z: function()
{
return "left: " + this.x + "px; top: " + this.y + "px;";
}
}

alert( o.z() );
alert( typeof o.z() );I hope that helps you out.
dragle
10-30-2003, 08:49 AM
SnowCrash,

Are you only concerned with setting the values in the initial creation of the object, or did you want the Style property to dynamically reflect the obj.PosX and obj.PosY properties whenever it was retrieved?

If it's just the initialization you're concerned with, the way I've seen this most commonly done is to simply declare a variable within the PosX assignment that can then be used later; i.e.:

obj = {
PosX: PosX = 10,
PosY: PosY = 20,
Style: "left:" + PosX + "px; top:" + PosY + "px;"
};
alert(obj.PosX); // 10
alert(obj.PosY); // 20
alert(obj.Style); // left:10px; top:20px;
alert(PosX); // 10
alert(PosY); // 20

This does leave you with PosX and PosY variables when you are finished (as you can see by the last two alerts) but allows you to keep the definition self contained. If you wanted to use different variable names you could:

var TempPosX,TempPosY;
obj = {
PosX: TempPosX = 10,
PosY: TempPosY = 20,
Style: "left:" + TempPosX + "px; top:" + TempPosY + "px;"
};
alert(obj.PosX); // 10
alert(obj.PosY); // 20
alert(obj.Style); // left:10px; top:20px;
alert(TempPosX); // 10
alert(TempPosY); // 20

If you were looking for a dynamic setting, then I think the method based approach similar to what fredmv mentioned is the way to go; something like a getStyle method that always returns the actual string you want based on the current obj settings.

HTH,
SnowCrash
10-30-2003, 09:37 AM
dragle,

Your first suggestion was exactly what I was looking for.

Thanx.
dragle
10-31-2003, 07:48 AM
You're welcome, happy to help!