Skip to content Skip to sidebar Skip to footer

How To Avoid Multiple Variable Re-declarations On Function Outputs In Javascript

Consider the following example function doSomethingToAVariable(variable){ return variable + 1 } function doSomethingToAVariableASecondTime(variable){ return variable + 2 }

Solution 1:

Function composition to the rescue. Take a look at libraries for functional programming, like Ramda, or lodash-fp.

here a plain JS snippet to compose functions:

//the compose-method you find in your regular FP-libsvarcompose = (...funcs) => (value) => funcs.reduceRight((v,fn)=>fn(v), value);
//or a function wich takes the functions in opposite order, //wich might be more common to youvarpipe = (...funcs) => (value) => funcs.reduce((v,fn)=>fn(v), value);

compose is a direct mapping of the composition you try to build

varcomposition = (value) => a(b(c(value)));
var composition = compose(a, b, c);
//it calls the functions from right to left

pipe is more oriented on your known imperative style to process a value step by step

var composition = function(value){
    value = c(value);
    value = b(value);
    value = a(value);
    return value;
}
//pipe the value through c, then through b, then through avarfn = pipe(c, b, a);
//wich in the end does exactly the same as the code built by compose

so back to your code:

var composition = pipe(
    doSomethingToAVariable,
    doSomethingToAVariableASecondTime,
    doSomethingToAVariableLastly
);
//orvar composition = compose(
    doSomethingToAVariableLastly,
    doSomethingToAVariableASecondTime,
    doSomethingToAVariable
);

//and run itvar myVariable = composition(0);

Solution 2:

If you want to chain then you need to return the object instead which will contain the final value

function variableOperations( initialValue )
{
  this.value = initialValue;
  this.someOp1 = function(){ this.value += 1; returnthis; } 
  this.someOp2 = function(){ this.value += 2; returnthis; } 
}

var a = new variableOperations(1); //new object
a.someOp1().someOp2();

alert(a.value); //alerts 4

Solution 3:

Why not take a look at a functional approach with Ramda?

R.compose(
  doSomethingToAVariableLastly,
  doSomethingToAVariableASecondTime,  
  doSomethingToAVariable
)(myVariable)

Solution 4:

In this case you're looking for what's called "function composition":

var myVariable = doSomethingToAVariableLastly(doSomethingToAVariableASecondTime(doSomethingToAVariable(0)));

but this is clearly not readable with such long function names.

Promises are typically only useful for asynchronous operations, and whilst they'd work in this scenario, the result would be inefficient and would introduce async dependencies where none are needed:

var promise = doSomethingToAVariable(0);
        .then(doSomethingToAVariableASecondTime);
        .then(doSomethingToAVariableLastly);

since you can only access the final result from the end of the chain of .then callbacks:

promise.then(function(myVariable) {
    // myVariable is now 6, and in scope
}

// but it's not in scope or usable here

Solution 5:

In my humble opinion, your code is perfectly fine.

But, you can do something like this if you really want to "chain" the calls. It is a bit less efficient though.

functionchainCalls(initVal, funcs){
  return funcs.reduce(function(val, f){
    returnf(val);
  }, initVal || 0);
}

functiondoSomethingToAVariable(variable){
    return variable + 1
}

functiondoSomethingToAVariableASecondTime(variable){
    return variable + 2
}

functiondoSomethingToAVariableLastly(variable){
    return variable + 3
}

var myVariable = chainCalls(0, [doSomethingToAVariable,
                                doSomethingToAVariableASecondTime,
                                doSomethingToAVariableLastly]);

document.write(myVariable);

Another alternative is to create a reusable function chain like this.

functionfunctionChain(){
  var funcs = arguments;
  returnfunction(value){
    returnArray.prototype.reduce.call(funcs, function(value, f){
      returnf(value);
    }, value);
  };
}

functiondoSomethingToAVariable(variable){
    return variable + 1
}

functiondoSomethingToAVariableASecondTime(variable){
    return variable + 2
}

functiondoSomethingToAVariableLastly(variable){
    return variable + 3
}

var myVariable = functionChain(
  doSomethingToAVariable,
  doSomethingToAVariableASecondTime,
  doSomethingToAVariableLastly
)(0);

document.write(myVariable);

Post a Comment for "How To Avoid Multiple Variable Re-declarations On Function Outputs In Javascript"