JSFiddle - React, Tailwind, and code Playground

by karthick6891

JavaScript

/*
 * I think I can show you how to rewrite your code in "object composition" fashion by using plain JavaScript (ES5). I use factory functions instead of constructor functions for creating an object instance, so no new keyword needed. That way, I can favour object augmentation (composition) over classical/pseudo-classical/prototypal inheritance, so no Object.create function is called.

The resulting object is a nice flat-composed object:
 */

/*
 * Factory function for creating "abstract stock" object. 
 */
var AbstractStock = function(options) {

  /**
   * Private properties :)
   * @see http://javascript.crockford.com/private.html
   */
  var companyList = [],
    priceTotal = 0;

  for (var companyName in options) {

    if (options.hasOwnProperty(companyName)) {
      companyList.push(companyName);
      priceTotal = priceTotal + options[companyName];
    }
  }

  return {
    /**
     * Privileged methods; methods that use private properties by using closure. ;)
     * @see http://javascript.crockford.com/private.html
     */
    getCompanyList: function() {
      return companyList;
    },
    getPriceTotal: function() {
      return priceTotal;
    },
    /*
     * Abstract methods
     */
    list: function() {
      throw new Error('list() method not implemented.');
    },
    total: function() {
      throw new Error('total() method not implemented.');
    }
  };
};

/*
 * Factory function for creating "stock" object.
 * Here, since the stock object is composed from abstract stock
 * object, you can make use of properties/methods exposed by the 
 * abstract stock object.
 */
var Stock = compose(AbstractStock, function(options) {

  return {
    /*
     * More concrete methods
     */
    list: function() {
      console.log(this.getCompanyList().toString());
    },
    total: function() {
      console.log('$' + this.getPriceTotal());
    }
  };
});

// Create an instance of stock object. No `new`! (!)
var portofolio = Stock({
  MSFT: 25.96,
  YHOO:...