Object Oriented JavaScript
Oh Yes, you heard it right!

Datatypes in JavaScript

        - number
        - boolean
        - string
        - undefined
        - object

Object Oriented JavaScript

    
        What is an object?
        Why use object?

Outermost envelope: window object

    
        - Use DevTool console as microscope to see objects.

Built in JS Object Constructors:

    
        • Number()
        • String()
        • Boolean()
        • Object()
        • Array()
        • Function()
        • Date()
        • RegExp()
        • Error()

Example of built in JS Objects:

    
        Math

Ways to create a JS Object

Using object literal

Using built in contructors

Using custom constructor function(cookie cutter)

Using Object.create()

prototype property:

        - Remember function is an object.
        - A special gift for function objects.
        - Always points to an object.
        - Common across all instance objects.
        - Instance objects don't have it.

constructor property:

        - A gift for all instance objects.
        - Remember who created you.

Welcome function as

First Lady^*

^* Let's get a reference to it and pay respect to it.

        var firstLady = function () {
            
            //something dreamy...
            console.log("Hello, it's me!");

        }; //notice this semicolon.


        and can get to it anytime like this:

        firstLady(); //Function invocation using its reference

A word of caution on function hoisting

Create function using constructor:

          var functionRef = new Function('a', 'b', " return a + b ");

          console.log("Result is: " + functionRef(1, 3));

Function in JS isObject! A First Class Citizen.

Function being an object opens
doors to do the Unthinkable!

Array of functions:

        var chessMoves = [
            function () { console.log("King's move"); }, 
            function () { console.log("Queen's move"); },
            function () { console.log("Bishop's move"); },
            function () { console.log("Pawn's move"); }
        ];
                                             
        chessMoves.forEach(function (move) {
            move();
        });

        Depending on the piece you want to move,
        you can selectively apply the function.

Yes, you can apply function!!!

        Function being an object has methods 
        called apply() and call() to invoke it:

        firstLady.apply()

        or

        firstLady.call() 
        
        Difference between the 2 is reader's exercise.

Let's apply function:

        var chessMoves = [
            function () { console.log("King's move"); }, 
            function () { console.log("Queen's move"); },
            function () { console.log("Bishop's move"); },
            function () { console.log("Pawn's move"); }
        ];
                                             
        //King's move
        chessMoves[0].apply();

You can imagine array of functions as a screw driver with replacable heads.

Depending on screw you want to screw :-), you pick function selectively and apply it.

Function can be passed to other functions.
These are called callback functions.

Run code asynchronously as in event listening or AJAX.

Examples:

        1. Event Listener: $(selector).on(event, function () {
            //React to the event
        });

        2. AJAX: $.ajax({
            url: url,
            type: '',
            ...
            success: function (result) { // Callback when success
                //show results
            },
            error: function () { // Callback when failure
                //report error
            } 
        });

A simple callback function in action:

        var displayContent = function (content) {
            console.log('File content: ' + content); //Consumer
        }

        var readFile = function (callback) {
            console.log('Reading a long file...');

            var fileContent = 'This is file content'; //Producer

            callback(fileContent);  //calling Consumer
        }

        readFile(displayContent);

Why just pass function?

We can return it as well!

Returning function:

        function getChessMoveFor(piece) {
            switch(piece) {
                case 'King': 
                    return function () { console.log("King's move"); }
                case 'Queen': 
                    return function () { console.log("Queen's move"); }
                case 'Bishop': 
                    return function () { console.log("Bishop's move"); }
                case 'Pawn': 
                    return function () { console.log("Pawn's move"); }
            }
        }

        var move = getChessMoveFor('King');
        move(); //Make King's move

arguments object:

        function example() {
          console.log(arguments[0] + arguments[1] + arguments[2]);
        }
         
        example(1, 2, 3);

Memoization:

        function square(num){
          var result = '';
          if(!square.cache[num]){ 
             console.log("Computing value...");
             result = num*num;
             square.cache[num] = result;  
          }

          console.log(square.cache[num]);

        }

        square.cache = {}; //Cache property in function object

Memoization continued:

          square(10); //Computing

          square(10); //From Cache

          square(20); //Computing

          console.log(square.cache); //key value hash

Function as Transformer:

        function transformer(arg) {
            console.log('I am ' + arg + ' Car');

            transformer = function (newArg, moreArg) {
                console.log('I am Robo fighting ', newArg, moreArg);
            }
        }

        transformer('Lamborghini');

        transformer('Bad Robo', 'and Worse Robo');

Immediate Function:

        (function(){
            console.log('Hello, I am an immediate function');
        }());


        (function(){
            console.log('Hello, I am immediate function V2');
        })();

Nested Function:

        function startCar(inputKey) {
          var key = chipKey();  //Some onboard chip function

          function startEngine(inputKey) {
            function fireSparkPlug() {
              console.log('Key matched. Car Started. Vroom..vroom');
            }
            if (inputKey == key) {
              fireSparkPlug();
            }
          }
          startEngine(inputKey);
        }

        startCar(12345);

It's time for some OOPs!

First Lady*

Thank you!!!

First Lady^*