English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

JavaScript Basic Tutorial

JavaScript Objects

JavaScript Functions

JS HTML DOM

JS Browser BOM

AJAX Basic Tutorial

JavaScript Reference Manual

JavaScript Object Constructor

In the previous chapters, we learned how to create objects in JavaScript.

The examples in the first few chapters are limited. They only create a single object.

Sometimes we need a 'model' to create many objects of the same type (example).

The method to create a "model" is to use}}Object constructor.

AObject constructorIt is easy to create multiple objects (examples) with the same properties and methods.

In the following example, function User() is an object constructor:

  function User(fname, lname, age, loc) {
   this.firstName = fname;
   this.lastName = lname;
   this.age = age;
   this.location = loc;
  }

Objects of the same type can be created by calling the constructor using the new keyword:

var Seagull = new User("Seagull", "Anna", 22, "New Delhi");
var tarush = new User("Tarush", "Balodhi", 34, "Bihar");
Test to see‹/›

As you can see, we can quickly build a large number of different user objects by calling the User constructor with different parameters. This is completely the same pattern used by JavaScript in its built-in constructors (such as Array() and Date()).

thisKeyword

JavaScript has a special keyword this, which you can use in methods to refer to the current object.

When this is used in an object, its value is the object itself.

In the constructor, this has no value. It replaces the new object. When a new object is created, the value of this will become the new object.

Adding properties to an object

To add a new property to an object, you can use the assignment operator (=) to assign the new value to the property.

Seagull.weapon = "Sword";
Test to see‹/›

Note:This property will be added to Seagull. Do not. (Not applicable to any other User object).

Adding methods to an object

To add a new method to an object, you can use the assignment operator (=) to assign the new function to a property.

Seagull.greet = function() {
return "Hello World";
};
Test to see‹/›

Note:This method will be added to Seagull (not pointing to any other User object).

Adding properties to the constructor

We cannot add a new property to the constructor like we add a new property to an existing object:

User.weapon = "Sword";
Test to see‹/›

To add a new property to the constructor, you must add it to the constructor:

function User(fname, lname, age, loc) {
   this.firstName = fname;
   this.lastName = lname;
   this.age = age;
   this.location = loc;
   this.weapon = "Sword";
}
Test to see‹/›

Sometimes, we may want to add a new property to a constructor later, which will be shared among all objects (examples). The answer isObject prototype.

Adding methods to the constructor

The constructor can also define methods.

WeCannot be likeJust like adding a new method to an existing object, add a new method to the constructor.

Methods must be added to an object within the constructor.

function User(fname, lname, age, loc) {
   this.firstName = fname;
   this.lastName = lname;
   this.age = age;
   this.location = loc;
   this.fullName = function() {
   return this.firstName + " " + this.lastName;
   };
}
Test to see‹/›

Sometimes we want to add new methods to the constructor later, which will be shared among all objects (for example). The answer isObject prototype.

JavaScript built-in constructor functions

JavaScript has the following built-in constructor functions for native objects:

let x1 = new String(); //A new String object.
let x2 = new Number(); //A new number object.
let x3 = new Boolean(); //A new boolean object.
let x4 = new Object(); //A new Object object.
let x5 = new Array(); //A new Array object.
let x6 = new RegExp(); //A new RegExp object.
let x7 = new Date(); //A new date object.
let x8 = new Function(); //A new function object.
Test to see‹/›

Do not declare Number, String, or Boolean as objects

As you can see above, JavaScript has primitive data types with objects such as String, Number, and Boolean.

We have no reason to create complex objects. Because primitive values are much faster.

Always treat numbers, strings, or booleans as primitive values. Do not treat them as objects.

Declaring these types as objects will slow down execution and produce unexpected results.

var str1 = "New Delhi";
var str2 = new String("New Delhi");
document.write(str1 === str2); // Returns an error because str1And str2With different types
Test to see‹/›

Cannot compare objects:

var str1 = new String("New Delhi");
var str2 = new String("New Delhi");
document.write(str1 == str2); // Returns an error because str1And str2With different types
document.write(str1 === str2); // Returns an error because str1And str2With different types
Test to see‹/›

You can also do this:

  • Use {} instead of new Object()

  • Use "" instead of new String()

  • Use 0 instead of new Number()

  • Use false instead of new Boolean()

  • Use [] instead of new Array()

  • Use/();/Instead of new RegExp()

  • Use function (){} instead of new Function()

let x1 = {};
let x2 = "";
let x3 = 0;
let x4 = false;
let x5 = [];
let x6 = /();/;
let x7 = function(){};
Test to see‹/›

String Primitives and String Objects

By default, JavaScript strings are created as primitive values: var city = "New Delhi";.

However, it is also possible to use the new keyword to define strings as objects: var city = new String("New Delhi");.

In the " JS Strings Learn why it is not recommended to create strings as objects in the "

Number Primitives and Number Objects

By default, JavaScript numbers are created as primitive values: var num = 50;.

However, it is also possible to use the new keyword to define numbers as objects: var num = new Number("50);.

In the " JS Numbers Learn why it is not recommended to create numbers as objects in the "

Boolean Primitives and Boolean Objects

By default, JavaScript boolean values are created as primitive values: var x = false;.

However, it is also possible to use the new keyword to define boolean values as objects: var x = new Boolean(false);.

In the " JS Boolean Learn why it is not recommended to create boolean values as objects in the "