Why can't I bind a property to an object using the prototype?

Question

I have the script...

 var MyClass = {
        someText: 'Hello World'
    };


    jQuery(document).ready(function () {

        console.log(MyClass.someText);
        MyClass.prototype.someText = 'proto Hello World';
        console.log(MyClass.someText);

    });

But I get an exception saying...

Microsoft JScript runtime error: `MyClass.prototype is null or not an object`

But when I read about the prototype it says its avaiable to all instances of an object but the above seems to disprove this. Whagwan?

Answer 1

Why does my javascript not work?

Because you do not understand how prototypes work. Functions define prototypes, objects inherit.

var MyClass = function () { };
MyClass.someText = 'Hello World';
MyClass.prototype.someText = 'proto Hello World';

To get an object that inherits a prototype property or method, you need to create an instance:

var myInstance = new MyClass();
console.log(myInstance.someText);

You can also create an object with a particular internal [[Prototype]] by using the ES 5 method Object.create() :

var myObj = Object.create({someText: 'proto Hello World'});
console.log(myObj.someText);

Answer 2

If you create the MyClass object like this:

var MyClass = function() {};

Then the prototype is automatically created.

Answer 3

Try this

var MyClass = { someText: 'Hello World' };

jQuery(document).ready(function () {

        console.log(MyClass.someText);
        MyClass.someText = 'proto Hello World';
        console.log(MyClass.someText);

});

or

   var MyClass = function () { };
   MyClass.someText = 'Hello World';
   MyClass.prototype.someText = 'proto Hello World';

Answer 4

You do not need the .prototype in this instance:

var MyClass = {     someText: 'Hello World' }; 
alert (MyClass.someText);
MyClass.someText = 'proto Hello World';
alert (MyClass.someText);

will alert "Hello World" and "proto Hello World"

EDIT: I wanted to follow up with some useful information - not really super new but perhaps this will help someone along the way to success.

SOME BACKGROUND: http://ejohn.org/blog/simple-class-instantiation/

Working example: http://jsfiddle.net/MarkSchultheiss/4GZha/#base

// makeClass - By John Resig (MIT Licensed)

function makeClass() {
    return function(args) {
        if (this instanceof arguments.callee) {
            if (typeof this.init == "function") this.init.apply(this, args.callee ? args : arguments);
        } else return new arguments.callee(arguments);
    };
}
var MyClass = makeClass();
MyClass.prototype.init = function(newText, newThing) {
    this.someText = newText == undefined ? 'defaultText' : newText;
    this.newThing = newThing == undefined ? 'defaultThing' : newThing ;
;
    this.gobble = 'turkey';
    this.cracker = 'cheese';
}

MyClass.prototype.otherText = 'otherstuff';
var trustme = MyClass('trustmedude');
alert(trustme.someText +":"+ trustme.newThing);
var iam = MyClass('some new text', 'mything');
alert("tmething "+trustme.newThing);
alert(iam.someText); //returns "some new text"
iam.someText = 'hi fred';
alert(iam.someText); //returns "some ne text"
alert(iam.otherText); // returns "otherstuff"
alert(iam.newThing); //returns "mything"
alert(MyClass.someText); //returns undefined
alert(MyClass.otherText); //returns undefined
alert(iam.cracker + iam.gobble); //returns "cheeseturkey"
alert(iam.hasOwnProperty("someText")); //returns true