Posts

Showing posts from January, 2017

Javascript Practice Day 6 : Understanding Call,Apply,Bind

//Call Apply and Bind //while wroking with object in javascript each one will have it onw properties (methods and variables) , So with Call ,Apply and Bind we can make //the methods share among each other . //creating  an object var obj1 ={ num : 2, num2 :3 }; var func=function(a,b,c){     return this.num+this.num2+a+b+c; } var arr=[1,2,3];      console.log(func.call(obj1,1,2,3)); console.log(func.apply(obj1,arr)); var bound=func.bind(obj1) console.log(bound(1,2,3));

Javascript Practice Day 6 : Immediately invoked function expression and its difference with normal funciton

Immediately Invoked function Expression and difference between Construction pattern of object creation Immediately Invoke function Expressions are useful in increassing the performance of the program as the global scope is placed under the local scope .The main difference between IIFE and other form of object creation is that with 'others' we can create different instance of the objects but with IIFE we can't , it can be called multiple times.But IIFE remembers the values/operation it went through and next time performs on the modified value which is not present in case of normal function //IIFE// var counter=(function()  {     var i=1;     return {         get: function(){         return i;     },         set: function(a){         i=a;         },         add: function(){         i=i+1;     }           } })(); //IIFE// //As each time a the same instance is called we do see a constant increase of value console.log(counter.get()); counter.set(5)

Javascript Practice Day 5 : Implementing Method Chaining

Implementation of Method Chaining var obj= function(){       var i=0 ; //this is a closure and will be shared by all the function        var add= function(j){         i+=j;         //this is the operation       return this;  // we return the object as this will help in achieving method chaining     }       var subs = function(j){       i-=j;        //this is the operation       return this;   // we return the object as this will help in achieving method chaining     }       var print= function(){         console.log(i);     }          return { add: add, subs: subs,print:print}; //create and return an empty object with different function attached to it --Step1       }; var x= obj() //Since we are returning a object from the above constructor function  as show in step1 we are not required to use new operator to create a new instance of the object. x.add(3).subs(2).print();

Javascript Practice Day 4 : Factory,Constructor,Dynmic Prototype and Prototype Pattern

//Reference : https://www.youtube.com/watch?v=xizFJHKHdHw&list=PL7pEw9n3GkoW5bYOhVAtmJlak3ZK7SaDf&index=1 // factory ,constructor prototype pattern //in factory pattern we create a simple function with parameters which will return an object and thereby //behaves a factory . var peopleFactor = function( age, name,state){          var temp={};    ///creating  a empty temp object          temp.age= age;  //attaching the properties to the object     temp.name=name;     temp.state=state;          temp.printPerson=function(){         console.log(this.name+" , "+this.age+ " , "+this.state);     };          return temp;  //returning the object }; //creating differernt object from the factory function var person= peopleFactor('John',23,'CA');   var person1= peopleFactor('Kim',23,'SC'); var person2= peopleFactor('lun',22,'TX'); //printing the different objects created from the factory perso

Javascript Practice Day 4 : Iterators,Iterables ,Generators

Iterable object will have a Symbol.iterator proto .Sets,Weak Set,Maps, Weak Maps are newly introduced Javascript Iterable datatypes ."for of" is a new for loop that can be used with the itrable datatypes .Set do not store duplicate values. reference Site -https://www.youtube.com/watch?v=TJpkYvSREtM let mySet = new Set([1,2,2,3,4]) console.dir(mySet); for (let v of mySet){     console.log(v); } //Use of Symbol.iterator traverse through elements let myArray=[1,2,3,4]; let iterator= myArray[Symbol.iterator](); console.log(iterator.next()); //output {value: 1 and done :false } (value is the element present in the index and done :false,the array is not yet completed console.log(iterator.next()); console.log(iterator.next()); console.log(iterator.next()); console.log(iterator.next()); let NumArray=[1,2,3,4]; console.dir(NumArray); //non iterable object will not have a Symbol.iterator proto let anyOtherObject={     name: "John",     age:

Javascript Practice Day 3 :Abstract class and inheritance

Abstract class in Javascript cannot be instantiated  with new keyword and therefore any object that needs to be created will be done by Object.creat() method // Abstract Class - any attempt to create an instance will throw an error var shape = function(){     this.shapeName= none     throw new Error(" Cannot create instance of an abstract class"); } //declaring a method in the abstract class shape.prototype.draw=function(){     return "Drawing "+this.shapeName; } // a class circle which inherits the draw method from the abstract class shape function circle(shapeName) {     this.shapeName=shapeName; } //the instance of the object class is created by the Object.create method and assigned to circle class circle.prototype=Object.create(shape.prototype); // new instance of circle class is created var c = new circle("circle"); document.write("Circle object created  <br/>"); the draw method of shape class is called v

Javascript practice Day 3 : inheritance

Inheritance   in javascript is achieved by prototyping the object of base class into the child class . Chile class object will have access to all the methods of the base class , If child class object refers a method , it is first checked into child class and then into base class. function Employee(name) {     this.name= name; } Employee.prototype.getName = function(){     return this.name; } Employee.prototype.getNameLength = function(){     return this.getName().length; } var emp1= new Employee("John"); function Manager(salary) {     this.salary= salary; } //Inheritence is happening here Employee object is assigned to Manager Manager.prototype=emp1; //Manager obect is created and it can access the properties of the Employee class var memp=new Manager(2000); document.write("Name : "+memp.getName()+"<br />"); document.write("Length Name : "+memp.getNameLength()+"<br />"); document.write("

Javascript Practice Day 3 : Method Override

Javascript Method Override : Method  overriding is possible with the help of  function prototype in constructor function . This is helpful if we are referring an external javascript file and wants to  overrride the function present there.The function to be overridden should be declared defined above the base function //overridden funciton Employee.prototype.getName= function(){  return this.name.toUpperCase();    } //objects declared for the Employee class var e1= new Employee("John"); var e2= new Employee("Rambo"); document.write(e1.getName() + "<br/>"); document.write(e2.getName() + "<br/>"); //Constructor function function Employee(name) {     this.name= name; } //base function that will get overidden above Employee.prototype.getName = function(){     return this.name; }

Javascript Practice Day 3 : Javascript Prototype

Javascript Prototype : we use the prototype keyword with the constructor function and that function will be accessed from outside . 1)The function is loaded only once and its shared among all the  objects created upon the constructor functions 2)Allows to  override the function if function function Employee(name) {     this.name= name; } Employee.prototype.getName = function(){     return this.name; } var e1= new Employee("John"); var e2= new Employee("Rambo"); document.write(e1.getName() + "<br/>"); document.write(e2.getName() + "<br/>");

