Objects in JavaScript

Introduction

In the previous article, we learned about the concept of dialog boxes in JavaScript its types with examples.

In this chapter, we will learn about Objects and their types in JavaScript with example programs.

Objects

Objects are used to store collections of data and complex entities. Objects are variables too, but they can contain many values.

JavaScript objects belong to the Non-Primitive Data type.

Types of Objects

User-defined Objects
Built-in Objects

User-defined Objects

In the objects that are defined/created by the user to solve any given problem. Users can create their own objects, such as Student, House, Car, Company, etc...

Built-in Objects

A built-in object is an object that is of the primitive and non-primitive data types, handling some specific tasks. They are different types of Objects in JavaScript

Common reference Objects

Array Object
Boolean Object
Math Object
Date Object
String object
Regular Expression Object

DOM (Data Object Model)

Attributes Object
Element Object
Style Object
Document Object

BOM (Browser Object Model)

Windows Object
Navigator Object
Location Object
Screen Object
Storage Object

Object Creation

There are three types of objects that can be created in JavaScript.

By Object literal
By creating an instance of the object
By using Constructors

We can access the properties and method of the object,

By Dot operator – objname. property value
By Square brackets – [property]

Creating an object in a literal way

Example

<!DOCTYPE html>
<html>
<head>
<title>Objects in JavaScript</title>
<meta charset="utf-8">
</head>
<body>
<h2>By Object literal</h2>
<script type="text/javascript">
var student={}; //literal
student.name= 'VijayKumar';
student.rollno= '17CS095';
student.dept= 'CSE';
student.year= '3rd year';
document.write(student.rollno);
</script>
</body>
</html>

Output

Creating Instance of an Object

Example

<!DOCTYPE html>
<html>
<head>
<title>Objects in JavaScript</title>
<meta charset="utf-8">
</head>
<body>
<h2>Instance Of an Object</h2>
<script type="text/javascript">
var Faculty= new Object(); // instance of an Object
Faculty.name= 'RajKumar';
Faculty.rollno= '950';
Faculty.dept= 'ECE';
Faculty.salary= '30,000';
document.write("Faculty name :"+Faculty.name,"<br/>"+"Depeartment :"+Faculty.dept);
</script>
</body>
</html>

Output

By using a Method Constructors

Example

<!DOCTYPE html>
<html>
<head>
<title>Objects in JavaScript</title>
<meta charset="utf-8">
</head>
<body>
<h2>Constructor Objects</h2>
<script type="text/javascript">
function student(name, rollno, dept, year,) //Methods constructor
{
this.name=name;
this.rollno=rollno;
this.dept=dept;
this.year=year;
}
var student1= new student("Vijay",95,"CSE","3rd year");
var student2= new student("Surya",80,"ECE","3rd year");
var student3= new student("Naveen",90,"EEE","2rd year");
document.write(student1.dept,"<br />");
document.write(student2.name);
</script>
</body>
</html>

Output

Array of Object

Array is a collection of similar data types. Array is another programming language. It is a data type, in JavaScript Array is an Object. It stores the multiple values in a single variable. We can declare an Array Object in JavaScript in three ways,