DEV Community

Gayathri.R
Gayathri.R

Posted on

Javascript object constructor

Object Constructor Functions
Sometimes we need to create many objects of the same type.

To create an object type we use an object constructor function.

It is considered good practice to name constructor functions with an upper-case first letter.

Object Type Person

function Person(first, last, age, eye) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eye;
}
Enter fullscreen mode Exit fullscreen mode

Note

:
In the constructor function, this has no value.

The value of this will become the new object when a new object is created.
Property Default Values
A value given to a property will be a default value for all objects created by the constructor:

Example

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
  this.nationality = "English";
}

Enter fullscreen mode Exit fullscreen mode

Adding a Property to an Object

Adding a property to a created object is easy:

Example

myFather.nationality = "English";
Adding a Method to an Object
Adding a method to a created object is easy:

Example

myMother.changeName = function (name) {
this.lastName = name;
}

JavaScript Object Constructors
Object Constructor Functions
Sometimes we need to create many objects of the same type.

To create an object type we use an object constructor function.

It is considered good practice to name constructor functions with an upper-case first letter.

Object Type Person
function Person(first, last, age, eye) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eye;
}
Enter fullscreen mode Exit fullscreen mode

Note:

In the constructor function, this has no value.

The value of this will become the new object when a new object is created.

See Also:
The JavaScript this Tutorial

Now we can use new Person() to create many new Person objects:

Example

const myFather = new Person("John", "Doe", 50, "blue");
const myMother = new Person("Sally", "Rally", 48, "green");
const mySister = new Person("Anna", "Rally", 18, "green");

Enter fullscreen mode Exit fullscreen mode

const mySelf = new Person("Johnny", "Rally", 22, "green");
Property Default Values
A value given to a property will be a default value for all objects created by the constructor:

Example

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
  this.nationality = "English";
}
Enter fullscreen mode Exit fullscreen mode

Adding a Property to an Object

Adding a property to a created object is easy:

Example

myFather.nationality = "English";

Note:

The new property will be added to myFather. Not to any other Person Objects.

Adding a Property to a Constructor

You can NOT add a new property to an object constructor:

Example
Person.nationality = "English";
To add a new property, you must add it to the constructor function prototype:

Example
Person.prototype.nationality = "English";
Constructor Function Methods
A constructor function can also have methods:

Example

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
  this.fullName = function() {
    return this.firstName + " " + this.lastName;
  };
}
Enter fullscreen mode Exit fullscreen mode

Adding a Method to an Object

Adding a method to a created object is easy:

Example

myMother.changeName = function (name) {
  this.lastName = name;
}
Enter fullscreen mode Exit fullscreen mode

Note:
The new method will be added to myMother. Not to any other Person Objects.

Adding a Method to a Constructor

You cannot add a new method to an object constructor function.

This code will produce a TypeError:

Example

Person.changeName = function (name) {
  this.lastName = name;
}
Enter fullscreen mode Exit fullscreen mode

myMother.changeName("Doe");
TypeError: myMother.changeName is not a function

Top comments (0)