//this refer to global object or window object
//but when we call this inside method of object it refers to current object
console.log(this===window)//true
let user = {
name: "Shirshak",
age: 25,
sayHi() {
// "this" is the "current object"
console.log(this.name); //print shirshak
}
};
// In web browsers, the window object is also the global object:
console.log(this === window); // true
a = 37;
console.log(window.a); // 37
this.b = "MDN";
console.log(window.b) // "MDN"
console.log(b) // "MDN"
let user = {
name: "John",
age: 30,
sayHi() {
// "this" is the "current object"
alert(this.name);
}
};
user.sayHi(); // John
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
/*In general, the 'this' references the object of which the function is a property.
In other words, the 'this' references the object that is currently calling the function.
Suppose you have an object called 'counter' that has a method 'next()'.
When you call the 'next()' method, you can access the this object. */
let counter = {
count: 0,
next: function () {
return ++this.count;
},
};
counter.next();
//Inside the next() function, the this references the counter
Code language: JavaScript (javascript)
const refObj = {
func: function(){
console.log(this);
}
};
const person = {
name: 'John',
age: 30,
// accessing name property by using this.name
greet: function() { console.log('The name is' + ' ' + this.name); }
};
person.greet();
var Backbone = {};
Backbone.a = "aaa";
Backbone.b = "bbbb";
Backbone.c = "ccccc";
Backbone.t = function()
{
console.log(this);
}
function clickMe()
{
Backbone.t();
/*console.log(this) is Backbone object (remember how "this" is "whoever owns the function"*/
// Im Webbrowser ist das window Objekt das globale Objekt:
console.log(this === window); // true
a = 37;
console.log(window.a); // 37
this.b = "MDN";
console.log(window.b); // "MDN"
console.log(b); // "MDN"
document.querySelector("button.w").addEventListener("click", function () {
this.style.color = "white";
});
// In HTML event handlers, this refers to the HTML element that received the event:
// when clicked color of the element would change to white,
// document.querySelector("button.w") indentifies the element.