JavaScript
  • JavaScript Introduction
  • JS Engine
  • V8 Engine
  • First-class function
  • Optimized Code
  • Call Stack & Memory heap
  • Single Thread
  • JavaScript RunTime
  • Nodejs
  • Context and Environment
  • Hoisting
  • Functions
  • Arguments
  • Variables
  • Scope
  • IIFE
  • this
  • call(), apply() and bind()
  • currying
  • Types
  • Type Coercion
  • Functions as Object
  • HOF (Higher Order Function)
  • Two pillars of Javascript
  • Closures
  • Prototypal Inheritance
  • OOP and FP
  • OOP
    • 4 principles of OOP
  • FP
    • Pure function
    • Imperative vs Declarative
    • Immutability
    • HOF and Closures
    • Currying
    • Partial Application
    • Compose and Pipe
  • Composition vs Inheritance
  • OOP vs FP
  • JS working
  • Promises
  • Async Await
  • ES5 - ECMAScript 2009
  • ES6 - ECMAScript 2015
  • ES7 - ECMAScript 2016
  • ES8 - ECMAScript 2017
  • ES9 - ECMAScript 2018
  • ES10 - ECMAScript 2019
  • ES11 - ECMAScript 2020
  • ES12 - ECMAScript 2021
  • JOB Queue
  • Promises Execution
Powered by GitBook
On this page

Was this helpful?

this

this is a object reference to its parent object.

  • In creation phase this points to window object.

  • this will represents the object it belongs to.

Ex 1:
    console.log(this) // window
    this === window // true
    
    function a() {
        console.log(this) // window
        this === window // true
    }
    
    a(); // same as window.a();

In example 1 the function "a" is belongs to window object, so this is reference of window object

Ex 2:
const greet = {
    welcome: function() {
        console.log(this) // greet
        this === window // false
    }
};

greet.welcome();

In example 2 the function "welcome" is belongs to greet object, this is reference of greet object, so it is not same as window.

Ex 3:

const greet2 = {
    isWindow: this === window,
    welcome: function() {
        console.log(this) // greet
        this === window // false
    }
};

console.log(greet2); // same as console.log(window.greet2); // { isWindow: true }

In example 3 "isWindow" property of greet2 object is "true", because greet2 belongs to window object. "this" reference changed for only inside the function of the objects.

Ex 4:
const name = "Vijay";
function person() {
    console.log(this.name);
}

const firstPerson = {
    name: "Deepak",
    person: person
}

const secondPerson = {
    name: "Vishnu",
    person: person
}

person(); // Vijay

firstPerson.person(); // Deepak

secondPerson.person(); // Vishnu

Ex 5:
var b = {
  name: 'jay',
  say() {console.log(this)}
}

var c = {
  name: 'jay',
  say() {return function() {console.log(this)}}
}

var d = {
  name: 'jay',
  say() {return () => console.log(this)}
}

b.say() // b object

c.say() // [Function]
c.say()() // window
// while calling fitst time it will assign the returning function to windo object.

d.say() // [Function]
d.say()() // d object
// arrow function will not conside in which lexical scope it is called
// it will considers in which lexical scope it is created.
PreviousIIFENextcall(), apply() and bind()

Last updated 5 years ago

Was this helpful?