JavaScript - Misunderstanding Prototyping

Hello. I have a few String prototypes such as
Code:

String.prototype.EscapeReg = function () { return this.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"); };
// Escapes characters for use with a regular expression

I also have my own class/ library which is used like this
Code:

var adg = new AndyG_ns.ADG_Utils();
adg.StartClock('AndyClock','dd mmm yy hh:nn'); // etc.

What I would like to do is to only add the prototype to my library (not to the global namespace).
The end result I'm looking for is to use code such as:
Code:

var adg = new AndyG_ns.ADG_Utils();
var myString = new adg.AString();
var parsed = myString.EscapeReg();

In addition, I want to be able to also use/create my special string sub-class within my library.

I suppose I'm saying that I would like to extend or super-class the native String object. Any guidance would be appreciated

Hi All

I thought it was about time to actually learn Javascript rather than pretend I know it, so I'm new to Javascript.

I've been reading Javascript 'The Good Parts' and have watched a few google videos on Youtube.

So I came across prototyping which seems to be quite fundamental to JS but is quite awkward to use. I am trying to avoid the use of the 'new' keyword and limit my application to one Global variable, as this can improve the JS scripts performance, reliability and security.

In essence I'm just trying to make a simple MsgBox object that has a method called 'alertMe', which in turn simply shows an alert box with 'Hello'

If this is not very clear then say so as trying to explain something you don't fully understand is quite hard.

Here's my code, doesn't alert when I called the object.
Have a look


Code:

var MyLib = {};
MyLib.MsgBox = function(){
	
			//Object methods
			MyLib.MsgBox.prototype.alertMe = function(){
				alert('Hello');
			};

};

MyLib.MsgBox.alertMe();

Any help and pointers will be very appreciated.
Regards, Magnetica

Hello there folks,

First time poster, so please be gentle

I am ok with using objects creating classes if someone else defines, but when it comes to defining my own, I hit a nasty brick wall...

I am using an XML/XSLT wrapper called Sarissa to help with programming a utility to transform XML into HTML in different views.

For this to happen, I have created a Loader class which loads in XML required. I am aware of prototyping for binding methods to objects (as opposed to replicating the same method every time an instance is created)... The aim being I want to create a progress bar for the essential files that need to be loaded in. Presently I have them load in Synchronous mode just to get the utility working, which I know is poor, so would like to address it.

So can someone answer me this:

I understand why this works:

Code:

var SWMU = new Object();

SWMU.stylesheets = new Object;
SWMU.joblot = null;
SWMU.cache = new Object;
SWMU.filtering = new Object;
SWMU.locns = null;

function Loader(sXml, sTitle) {
	this.doc = Sarissa.getDomDocument();
	this.doc.load(sXml);
	this.doc.summary = sTitle;
	this.doc.onreadystatechange =  function() {if(this.readyState) 
		{alert(this.summary + " state change to..." + this.readyState);} else 
		{alert(this.summary + " state change to..." + this.doc.readyState);}
	}
}

function async() {
	SWMU.stylesheets[0] = new Loader("swmu_test/swmu_berthing.xsl", "Main SWMU Stylesheet");
	SWMU.stylesheets[1] = new Loader("assets/xsl/controls.xsl", "Drop down boxes");
}

function _init() {	
	async();
}

as it recreates the "this.doc.onreadystatechange" anonymous function everytime an instance is created (which is yuck).

However, when I do this (using prototype)...

Code:

var SWMU = new Object();

SWMU.stylesheets = new Array;
SWMU.joblot = null;
SWMU.cache = new Object;
SWMU.filtering = new Object;

// Now define the Loader object
// Create the loader method for dealing with items loaded
function Loader(sXml, sTitle) {	
	this.doc = Sarissa.getDomDocument();
	this.doc.load(sXml);
	this.doc.summary = sTitle;
}

function rHandler() {alert(this.summary + " State changed to... "+this.readyState);}

// Create the request handler 
Loader.prototype.doc = {};
Loader.prototype.doc.onreadystatechange = rHandler;

function async() {
	SWMU.stylesheets[0] = new Loader("swmu_test/swmu_berthing.xsl", "Main SWMU Stylesheet");
	SWMU.stylesheets[1] = new Loader("assets/xsl/controls.xsl", "Drop down boxes");
}

function _init() {	
	async();
}

Nothing happens and no errors are thrown, though there should be an alert box everytime there is state change to the progress of a file loading.

Can someone help me with this? Apologies if this is on the basic side, but it has been causing me a headache all week, and I can not find any answers on this.

Shaun