JavaScript: What is `THIS`

Emi Kojima
Apr 30 · 5 min read

Overview: this

console.log(this);
Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}
function hey () {
console.log("Hey, I'm a simple function call");
console.log(this === window);
}
hey()
Hey, I'm a simple function call
true
var animal = { 
cat : function() {
console.log(this)
console.log(this.sound)
},
sound: "hrrrrmph"
}
animal.cat()
cat: ƒ, sound: "hrrrrmph"
hrrrrmph
var animal = {
bear: function () {
var sound = "ROARRRR"

this.cat()
},
cat : function() {
console.log(this.sound)
},
sound: "hrrrrmph"
}
animal.bear()
var animal = {
bear: function () {
this.cat()
},
cat : function() {
var sound = "ROARRRR"
console.log(this.sound)
},
sound: "hrrrrmph"
}
animal.bear()
var animal = {
bear: function () {
this.cat()
},
cat : function() {
var sound = "ROARRRR"
console.log(this.sound)
},
sound: "hrrrrmph"
}
animal.cat()
var animal = 'Cat'
var forest = {
animal: 'Bear',
ocean: {
animal: 'Pelican',
animalName: function() {
return this.animal
}
}
}
forest.ocean.animalName()
var animalName = forest.ocean.animalName
animalName()

📞 The call

animalName.call(forest)
animalName.call(window)

The ➡️ arrow function and this

function animalName () {
return this.animal
}
arrowAnimalName => () => this.animal
arrowAnimalName.call(forest)
Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade