(Fake) Operator Overloading

Because Javascript will call the .valueOf method for an object to coerce the value before applying most operators (like basic math ops, binary ops, comparison ops), you can get tricky and change the value returned on the left to the result of a different operation.

    var obj1 = {
        valueOf: function () {
            console.log("valueOf1");
            return 1;
        }
    };
    var obj2 = {
        valueOf: function () {
            console.log("valueOf2");
            return 2;
        }
    };

obj1 + obj2
    valueOf1
    valueOf2
    3

Code:

• // This example implements a point class that can do basic math functions, 
  // but uses both the x and y elements of the point correctly. It uses a fake
  // return value to detect the operation between the objects according to the
  // resulting calculation, then replaces it in the end with the same sort of 
  // operation, but done with the actual point values. 
  
  function Point(x, y) {
      if (arguments.length === 0) {
          x = 0;
          y = 0;
      } else if (arguments.length !== 2) {
          throw new Error("Need either 0 or 2 arguments");
      }
      this.x = x;
      this.y = y;
  }
  //-------------- Operator overloading
  
  Point.operands = [];
  
  Point.prototype.valueOf = function () {
      Point.operands.push(this);
      // Lowest natural number x where the following are all different:
      // x + x, x - x, x * x, x / x
      return 3;
  }
  Object.defineProperty(Point.prototype, "_", {
      set: function (value) {
          var ops = Point.operands;
          var operator;
          if (ops.length === 2 && value === 0) { // 3 - 3
              operator = this.setSubtract;
          } else if (ops.length === 2 && value === 1) { // 3 / 3
              operator = this.setDivide;
          } else if (ops.length >= 2 && (value === 3 * ops.length)) { // 3 + 3 + 3 + ...
              operator = this.setAdd;
          } else if (ops.length >= 2 && (value === Math.pow(3, ops.length))) { // 3 * 3 * 3 * ...
              operator = this.setMultiply;
          } else {
              throw new Error("Unsupported operation (code "+value+")");
          }
          Point.operands = []; // reset
          return operator.apply(this, ops);
      },
      /**
       * "" + mypoint won't invoke toString(), but valueOf().
       * Work-around: "" + mypoint._
       */
      get: function () {
          return this.toString();
      }
  });
  
  //-------------- Operator implementations
  
  Point.prototype.setSubtract = function (l, r) {
      this.x = l.x - r.x;
      this.y = l.y - r.y;
      return this;
  }
  Point.prototype.setDivide = function (l, r) {
      this.x = l.x / r.x;
      this.y = l.y / r.y;
      return this;
  }
  Point.prototype.setAdd = function (first) {
      this.x = first.x;
      this.y = first.y;
      [].slice.call(arguments, 1).forEach(function (op) {
          this.x += op.x;
          this.y += op.y;
      }, this);
      return this;
  }
  Point.prototype.setMultiply = function (first) {
      this.x = first.x;
      this.y = first.y;
      [].slice.call(arguments, 1).forEach(function (op) {
          this.x *= op.x;
          this.y *= op.y;
      }, this);
      return this;
  }
  
  //-------------- Various helpers
  
  Point.prototype.toString = function () {
      return "Point("+this.x+", "+this.y+")";
  }
  Point.prototype.equals = function (other) {
      return this.x === other.x && this.y === other.y;
  }
  
  //-------------- Sample use
  
  var p = new Point();
  var a = new Point(1, 2)
  var b = new Point(3, 4)
  var c = new Point(5, 6)
  
  p._ = a + b + c;
  console.log(p.toString());
  
  p._ = a * b * c;
  console.log(p.toString());     
  
  //p._ = a * b + c //can't do this, but...
  p._ = a * b
  p._ = p + c;
  console.log(p.toString());

  +

See also:

• https://github.com/rauschma/op_overload +
• https://2ality.com/2011/12/fake-operator-overloading.html +

  .