Function chaining in javascript

Method Chaining in common Design pattern in JavaScript.

Some of javascript framework uses it extensively like JQuery.

In Jquery we can often write something as follows

    $('#my-div').css('background', 'blue').height(100).fadeIn(200);

What it does is select html object with name 'my-div' set inline css property 'background' to 'blue' then set height to 100px then apply fadeIn effect this 200 ms interval.
Here beauty is all this method call are applied one after another in single statement which is referred as method/function chaining.

we can also implement method chaining in our javascript code

1) Sample 1
    var Person = function() {
        this.name = 'john';
        this.color = 'white';
        this.gender = 'male';
      };
     
      Person.prototype.setName = function(name) {
        this.name = name;
        return this;
      };
     
      Person.prototype.setColor = function(color) {
        this.color = color;
        return this;
      };
     
      Person.prototype.setGender = function(gender) {
        this.gender = gender;
        return this;
      };
     
      Person.prototype.save = function() {
        console.log('saving data for :' + this.name + ', a ' + this.color + ' ' + this.gender  );
        return this;
      };

      var PersonObj =new Person() //Person.prototype

      PersonObj
      .setName('Jerry')
      .setColor('brown')
      .setGender('male')
      .save();

2) Sample 2


    var obj = function () {
        this.i = 0;

        this.add = function (j) {
        this.i = this.i + j;
        return this
        }

        this.substract = function (j) {
        this.i = this.i - j;
        return this
        }
        this.print = function () {
        console.log(this.i)
        }
    }

    var x = new obj();
    x.add(5).substract(2).print();

3) Sample 3 with closure

    var obj = function () {
        var i = 0;

        var add = function (j) {
        i = i + j;
        return this
        }

        var substract = function (j) {
        i = i - j;
        return this
        }
        var print = function () {
        console.log(i)
        }
        return {"add":add,"substract":substract,"print":print}
    }


    var x = obj();
    x.add(5).substract(2).print();