Rethinking JavaScript Objects ( 4 Views )

no kitty!

Discussion thread for Rethinking JavaScript Objects

This is a dedicated thread for discussing the SitePoint article 'Rethinking JavaScript Objects'

(ali, Kiribati)

Coding in one language but with expecting it to behave like another one is not good practice.. There is no point in creating "getters" and "setters" for properties in JS, as an interpreted language *everything* you code is available to the user, at runtime and source code. There's no security in it, JS is meant for interaction scripting only.

(ali, Romania)

Nice article, bookmarked. :)

Incidentallly, the extends() method is exactly what Prototype (the framework/library) does.

(emrah, Benin)

Thanks for the article. I am new to javascript and this helps in understanding and dealing with javascript classes.

(burcay, Marshall Islands)

I do not see why I cannot use just:
ClassB.prototype = new ClassA;
Regarding you it copies only the object's properties. Well, I am not sure.

I wrote a test:

function ClassA(){

var _propA = 'private property A';

this.propA = 'Property A';
this.testA = function(){
alert('I am class A');
}

this.getA = function(){
alert('getA = '+ _propA);
}
}

ClassA.prototype = {
test : function(){alert('ClassA prototype function');}
}

function ClassB(){
/*
this.superclass = ClassA;
this.superclass();
delete this.superclass;
*/

this.propB = 'Property B';
this.testB = function(){
alert('I am class B!');
}
}

ClassB.prototype = new ClassA();

var oB = new ClassB();
oB.testA();
alert('oB.propA =' + oB.propA );
alert('oB._propA =' + oB._propA );
oB.test();
oB.getA();

It class B inherits everything from class A expect the private property.

(ersin, Lithuania)

I just want to agree with the comment about default members. The best thing about objects is in their use as hashtables. I religiously keep the Object prototype 'clean', otherwise FOR .. IN loops go astray. The if it were possible to prevent certain members from appearing in enumeration, things would be sweeter.

(erhan, Morocco)

I was looking for the solution of another when I bumped on to this article, but I'm glad I did.

(can, Gambia)

I like to share a slightly modified extending method...

Code:

// JavaScript Document : extending.js // implementing javascript inheritance Object.prototype.version = 0; Object.prototype.className = "CObject"; Object.prototype.name = "Object" Object.prototype.superClass = "CObject" Object.prototype.extending = function extending(vSuper) { //method to inherit other objects /* modified to accept object.extending('CObject') but keeping object.extending(new CObject()) as before... (for a while) */ oSuper = (typeof(vSuper) == 'string') ? eval('new '+vSuper+'()') : vSuper; for (sProp in oSuper){ this[sProp] = oSuper[sProp] }; this.superClass = oSuper.className; delete(oSuper); }; var propReadOnly = true; var propReadWrite = false; Object.prototype.addProperty = function addProperty(sName /*Property name*/, vValue /*Initial value*/, bReadOnly /*Only to be read ?*/) { this.protect = Function(); //to difference between protected and public methods this.protect[sName] = vValue; //add property this.protect["flag"+sName] = bReadOnly; //set flag for writeprotected property var sFuncName = sName.charAt(0).toUpperCase() + sName.substring(1,sName.length); this["get"+sFuncName] = function getter() { return this.protect[sName]; }; this["set"+sFuncName] = function setter(vNewValue) { if(!this.protect["flag"+sName]) { //Not writeprotected ? if(this.protect[sName] != vNewValue) { //if new value this.protect[sName] = vNewValue; //change the value this["on"+sFuncName+"Change"](); //call event handler }; }; }; this["on"+sFuncName+"Change"] = function onSetGetChange() { }; //empty event handler };

(yeliz_03, Wallis and Futuna)

This implementation has a couple drawbacks/side effects:
1) Prototyping the Object: now all of your hastables now have some default members. You'll need a custom iterator to skip over them.
2) You still need the ClassB.prototype = new ClassA; syntax, or the instanceof operator is broken.

(eyüp, Bermuda)

Very good article, I used to read the content of a function (class) that I wanted to inherit from and then eval it inside the new class, this is a much better way to do it... thanks!

Azvareth

(faruk, Sri Lanka)

I like what you do with sets and gets, especially adding the ability to strongly type variables.

However, I don't see the benefit of using onpropertychange the way you do. Why not add a final parameter to the addProperty method? You could pass in s if you only want a set, g if you only want a get, and sg, gs or nothing at all if you want both (assuming the final parameter defaults to sg ).

This would have several advantages. The addProperty method call would indicate instances where set or get would be omitted. Calls to set or get would not require the performance hit of a sub function call. If there was not supposed be a set method, trying to call it would produce an error which is a good thing for debugging purposes.

(ümit, Pakistan)

interesting, but I have some quibbles.

The extends function does come at a cost in that instead of inheriting methods, all of the parent object's functions are added to each object of the inheriting class. At some point this becomes a performance issue.

Also, I don't see any reason to require new in the call to extends. Why not have the function instantiate the super object?

Here's a different version of extends which addresses the above:

Object.prototype.extend = function(superClass) {
oSup = new superClass();
for(sProperty in oSup) {
if(typeof(oSup[sProperty]) != "function") {
this[sProperty] = oSup[sProperty];
}
}
}

The downside of this approach is that it goes back to using subclass.superclass.prototype = new superclass() to inherit methods. Thus it requires more typing, and disables multiple inheritance of methods (although not of properties).

Obviously, one can accept my moving of new into extends , and discard my filtering of functions .

(erdal, Iceland)

Well written and presented. Honestly, in all my OO JS experience, I have yet needed such stringent OO features - maybe I'm just not working on the right projects :D

Great job!

(ali, Belgium)

Quote:

Originally Posted by Anonymous

Love the artice! One question, when I enter the code, extends shows up like a javascript keyword. and I get an error in IE6 and netscape?

The problem is that "extends" is actually a reserved word in JavaScript. On my system, I tested the code in the article without an trouble. If you experience problems, just changing the name of the method will fix it. Suggestions:

Extends
_extends

Nicholas

(Gürcan, French Guiana)

Love the artice! One question, when I enter the code, extends shows up like a javascript keyword. and I get an error in IE6 and netscape?

(baver, Heard Island and Mcdonald Islands)

Good article. Another link

http://sourceforge.net/projects/jsclass/

Quote:

JSClass is a JavaScript parser/interpreter object that facilitates class-based inheritance, encapsulation (Public, Protected & Private), packages, clean syntax and much more, for JavaScript.

(can, Norway)

Very nice article, thank you. It is doubly useful for me because the server-side language I use is JScript ASP.

On a related note, I saw a link on youngpup.net the other day to http://www.technicalpursuit.com/

I highly recommend checking them out. They have created a cross-browser compatible extension to JavaScript which implements the OOP concepts of Polymorphism, Inheritance, and even Encapsulation. Check out their online PDF documentation for more information.

(ahmet, Lao People's Democratic Republic)

How many of you have read ECMAScript 3.0,4.0 specs?

(elif, Kazakhstan)

Rethinking JavaScript Objects ( 4 Views )

Related Topics ... (or search in 1.720.883 topics !)