What's the Difference Between a JavaScript Object and a UML/Java Object?

In standard OO, as defined by UML, and instantiated by Java, there is a certain concept of object. What's the difference between this classical concept of objects and a JavaScript object?

JavaScript objects are different from classical OO/UML objects. In particular, they need not instantiate a class. And they can have their own (instance-level) methods in the form of method slots, so they do not only have (ordinary) property slots, but also method slots. In addition, they may also have key-value slots. So, they may have three different kinds of slots, while classical objects (called "instance specifications" in UML) only have property slots.

JavaScript objects can be used in many different ways for different purposes. Here are five different use cases for, or possible meanings of, JavaScript objects:

1. A record is a set of property slots like, for instance:

   JavaScript

   var myRecord = { firstName:"Tom", lastName:"Smith", age:26}

2. A map (or 'hash map' or 'associative array') is a set of key-value slots. It supports look-ups of values based on keys like, for instance:

   JavaScript

   var numeral2number = { "twenty one": 21, "twenty two": 22, "twenty three": 23}

   which associates the integer value 21 with the key "twenty one", "22" with "twenty two", etc. Notice that a key need not be a valid JavaScript identifier, but can be any kind of string (e.g. it may contain blank spaces).

3. An untyped object does not instantiate a class. It may have property slots and method slots like, for instance:

   JavaScript

   var person1 = {  
     lastName: "Smith",  
     firstName: "Tom",
     getInitials: function () {
       return this.firstName.charAt(0) + this.lastName.charAt(0); 
     }  
   };

4. A namespace may be defined in the form of an untyped object referenced by a global object variable, the name of which represents a namespace prefix. For instance, the following object variable provides the main namespace of an application based on the Model-View-Controller (MVC) architecture paradigm where we have three subnamespaces corresponding to the three parts of an MVC application:

   JavaScript

   var myApp = { model:{}, view:{}, ctrl:{} };

5. A typed object o that instantiates a class defined by a JavaScript constructor function C is created with the expression:

   JavaScript

   var o = new C(...)

   The type/class of such a typed object can be retrieved with the following introspective expression (however, unfortunately, not in Internet Explorer):

   JavaScript

   o.constructor.name  // returns "C"

   Such a typed object may 'inherit' methods from the prototype object, or from the prototype chain, of its constructor. This is similar to inheritance in class-based OO languages.

JavaScript objects can also be used to emulate enumeration types and factory-based classes. You can read more about this in the first chapter of my book on Engineering Frontend Web Apps with Plain JavaScript.