method chaining failed in javascript

Question

I'm trying to train myself to write chaining function but got error of

Cannot read property 'minus' of undefined(…)

What's wrong with my code?

var math = function(){
   var result = 0;
   
   var add = function(param){
     result += param;
   };
   
   var minus = function(param){
     result -= param;
   };
   
   var print = function(){
      console.log(result)
   };
   
   return {add:add, minus: minus, print:print};
}

var calculator = math();
var result = calculator.add(5).minus(1).print();
console.log(result)

Your functions don't return anything explicitly. So calling calculator.add(5) will return you undefined which, of course, does not have a .minus. — VLAZ
– VLAZ, Commented Nov 19, 2016 at 16:33

Stuart · Accepted Answer · 2016-11-19 16:37:31Z

3

You need to return the object (this) in this case, to "chain" like you are expecting

You print() also doesn't return anything so result is always undefined.

var math = function(){
   var result = 0;
   
   var add = function(param){
     result += param;
     return this;
   };
   
   var minus = function(param){
     result -= param;
     return this;
   };
   
   var print = function(){
      console.log('result: ' + result);
      // print doesnt return anything, it needs to if you want to assign anything by calling it
      return result;
   };
   
   return {add:add, minus: minus, print:print};
}

var calculator = math();
var result = calculator.add(5).minus(1).print();
console.log(result)

edited Nov 19, 2016 at 16:37

answered Nov 19, 2016 at 16:34

Stuart

6,7692 gold badges29 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Taplar · Accepted Answer · 2016-11-19 16:36:24Z

0

You can also store a reference to the object returned.

var math = function() {
  var result = 0;

  var add = function(param) {
    result += param;
    
    return math;
  };

  var minus = function(param) {
    result -= param;
    
    return math;
  };

  var print = function() {
    console.log(result)
  };
  
  var math = {
    add: add,
    minus: minus,
    print: print
  };
  
  return math;
}

var calculator = math();
calculator.add(5).minus(1).print();

answered Nov 19, 2016 at 16:36

Taplar

25k4 gold badges24 silver badges36 bronze badges

2 Comments

Jessie Emerson Over a year ago

why not just use this?

Taplar Over a year ago

shrug I'm more used to using 'this' when there is a new involved. This snipplet didn't use new.

Collectives™ on Stack Overflow

method chaining failed in javascript

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related