Learn Dash Ajax Dot Com

Confessions of a web developer

JavaScript..."prototype" or Just Add a Property or Method?

clock March 27, 2008 22:47 by author nickyt
Do I prototype my objects with my properties and methods or do I just add properties in the constructor?

Think of it this way. The "prototype" methods and properties are always a part of your objects. Create a property or method without the prototype keyword if you want to decorate an existing object. Why? Because the more you prototype, the heavier the object becomes, so... prototype carefully. I guess an exception to this is if you are creating a singleton class, prototyping is probably not necessary as it is not instantiated so just going this.SomeMethod = ... is fine. Anybody have comments on that?

The Prototype JS framework is great but all the "prototyping" creates heavier objects that inherently might not have been as heavy. As well by prototyping an inherent data type like Object, you risk breaking existing JavaScript code that tries to integrate with a framework like Prototype because it's "prototype"ed all these new properties and methods on HTMLElements or the Object inherent data types.

Having said all that, JavaScript frameworks are great for RAD deployment, but I still stick by my guns when I say that with lots of data and objects on a page, this heavily protoyped framework mindset definitely slows things down. See my original post.

Tags:
Categories:
Actions: E-mail | Kick it! | Permalink | commentComments (3) | RSS comment feedComment RSS

Listen to NIN

clock March 27, 2008 21:53 by author nickyt
This not tech related, but it's just good music (in my opinion).

If you're a fan of NIN (Nine Inch Nails), take a listen below. They've made some serious cash by separating themselves from their record label.



Tags:
Categories:
Actions: E-mail | Kick it! | Permalink | commentComments (1) | RSS comment feedComment RSS

JavaScript, Objects, Callbacks and the "this" Pointer Issue

clock March 27, 2008 21:48 by author nickyt
So for those of you who code JavaScript, you may have come across this problem before. You JS class' method calls a callback method that is in the same or another class. The callback method gets called and in that method there's a line like this.myProperty which for argument sake is set to "Great... not another hello world! example" . Accessing this.myProperty evaluates as undefined? Wait a minute... I set this already! The problem is the "this" reference becomes the event element which might be the document or it might be a DOM element. This is normal JavaScript functionality.

So how do we get around this? In every object constructor, we will create a property called "me". This variable must be in the class with the var keyword in front of it or else the "me" variable will be considered global scope and be overwritten by any other singleton class or class instance.

I believe that it was Douglas Crockford who first pointed this out, check out his site http://www.crockford.com.

Check it out in action below:

<html>

<head>

<script>

Singleton = new function() {

var me = this

this.funcName = "Singleton"
this.Test = function() {

setTimeout(this.Alert, 1000)

}
this.Alert = function() {

alert("The this pointer does not work! funcName = " + this.funcName)

alert("The 'me' variable works! funcName = " + me.funcName)

}

}
function InstanceClass() {

var me = this

this.funcName = "InstanceClass"
this.Test = function() {

setTimeout(this.Alert, 1000)

}
this.Alert = function() {

alert("The this pointer does not work! funcName = " + this.funcName)

alert("The 'me' variable works! funcName = " + me.funcName)

}

}
function init()

{

Singleton.Test()

var oClass = new InstanceClass()

oClass.Test()
}

</script>

</head>

<body onload="init()">

</body>

</html>

Tags:
Categories:
Actions: E-mail | Kick it! | Permalink | commentComments (6) | RSS comment feedComment RSS

Some Debugging Tips

clock March 27, 2008 21:47 by author nickyt
Here's my response to this article, Using Visual Studio to Debug Javascript in IE by kubben on codeproject.com

All studio products since Visual Studio 6 allow you to debug client-side JavaScript via F5 (debug) or by adding the keyword "debugger" to your JavaScript source.

I would not recommend enabling/disabling debugging in Internet Explorer (IE) as you might wonder sometimes why the debugger is not firing. Why would you disable it? Well believe it or not, tonnes of sites have JavaScript errors so it can become annoying if you're surfing the web.

I know it sounds obvious to enable debugging in Internet Explorer, but I've seen it happen to many people and they never bother to check the obvious. A better idea is to have a windows account on your machine (your developer account) that has IE setup to be in debug mode for developing web applications. As well set your cache in Internet Explorer to the lowest number of MB possible. Also set your IE cache options to check "Every visit to the page".

Also be wary when debugging a static HTML page. If you make changes to a static HTML page, it doesn't always get updated, even with the above caching options set. I get around this by adding a querystring and changing it whenever I make changes to the HTML page. This only applies to you current browser session. If you close the browser and open the page again, it should be updated.

There is also a cool tool called the IE Developer Toolbar that you might want to check out,

This is all great if you're debugging only IE (probably a corporate scenario), however in the wonderful world of the Internet, more than IE needs to be supported.

Yes, I know IE still dominates, but 15% or whatever Firefox is at these days, is still a lot of people and Mac users are all about Safari or Firefox. Basically you want as many people seeing your site and seeing your site well.

Sooo....

Firefox has a cool add-on called FireBug, as well as another cool tool called the DOM Inspector which comes with Firefox by default.


You also might want to look into JSDoc, http://jsdoc.sourceforge.net, and JSUnit, http://www.jsunit.net, for speeding up development in the long run because you have API docs to reference and creating code that follows a certain standard.

Cheers,
Nick ;)

Tags:
Categories:
Actions: E-mail | Kick it! | Permalink | commentComments (1) | RSS comment feedComment RSS

Sign in

Powered by BlogEngine.NET 1.6.0.0 | Original Design by Arcsin, Adapted by RazorAnt