Left Hand Side

In JavaScript, you may hear the expressions "left side" or "right side" when talking about declarations. These refer to evaluations or comparisons, and to which side the particular expression is on. (eg let x /*left side*/ = 12 /*right side*/) Here we will focus on the left hand side, and specifically the keywords new and super.

new

new is a keyword that lets a user create an object based off of a user-designed model. The model must be created first as a function, like this:

function Game(score, winner, loser) {
    this.score = score;
    this.winner = winner;
    this.loser = loser;
}

this.score refers to the property of the object being created, while score refers to the parameter being passed into the function. We can create a new Game object with the following:

let SBLII = new Game(41-33, "Philadelphia Eagles", "New England Patriots");

console.log(SBLII.loser); //"New England Patriots"

super

Sometimes the information inside of an object is so large that we store it inside another object within the first. This is called "nesting". Think of it like a news program:

let news = {
    story 1: "headline",
    story 2: "important",
    weather: {
        tomorrow: "sunny",
        wednesday: "rain"
    },
    sports: {
        baseball: "Home run!"
        football: "Touchdown!",
        ...
    },
    function throwToCommercial(segment, time) {
        console.log("We'll be back with " + segment + " in " + time + "minutes after this short break.");
    }
    ...
}

news is the parent object, whereas sports and weather are the child objects. Unfortunately for our news program, the commercial break function lies in the parent object, meaning that the children can't go to commercial. We use the super keyword in these situations to allow the child objects to access properties of the parent. The newscasters can just call the method themselves (this.throwToCommercial('weather', 3)), but if the weatherman tried to use this, he'd get an error. The weatherman has to go to break like this:

super.throwToCommercial('sports', 2);

File Location

We will be working in the following file:

    javascript-library
        └── 0-PreWork
        └── 1-Fundamentals
            └── 1-Grammar-and-Types
            └── 2-ControlFlow-and-ErrorHandling
            └── 3-Loops
            └── 4-Functions
            └── 5-Expressions-and-Operators
                01-assignment.js 
                02-comparision.js 
                03-ternary.js
                04-typeof.js 
                05-this.js 
                06-left-hand-side.js <----You will be working in this file.

Practice

1. Create a function to be used as a model for today's date, then use that model to create an object called today.

2. Add a property to the today object called tomorrow (let today.tomorrow = ...).

3. Using the news example from above, add the propery localNews to the object, then have the sportscaster go to commercial, teasing the local news coming up in 3 minutes.