What's the difference between a JavaScript object and an OO/UML/Java object?

Question

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

Answer 1

JavaScript objects are different from classical OO/UML (C++/Java/C# etc.) 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,

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

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

    var numeral2number = { "one":"1", "two":"2", "three":"3"}

which associates the value "1" with the key "one", "2" with "two", etc. 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,

    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:

    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

    var o = new C(...)

The type/class of such a typed object can be retrieved with the introspective expression

    o.constructor.name  // returns "C"

See my JavaScript Summary for more on JavaScript objects.