JavaScript OOP classes and declarations

Question

Im finding it really difficult to grasp OOP in javascript.

Normally I would expect to have to create a class, and then create objects from that class.

However, according to one tutorial the following makes an object.

var egg = {}

Have I not just made an object named egg without actually making a class.

If thats the case how would I make multiple objects from an object :S

Also according to a different tutorial an object is made like below, which is completely difference to what I was told above :S

var Block = function(){

}

Can anyone help me unravel my confusion :(

Answer 1

Both of the above examples are correct. to put it simply EVERYTHING in javascript is an object. classes do not exist but there are many ways to imitate them. my favorite method is as follows:

    var myClass = function() { <----------------------------- class declaration

            var prop1,   
                prop2,   <------------------------------------ private properties
                prop3;

            var addMe = function( arg1, arg2 ) { <------------ private method
                var result = arg1 + arg2;
                return result;
            }

            var obj = { <------------------------------------- constructor method 
                Prop1: prop1,
                Prop2: value2,  <----------------------------- public properties
                Prop3: value3,

                Method: function() { <------------------------ public method
                    obj.prop3 = obj.prop1 + obj.prop2;   
                    return obj.prop3;
                }
            }

            obj.Prop4 = addme( prop1, prop2 ); <-------------- public property set 
                                                               with the private method
            return obj;
    }

    var myClassObj = new myClass;

myClassObj is now an object of myClass with four public properties Prop1, Prop2, Prop3, Prop4 and one public method called Method

Answer 2

Javascript is a different language than those that you have learned so far. You can't expect things to work exactly as they do when you change languages.

A quick sneak peek: in javascript, you can assign a function to a variable. I bet on those other languages you have used, that was not possible:

var myCounter = 1;
var myFunction = function(x){ return x + 1; };

Going back to your question: In javascript there are no "real classes". There are just objects. I know this might sound confusing at first.

Javascript's object model is called "prototypal inheritance". It's different than "classical" (pun intended) inheritance. And it is also not very cleanly implemented.

Basically, you start with one reduced set of objects (Array, Function, Object, etc. are Objects, not classes) and then you use those objects to build others. The relationships between them can be "class-and-instance-like", but they don't have to. They can be other kinds of relationships, too.

Since there are no classes, you can't create them. But you can create a regular object, assign it to the variable Car, and just think "I'm going to use this object to create lots of other objects. And those other objects will have some attributes by default, like methods and stuff, so that they behave like cars". And the language allows you do do that. Car will behave like a class does in other languages, and the objects it produces will be "like instances of Car".

To javascript, though, they will look like objects with some relationships between them.

In a way, prototypal inheritance is a "superset" of classical inheritance. You can do classical inheritance, but also other things.