Object

An object is a container for values in the form of properties and functionality in the form of methods.

Objects

• Provide functionality through methods. Methods may or may not return values.
• Provides data storage in properties
• The name of the property is a key
• The contents of a property is known as a value

Objects can be categorized into three distinct kinds of objects

1. Native Objects – These objects are native to JavaScript. Some examples of these native objects are Number, String, Array, Boolean & Object. No matter where the JavaScript program is run, it will have these objects.
2. Host Objects – These objects are provided by the environment also known as the host environment, where the JavaScript program is running. The browser has hundreds of different host objects. For e.g., document, console, Element, etc.
3. Your Own Objects

Object Literal

Object literals are one common way to create objects. An object literal holds data or information about a particular thing at a given time. Object keys or property names in JavaScript are of type String. You use dot notation or square bracket syntax for accessing the values of keys or property names. If the key or property name is not a valid JavaScript variable name then its value can only be accessed via square bracket syntax. For e.g., an object with a key of “full name”, its value would be accessed using person[“full name”].

Understanding this

To programmatically modify the state of an object or call one of it’s methods from itself we use the keyword this.

Creating Multiple Instances with Constructors

Object literals aren’t the only way to create objects. Object literals are handy when creating one off objects or passing values to a function. Maintaining code with several object literals of the same type can get cumbersome. If you want to create multiple objects of the same kind or type, we need to make use of Constructor functions. A constructor function describes how an object should be created & it will create similar looking objects. Each object created is known as an instance of that object type. An instance is the specific realization of a particular type or object. Constructor functions help in organizing the code by preventing repetition thereby keeping the code DRY.

Prototypes

A Prototype is basically an encapsulation of properties that an object links to. So we can have properties and methods that are on an object’s prototype and for every copy of that object that we have it all links back to the same prototype. It’s much more efficient to have one copy of all of those object methods out there sitting inside the object prototype.

Methods with Prototypes

JavaScript provides a way to organize our code with constructor functions using a special property called prototype. The prototype on a constructor function is an object like an object literal. JavaScript is known as a prototypal programming language which means you can use prototypes as templates for objects for sharing values and behaviors between instances of objects. The prototype property allows us to add properties and methods to objects with the same constructor function.

Prototypal Inheritance

The technique used in JavaScript to share functionality between similar types of objects is known as Prototypal Inheritance.

Consider an application which has objects with similar properties and behavior. Creating separate constructor functions for each type of object would result in a lot of work, especially if the objects share the same behavior. Fortunately, we can use Inheritance to solve this problem and make our programming simpler. Inheritance is a programming technique that lets you share the same code between similar types. For example, if we wanted to extend the playlist application to include movies as a playlist item, both Song and Movie objects have the following properties – title, duration, isPlaying. They also have same behaviors such as play() and stop(). The differences are, say for example, that the song has an artist and the movie has a year. For all this common code, we could create a Media type with title, duration, and isPlaying properties. It can also have play and stop behavior. We can then link it to other types of media, in our case it’s the song and movie. This linking is called creating a prototype chain. When you access a property or method on an object, the JavaScript interpreter checks if it’s directly on the instance. If it’s not, it will check the prototype. If it’s not there, it will check the next prototype up the chain.