JavaScript: new Operator

Last update on August 19 2022 21:50:38 (UTC/GMT +8 hours)

Description

The new operator is used to create an instance of a user-defined object type or one of builtin object types which have a constructor function.

Syntax

var objectName = new objectType(param1, param2, ...., paramN);

Parameters

objectName: Name of the new object.

objectType: The type of the object.

param1, param2, ....paramN : Property values for the object.

To create a user-defined object type following steps are required.

Write a function to define the object type

Use new operator to create an instance of the object.

Example: Object type and object instance.

Suppose we want to create an object type for students with three properties name, class, and rollno. To do this first declare the following function.

function student(name, class, rollno)
    { 
    this.name = name;
    this.class = class 
    this.rollno = rollno;
    }

To create an object called studentvi declare the following statement.
studentvi = new student("David Rayy", "VI", 12)

The above statement creates an object called studentv and assigns it the specified values for its properties. Therefore the value of studentv.name is the string "David Rayy", studentv.class is the string "VI" and student.rollno is the integer 12. You can create any number of student objects by calls to new.

Example: Object property that is itself another object.

To create the student object once again declare the said function once again

function student(name, class, rollno)
    {
    this.name = name;
    this.class = class 
    this.rollno = rollno;
    }

And then instantiate two new student objects as follows:

studentv = new student("John", "V", 10)

studentvi = new student("David Rayy", "VI", 12)

Now create an another object called school with school name, address, city, sdetails where sdetails prperty takes a student object as follows.

function school(sname,  city, sdetails )
    { 
    this.sname = sname;
    this.city = city;
    this.sdetails = sdetails;
    }

To instantiate the new objects, use the following statements :

school1 = new school("Dubai International School", "Dubai", studentv)

school2 = new school("New Delhi International School", "New Delhi", studentvi)

The above statement pass the objects studentv and studentvi as the parameters for the school. To get the name of the student belongs to school2 youn access the following property:

school2.sdetails.name

Example:

The following web document shows how the new operator is used.

HTML Code

<!doctype html><head>
<meta charset="utf-8">
<title>JavaScript new operator example.</title>
<meta name="description" content="This document contains an example of JavaScript new operator"/>
</head>
<body>
<script src="javascript-new-operator-example1.js"></script>
</body>
</html>

JS Code

var date1 = new Date(); 
var newParagraph = document.createElement("p");
var newText = document.createTextNode('The date is : '+date1); 
newParagraph.appendChild(newText);
document.body.appendChild(newParagraph);

View the example in the browser

Practice the example online

See the Pen new-1 by w3resource (@w3resource) on CodePen.

Previous: JavaScript: instanceof Operator
Next: JavaScript: this Operator