Classes, "new" and "this" in JavaScript

JavaScript , Wed Jan 11 2023

    The "new" Keyword

    new keyword have multiple aspects related to it but for now lets just consider the most basic functionality the new keyword performs.

    It creates a new object.

    Yes that's it . Not so difficult to grasp right ? new keyword creates a new empty object . Enough of talking lets dive in to code and create same person object from our last lecture but this time using the new keyword

    const person = new Object();

    what this single line of code did is created an empty object called “person” . by empty I mean there are no properties attached to it , its literally empty like person={} .

    We can treat this object same like the person object from our previous example .We can add new properties to this object like we did before

    newPerson.lastName = 'John';

    and we can access these properties exactly like before

    console.log(person.lastname); // John

    lets see the typeof person object created with new keyword

    console.log(typeof(person)); // object

    So the most basic thing that new keyword performs is create an empty object

    You might be wondering that what in the line const person = new Object(); what the Object() keyword is? and why its used in combination to the new keyword ?

    Well don't worry lets explore this

    Object Methods, Object()

    Object() also known as Object Constructor or Object Method is default constructor method provided by javascript to create objects. Javascript provide us ability to create our own object constructors and create new objects from its type. Don't believe me ? lets give it a try.

    function person(name, age, profession){
           this.name = name;
           this.age = age;
           this.profession = profession;
    }
    const john = new person('John', 23, 'Teacher');
    console.log(john);

    what we did is instead of using a default constructor provided by js to us we created our own constructor method "Person" and than created an object of Person type out of it.

    we can also create our object like

    const john = new Person();

    creating an object with empty constructor would initialise its properties with undefined and not null

    I know the this keyword is bothering you but don't worry its coming next

    'new' and the 'this' Keyword

    this keyword is treated differently depending on the execution context but for now lets only discuss the relation between this and the new keywords

    "new keyword binds this to object itself"

    The this Keyword

    So first of all what is the "This keyword" and what is it used for, well the this keyword is used to reference the object that is executing the the current function, in other words every function has a reference to it's current execution context.

    For example if we want to create a function that console.log's a string using this keyword it would a little like this.

    function Sentence(words){
           this.words = words;
           console.log(this);
    }
    const S = new Sentence('learning about This keyword');

    So let's see what is going on here.

    First off we set a function with input "words", and inside this we set "this.words" to equal to our input, then we console.log this and create a variable that contains a new input for our sentence, but since this keyword equals our input, it'll console.log our new input.