Objects in JavaScript with example

This article is about objects in Javascript with example detailed step-by-step. Objects are one of the most important crucial concepts that you need to understand.

What is an object in general?

Object

• Anything in this real world you can consider an object. For ex: A car standing in front of your house you can consider an object, in Your house itself you can consider an object, Student, Employee, Company, Point, Button, etc.
• Objects have attributes and behaviors.

Attribute

• It is a property of an object.
• For Ex: Color, model, address, roll num, width, height, etc. Color, model, and speed are attributes of the car because Car objects have Color, speed, and model. Address and roll num are attributes of student objects because students have address and roll num. Width and height are attributes of a Rectangle object because Rectangle shapes have width and height.

Names of attributes and the names of objects represent nouns in English. Generally, the object names and attribute names will be nouns.

Behavior

• The functionality of an object is what an object can do or what we can do to the object.
• For ex: start, stop, and accelerate are behaviors of a car object because, we can start the car, stop and accelerate the car. To stop the car we can set the speed of it to zero, to accelerate the car we can increase the speed of the car so, behaviors are actually meant to modify the values of attributes or properties.
• Paint is a behavior of a house because we can paint the house with some color, so the house is an object, color is an attribute of the house and paint is the behavior of the house.

The names of behaviors they all represent work in English, so generally, the behavior names will be verbs.

Step-by-step for solving any real-world problem

1. While solving any real-world problem, first we identify objects present in that problem.
2. Then we identify the attributes and behaviors of each object.
3. Then we convert the identified real-world objects into software world objects using the language construct known as an object.

Note: JavaScript objects help us to represent any real-world object in our web world. W can represent a car, house anything we represent with the help of JS objects in the web world.

What is an Object in JavaScript?

We know that to solve any real-world problem with the help of software, we must represent real-world objects present in that problem as the software (web) world objects. And that we do with the help of JavaScript Objects.

JavaScript objects help us to represent real-world objects as the software(web) world objects.

We know that JavaScript is an object-based or prototype-based language. I.e. in JS objects are created or built with the help of “prototypes”.

Prototypes

It is an object, which contains common functionalities that the javascript object inherits. I.e. when a “javascript object” is created; it inherits the common functionalities present inside a prototype object from which it is built.

JavaScript Object

We know what is an object in general, in general objects contain a collection of attributes and behaviors. Javascript object is also a collection of attributes and behaviors they also have one extra that is a “prototype” from which they are built. Any Javascript object is a collection of properties (or) attributes & behaviors and it has a prototype.

Property

It is a key-value pair. These can be a data property or function properly.

• “Key” is the name of the property
• “Value” is the value of the property and it can be data, an object, or a function.

Data property (attribute)

If a property’s value is a data or an object then it is called a data property. It represents an attribute of an object.

Function property (behavior)

If a property’s value is a function then it is called a function property or method. It represents the behavior of an object.

Remember some Important notes

1. JavaScript object is a collection of properties. The property can be a Data or Function property.
2. Every JS object is associated with a prototype from which it is built.
3. All JS object inherit their common functionalities from their prototype.
4. JS objects are dynamic in nature. i.e. we can add properties to an object OR delete properties from an object at run time.
5. JS objects are an associative array (key value) like data structure.

Types of objects in JS

While solving a problem we take the help of this both types of objects. There are 2 types of objects :

• Built-in objects
• User-defined objects

Built-in objects

Objects that are predefined or already build in the language and are responsible for handling some specific task.
Example:

• Common reference objects:
  Number, Boolean, String, Math, Date, RegExp, Array, Function, Object,
• DOM (Document Object Model) reference objects:
  Document, elements, Attributes, Events, Style,
• BOM (Browser Object Model) reference objects:
  Window, Navigator, Screen, History, Location, Storage,
• Other reference objects:
  Global, Error, Conversion, Storage, Arguments, Statement, etc.,

User-defined objects

Objects that are defined or created by the programmer to solve any given problem.
Example:
car, House, College, Employee, Point, Button, etc

Conclusion

So, I hope you will learn what is general objects and objects in javascript with example through this article.