Javescript Practice Day2 : Static members (variable and functions)

Static variables - to declare a static variable use constructor function name in the declaration of the members and same to invoke as show in the below example function simpleInterst(tenure) {     //public instance variable     this.t = tenure;              //principle and rate will be same so we are creating a static field     //static members are declared with the constructor function name     simpleInterst.principle=10000;     simpleInterst.rate=3;          this.rateOfInterest= function()     {            //static members are invoked with the constructor function name         return (simpleInterst.principle * simpleInterst.rate * this.t)/100;     } } var  year = new simpleInterst(5); document.write("<p> 5 years </p>"+year.rateOfInterest() + "<br/>"); var  year = new simpleInterst(6); document.write("<p> 6 years </p>"+year.rateOfInterest() + "<br/>"); var  year = new simpleInterst(

Javascript Practice Day2 : Properties in Javascript and add validations

We can add properties in Javascript same way we do in other object oriented programming language to keep the encapsulation property .We use "Object.defineProperty " to create property around private variable there by adding validation /restriction on changing the values of the variables //constructor function function  student(name,age) {     //private variable     var _name=name;     var _age= age; //declaring the property on age and restricting it to 1-100 , on giving more that 100 it throws an alert     Object.defineProperty(this,"age",{              get : function(){             return _age;         },                  set : function() {             if(value<1 || value >100){             alert("Invalid age");             }             else{                 _age=value;             }                      }     }) //declaring the property on name and making it readly , name is a private variable and

Javascript Practice Day2 : Private ,Public(Prototype), Privilege(this)

Private ,Public and Privileged  members in a Javascript constructor function Private Members - Private members in a javascript can be created by using the 'var' keyword while declaring the member i.e variables and functions . The scope of the members is within the constructor function function student(firstName ,lastName) {     //private field and function          var dateOfBirth;          //private function     var getDOB=function(){         dateOfBirth='01/02/2017';         return dateOfBirth;     } } Public  member - These members variable are declared with 'this' Keyword Practice.TeamA.customer= function(firstName ,lastName) {     //public field     this.firstName=firstName;     this.lastName=lastName;     //public field     //privilege function     this.getFullName=function(){         return this.firstName+" "+this.lastName;     }      //privilege function     return this;      } Privil

Javascript Practice Day 1 : Global Namscpae pollution

If two javascript functions within the same scope are called then the one that is called later will override the one which is called earlier. As there is no concept of function overloading in Javascript. This results in GlobalNamespace pollution or  name collition So when we run the below code TeamA.js file function customer(firstName ,lastName) {     this.firstName=firstName;     this.lastName=lastName;         this.getFullName=function(){         return this.firstName+" "+this.lastName;     } } TeamB.js file function customer(firstName ,middleName,lastName) {     this.firstName=firstName;     this.lastName=lastName;     this.middleName= middleName;         this.getFullName=function(){         return this.firstName+" "+this.middleName+" "+this.lastName;     } } Html <!DOCTYPE> <html>     <head>         <title>Practic-1</title>     </head></script>     <script type="text/

JavaScript Practice Day1 - Constructor notation and Literal Notation

Constructor notation - This is one of the method of creating object in javascript  . All the objects  created from Constructor Notation are differerent and if an object is changed and it does not change the property of other objects .In the below example we are creating a class Employee with two properties firstName and LastName and a method getFullName to return the full name.  //object creation with  constructor function     function Employee(firstName, lastName) {         this.firstName = firstName;         this.lastName = lastName;         this.getFullName = function () {             return this.firstName + " " + this.lastName;         }     }     //object creation with constructor function Creating the object from the class template. We have created an employee2 object and passing the parameters "Amit" and "Mazumder" to the class constructor     var employee2 = new Employee("Amit", "Mazumder"); //constr