What is prototype and prototype chain in JavaScript

Mar 24, 2017

Each JavaScript object has a private property which holds a link to another object called its prototype. That prototype object has a prototype of its own, and so on until a object is reached with null as its prototype. null has no prototype and acts as the final link in this prototype chain.

Multiple inheritance with prototypes is referred to as a prototype chain.

function Car() {
    this.make = "Honda";
    this.model = "Civic";
}

let c = new Car();
Car.prototype.fuel = "Gas";

console.log(c.make); // "Honda"
console.log(c.model); // "Civic"
console.log(c.fuel); // "Gas"

To check whether an object has a property defined on itself and not somewhere on its prototype chain, it is necessary to use the hasOwnProperty method which all objects inherit from Object.prototype.

c.hasOwnProperty("make"); //true
c.hasOwnProperty("fuel"); //false

References:

Categories : JavaScript

Constructor in JavaScript

Mar 24, 2017

A constructor in JavaScript is a function that is called with the “new” operator.

Categories : JavaScript

Difference between scope and context in JavaScript

Mar 23, 2017

Difference is scope is function based and context is object based.

Scope

Variables can have either local or global scope. Local variables exist only within the function in which they are defined. Variable declared outside the function can be accessed and modified by another function also.

var planet = "sun"; // global variable

console.log(planet); //sun
function solar_system() {
    var star = "sun"; // local variable
}
console.log(star); // Error, star is not defined

Context

Context this is set to the object the function is called on.

var myObj = {
    id: 10,
    myFunc: function() {
        console.log(this.id); // this refers to `myObj`
    }
};

myObj.myFunc(); // 10
function foo() {
    console.log(this); // `this` refers to the `window` object
}

foo();  

Reference

Categories : JavaScript

How to create a class in JavaScript

Mar 22, 2017

In JavaScript classes can be created using functions. Let’s see how.

function Car() {
    this.make = 'Honda';
    this.model = 'Civic';
    this.color = 'gray';

    this.getInfo = function() {
        return this.make + ' ' + this.model + ' ' + this.color;
    };
}
var mycar = new Car();

The method getInfo() gets recreated every time we create a new object. Instead we can add getInfo() to the prototype.

Car.prototype.getInfo = function() {
    return this.make + ' ' + this.model + ' ' + this.color;
}
Categories : OOP   javascript

Welcome to Jekyll!

Mar 22, 2017

You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

To add new posts, simply add a file in the _posts directory that follows the convention YYYY-MM-DD-name-of-post.ext and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.

Jekyll also offers powerful support for code snippets:

def print_hi(name)
  puts "Hi, #{name}"
end
print_hi('Tom')
#=> prints 'Hi, Tom' to STDOUT.

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll’s GitHub repo. If you have questions, you can ask them on Jekyll Talk.

Categories : jekyll   update