Preserved Topic: Objectification (Page 1 of 1)

...or something.

I'm sure this is a common situation, so I won't go into too much depth. I'll just rely on that 99% of the population who know more than I do about OO things in JavaScript to say "aah, Yes. That old one."

I'm trying to develop what would be called an API if I knew what I was doing. Take the case of existing HTML elements. It strikes me that there are 2 approaches to loading them up with properties and methods.

When I didn't know how to (or that you could) attach methods to HTML elements, I developed this idea of creating an abstract object for each element, to which methods could be attached. The element itself is of course one of the abstract object's properties. I hope you get my drift.

This situation works fine, because I can then define a constructor function for the abstract objects - and make them members of a class. The downside is that I have to add properties to both the abstract and the object telling each their relationship to each other. There are also complications in creating methods, and just directly making commands to particular elements. Keep up at the back.

The alternative (now I know how to attach methods to elements) is to forget the abstract object, and concentrate purely on each element. In the API, an array of elements that I want to behave as a class are gathered up, looped through, and props & methods attached like this: BOX[k].mad = boxGoMad.

This approach makes the creation of methods and things simpler, but I can't then make use of those lovely OO facilities like...er...prototyping...and other things I have yet to cram into my thick skull.

What do I do ? Is there a THIRD WAY ?

Please help, as this is holding me - and thus The World - back.

I'd like to sort this out before I leave to join the Ozone Ashram in Stockholm next month.

SaintJude



[This message has been edited by SaintJude (edited 07-30-2002).]

I'm lost.
how are you creating your objects?

you're using the "this" keyword correct?
um when you say class is that in the object oriented sense or the CSS sense?



.:[ Never resist a perfect moment ]:.

[This message has been edited by bitdamaged (edited 07-30-2002).]

[This message has been edited by bitdamaged (edited 07-30-2002).]

Actually, I don't see why you couldn't use the first method, except for the fact that you don't understand prototyping yet(prototyping being the heart of oop in js..). It sounds like it's just too early for you to go building an API right now.

I'm working on a tutorial covering oop in js, but it'll take a while 'till it's officially granted at gurusnetwork.com.

By the way, you don't have to use properties to let objects know each other, js can figure that out for you.

yup... I'm still lost...


Code - CGI - links - DHTML - Javascript - Perl - programming - Magic - http://www.twistedport.com
ICQ: 67751342

I have no idea what your trying to do.

But could someone tell me what prototyping is ? I understand OOP and its concepts but no .prototype.

Prototype is a way to create new properties or methods for existing objects.
Normally when you create an object, that is when you define the props for it

function myObj {
this.color = "red";
}

testObj = new myObj;

now testObj.color = "red";

you can of course change like so
testObj.color = "blue";

or add a new one like so
testObj.mood = "happy"

But say you want to create a new property for all "myObj"s then you can prototype it
myObj.prototype.mood = "happy";
now testObj.mood = "happy" as well as all other created instances of the object have the "mood" property.

I personally don't use this method of adding properties and methods instead using "this.prop" in my object constructor but some people use this method instead.



.:[ Never resist a perfect moment ]:.

Yeah, the difference between this:

function myObject()
{
this.something = 5;
this.somethingelse = "hi";
}

and this:

function myObject()
{
this.something = 5;
}
myObject.prototype.somethingelse = "hi";

is subtle. Really, the only difference between the two is that in the first case, every object created with

myobjectinstance = new myObject();

has its own somethingelse property, and they all happen to have the same value. In the second case, every object doesn't have its own separate somethingelse property, but rather looks in its prototype to find that property. This saves memory when you have many many isntances of an object.

So, in the first case:

myobjectinstance = new myObject();
alert(myobjectinstance.somethingelse); // finds the somethingelse property of myobjectinstance

But in the second case:

myobjectinstance = new myObject();
alert(myobjectinstance.somethingelse); // looks for the somethingelse property of myobjectinstance, but doesn't find it! So it looks in the myObject prototype and finds it there, giving you that value.

Prototypes are most commonly used to create methods for an object:

function Circle()
{
this.radius = 1;
this.centerx = 0;
this.centery = 0;
}
function findCircleArea() {
return this.radius*this.radius*Math.PI;
}
Circle.prototype.findArea = findCircleArea;

Doing that instead of merely saying

this.findArea = findCircleArea;

inside the Circle function saves memory if you create a large number of circles. There's no reason to have the findArea function defined separately for each of them.

(Of course, they wouldn't really be defined separately, but there would be many different references to the same function, which is unnecessary.)

I made much use of prototypes in my raytracer.

Thanks bitdamaged + Slime, it is all clear now.