Explain the concept of "this" keyword in JavaScript.

Question

Ashutosh Kumar Verma · Answer

JavaScript “this” Keyword
In JavaScript, this keyword refers to the currently active object. Its value depends on how the function is called (runtime binding) and enables functions to access and manipulate data within an object.
Global Context
In a global context, this refers to a global object (window in browser, global in
Node.js).
console.log(this); // Output: Window object in browsers, global object in Node.js
and 
Function Context
In a function, this refers to the object that calls the function (the receiver).
function greet() {
 console.log(this.name);
}
const person = {
 name: 'Alice',
 greet: greet
};
person.greet(); // Output: Alice
and 
Object Method
When a function is called as a method of an object, this specifies the object on which the method is called.
const person = {
 name: 'Bob',
 greet: function() {
 console.log(`Hello, my name is ${this.name}.`);
 }
};
person.greet(); // Output: Hello, my name is Bob.
Constructor Function
When a function is used as a constructor with the new keyword, 
this displays an instance of the object being created.
function Person(name) {
 this.name = name;
 this.greet = function() {
 console.log(`Hello, my name is ${this.name}.`);
 };
}
const alice = new Person('Alice');
alice.greet(); // Output: Hello, my name is Alice.
and 
Event Handlers
In event handlers this refers to the element that received the event (if you are using traditional event handlers) or the target element (if you are using event delegation).
andlt;button onclick="console.log(this)">Click meandlt;/button>
In this example, this refers to the andlt;button> element that is clicked.

interview

Explain the concept of "this" keyword in JavaScript.

Ashutosh Kumar Verma

1 Answers

JavaScript “this” Keyword

Liked By