To bind or not to bind

An example of what's better, binding, wrapping a function or not binding when chaining promises.

by Adrián Gómez Llorente

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular.min.js"></script>
<!-- Adrián Gómez - http://adgllorente.com -->
<div data-ng-app="myApp">
  <h1>Open console to see three 3 as a result...</h1>
  <div data-ng-controller="toBindOrNot"></div>
</div>

JavaScript

/**
 * Adrián Gómez Llorente
 * http://adgllorente.com
 */
angular.module('myApp', [])
  .controller('toBindOrNot', toBindOrNotCtrl);

function toBindOrNotCtrl($q) {
  /**
   * Obtains a number.
   * @return {Promise} To be resolved with a 1.
   */
  function giveNumber() {
    return $q.when(1);
  }

  /**
   * Sums two numbers.
   * @param {number} a First number to sum.
   * @param {number} b Second number to sum.
   * @return {Promise} to be resolved with the sum of numbers.
   */
  function sumTwoNumbers(a, b) {
    return $q.when(a + b);
  }

  // 1. Use an anonymous function as a callback
  giveNumber()
    .then(function(num) {
      return sumTwoNumbers(num, 2);
    })
    .then(console.log); // Prints 3.

  // 2. Use bind to chain functions:
  giveNumber()
    .then(sumTwoNumbers.bind(null, 2))
    .then(console.log); // Prints 3.

  // 3. Wrap the function inside another function
  function _wrapSumTwoNumbers(num) {
    return function(otherNum) {
      return sumTwoNumbers(num, otherNum);
    }
  }

  giveNumber()
    .then(_wrapSumTwoNumbers(2))
    .then(console.log); // Prints 3.
}