Object: An object is the collection of related data or functionality in the form of key. These functionalities usually consist 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. These classes are similar to normal java classes. The classes are declared with the class keyword like other 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:
javascript
class GFG { constructor(A, B) { // "this" refers to the address // of the keys "g" and "f" this .g = A; this .f = B; } print() { console.log( this .g + " " + this .f); } } let gg = new GFG( "JavaScript" , "Java" ); gg.print(); |
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.
javascript
// creating object using "new" keyword var gfg = new Object(); // Assigning properties to the object // by using dot (.) operator gfg.a = "JavaScript" ; gfg.b = "neveropen" ; console.log( "Subject: " + gfg.a); console.log( "Author: " + gfg.b ); |
Output:
Subject: JavaScript Author: neveropen
Example 2: This example shows object creation using curly braces and assigning properties to the object using third bracket “[]” operator.
javascript
// Creating an object using "{ }" bracket var gfg = { }; // Assigning properties to the object // by using third bracket gfg[ 'a' ] = "JavaScript" ; gfg[ 'b' ]= "neveropen" ; console.log( "Subject: " + gfg.a); console.log( "Author: " + gfg.b ); |
Output:
Subject: JavaScript Author: neveropen
Example 3: This example shows how to use function() with object constructor.
javascript
// Creating object var gfg = new Object(); // Assigning properties to the object gfg.a = "JavaScript" ; gfg.b = "neveropen" ; // Use function() gfg.c = function () { return (gfg.a + " " + gfg.b); }; console.log( "Subject: " + gfg.a); console.log( "Author: " + gfg.b); // Call function with object constructor console.log( "Adding the strings: " + gfg.c() ); |
Output:
Subject: JavaScript Author: neveropen Adding the strings: JavaScript neveropen
Example: Another way to create a function using function name.
javascript
// Creating object using "{ }" bracket var gfg = { }; // Assigning properties to the object gfg.a = "JavaScript" ; gfg.b = "neveropen" ; // Use function() gfg.c = add; // Declare function add() function add() { return (gfg.a + " " + gfg.b); }; console.log( "Subject: " + gfg.a); console.log( "Author: " + gfg.b); // Call function with object constructor console.log( "Adding the strings: " + gfg.c()); |
Output :
Subject: JavaScript Author: neveropen Adding the strings: JavaScript neveropen