How do you guys extend your classes in JS

[Chris]

I always see people using some fancy extend function and I always ask myself why.. Is this not supported in every browser?

Code: Select all

lol = function(){ this.haha = 'lol' }
haha = function(){ lol.call(this) }
new haha()

result:

Code: Select all

haha {haha: "lol"}

[hallsofvallhalla]

what version of Internet Craporer is it supported up to?

[Chris]

From what I can tell at leats IE 6

Alerts lol:

Code: Select all

javascript: lol = function(){ this.haha = 'lol'; }; haha = function(){ lol.call(this); }; alert(new haha().haha); void 0;

[hallsofvallhalla]

interesting.....

[Jackolantern]

If I am using jQuery (and I usually have it loaded through a popular CDN), I will typically use jQuery's extend function. If I don't have it loaded, or I am in node or something else, it isn't that hard to just recreate it.

While it is a bit off-topic, I thought I would mention something pretty cool I stumbled across the other day. Support for it is still spreading, and obviously won't work in ancient versions of IE, but Object.create() is a very cool function. One of the issues with working extensively with JS object literals is that they lend themselves much better to being one-off objects, rather than something to be instantiated with independent data. This is one of the reasons I have heard people cite as to why they use object constructor functions rather than literals (and although it is a taste thing, I believe object literals are simply more powerful than constructor methods and using "new"). But Object.create() allows you to create more of the same object, with independent data. It is almost like having a "new" keyword for object literals!

[fang]

Code: Select all

parent.call(this)

The problem with this method is that the parent's prototype chain is lost.

Code: Select all

>>> function objparent() { this.what = 'lol' }
undefined
>>> objparent.prototype.WHAT = function() { console.log('what') }
function()
>>> function myobj() { objparent.call(this) }
undefined
>>> myobj.prototype.something = 'abc'
"abc"
>>> x = new myobj()
x { what="lol", something="abc"}
>>> x.WHAT()
TypeError: what.WHAT is not a function

I'd recommend also adding, just before the child object prototype properties are added, something along the lines of

Code: Select all

myobj.prototype = new objparent;

This might not work in legacy browsers though; anyone know offhand?