JavaScript | Object Constructors

Object: Object is the collection of related data or functionality in the form of key. This functionalities are usually consists of several functions and variables. All JavaScript values are objects except primitives.

Example:

var GFG = {
    subject : "programming",
    language : "JavaScript",
}

Here, subject and language are the keys and programming and JavaScript are the values.



Class: In JavaScript, a class is a kind of function. This classes are similar to normal java classes. The classes are declared with the class keyword like another OOP languages. The class syntax has two components: class declarations and class expressions.

  • Class declarations:
    class GFG {
        constructor(A, B, C) {
            this.g = A;
            this.f = B;
            this.gg = C;
        }
    }

    Here class name is GFG.

  • Class expressions:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script>
    class GFG {
        constructor(A, B) {
      
            // "this" refers to the address
            // of the keys "g" and "f"
            this.g = A;
            this.f = B;
        }
        print() {
            document.write(this.g +"<br>"+this.f);
        }
    }
      
    let gg = new GFG("JavaScript", "Java");
      
    gg.print();
      
    </script>

    chevron_right

    
    

    Output:

    JavaScript
    Java

this keyword: The this keyword refers to the object it belongs to, like OOPs languages C++, C#, JAVA etc. this keyword is used in different ways in different areas. While executing a function in JavaScript that has a reference to its current execution context, that is the reference by which the function or data member is called. See the previous example.

Adding property to an object: The property can be added to the object by using dot(.) operator or square bracket.,

var GFG = {
    articles: 'computer science',
    quantity: 3000,
};

The GFG has two properties “articles” and “quantity”. Now we wish to add one more property name called subject.

  • Using dot (.) operator
    GFG.subject: 'JavaScript';
  • Using square bracket:
    GFG['subject']: 'JavaScript';

Here, subject is the property and ‘JavaScript’ is the value of the property.

Adding a property to Constructor: We cannot add a property to an existing constructor like adding a property to an object (see previous point), for adding a property we need to declare under the constructor.

function GFG(a, b, c) {
    this.A = a;
    this.B = b;
    this.C = c;
    this.G = "GEEK";
}

Here, we add a property name G with value “GEEK”, in this case the value “GEEK” is not passed as an argument.

Adding a Method to an Object: We can add a new method to an existing object.

GFG.n = function () {
    return this.A + this.B;
};

Here, the object is GFG.


Adding a Method to Constructor:

function GFG(a, b, c) {
    this.A = a;
    this.B = b;
    this.C = c;
    this.n = function () {
        return this.A + this.B;
    }
}

Here, in the last line a method is added to an object.

Constructor: A constructor is a function that initializes an object. In JavaScript the constructors are more similar to normal java constructor.

Object constructor: In JavaScript, there is a special constructor function known as Object() is used to create and initialize an object. The return value of the Object() constructor is assigned to a variable. The variable contains a reference to the new object. We need an object constructor to create an object “type” that can be used multiple times without redefining the object every time.

Example:

function GFG(A, B, C) {
    this.g = A;
    this.f = B;
    this.gg = C;
}

Here, GFG is the constructor name and A, B, C are the arguments of the constructor.

Instantiating an object constructor: There are two ways to instantiate object constructor,

1. var object_name = new Object(); or  
   var object_name = new Object("java", "JavaScript", "C#");
2. var object_name = { };

In 1st method, the object is created by using new keyword like normal OOP languages, and “Java”, “JavaScript”, “C#” are the arguments, that are passed when the constructor is invoked.
In 2nd method, the object is created by using curly braces “{ }”.

Assigning properties to the objects: There are two ways to assigning properties to the objects.

  • Using dot (.) operator
    object_name . properties = value;
  • Using third bracket:
    object_name [ 'properties'] = value;

Example 1: This example shows object creation by using new keyword and assigning properties to the object using dot(.) operator.


filter_none

edit
close

play_arrow

link
brightness_4
code

<script>
      
    // creating object using "new" keyword
    var gfg = new Object();
      
    // Assigning properties to the object
    // by using dot (.) operator    
    gfg.a = "JavaScript"
    gfg.b = "GeeksforGeeks";
      
    document.write("Subject: " + gfg.a + "<br>");
    document.write("Author: " + gfg.b );
</script>                    

chevron_right


Output:

Subject: JavaScript
Author: GeeksforGeeks

Example 2: This example shows object creation using curly braces and assigning properties to the object using third bracket “[]” operator.

filter_none

edit
close

play_arrow

link
brightness_4
code

         
<script>
  
    // Creating an object using "{ }" bracket
    var gfg = { };
  
    // Assigning properties to the object 
    // by using third bracket
    gfg['a'] = "JavaScript"
    gfg['b']= "GeeksforGeeks";
  
    document.write("Subject: " + gfg.a + "<br>");
    document.write("Author: " + gfg.b );
</script>

chevron_right


Output:

Subject: JavaScript
Author: GeeksforGeeks

Example 3: This example shows how to use function() with object constructor.

filter_none

edit
close

play_arrow

link
brightness_4
code

<script>
      
    // Creating object    
    var gfg = new Object();
  
    // Assigning properties to the object    
    gfg.a = "JavaScript"
    gfg.b = "GeeksforGeeks";
  
    // Use function()
    gfg.c = function () { 
        return (gfg.a +" "+ gfg.b);
    };
      
    document.write("Subject: " + gfg.a + "<br>");
    document.write("Author: " + gfg.b + "<br>");
      
    // Call function with object constructor    
    document.write("Adding the strings: "+ gfg.c() );
  
</script>                        

chevron_right


Output:

Subject: JavaScript
Author: GeeksforGeeks
Adding the strings: JavaScript GeeksforGeeks

Example: Another way to create a function using function name.

filter_none

edit
close

play_arrow

link
brightness_4
code

<script>
  
    // Creating object using "{ }" bracket
    var gfg = { };
  
    // Assigning properties to the object    
    gfg.a = "JavaScript"
    gfg.b = "GeeksforGeeks";
  
    // Use function()
    gfg.c = add; 
      
    // Declare function add() 
    function add() { 
        return (gfg.a +" "+ gfg.b);
    };
      
    document.write("Subject: " + gfg.a + "<br>");
    document.write("Author: " + gfg.b + "<br>");
      
    // Call function with object constructor    
    document.write("Adding the strings: "+ gfg.c());
  
</script>                    

chevron_right


Output :

Subject: JavaScript
Author: GeeksforGeeks
Adding the strings: JavaScript GeeksforGeeks


My Personal Notes arrow_drop_up

3rd year student of Information Technology JADAVPUR UNIVERSITY

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.