APEX-JS NameSpaces, orden y limpieza en nuestro código

Como hemos visto la necesidad de incluir JavaScript dentro APEX en varias oscaciones, es escencial mantener un orden dentro del codigo que escribamos.

Es por ello que existe el concepto de namespaces en Javascript, para poder mantener un orden.

Dejaré un ejemplo de como podriamos usar esto, ya sea creacion diferentes objectos y agregando funciones o directamente una funcion dentro de un submodul.

/*
Global Variables across all files
*/

var currentUser = 'ANGEL';


// This code simulates to be existing in a different file for example file called page1
// This example creates first an object and then the functions below  this object
var namespace = namespace || {};

/** ==========================================================================
* @module page 1
**/
namespace.page1 = {
  globalVarP1: 'This is a page 1',

  /** ==========================================================================

  * @function calculator
  * This could be usefully to separate different functionalities  in the same file or for organice better the code
  *
  * @example namespace.page1.calculator('Angel').sum(2,30)
  * @example namespace.page1.calculator('Angel').multi(2,30)
  * @example namespace.page1.calculator('Angel').description
  * @example namespace.page1.calculator('Angel') you could use this call for initialize some parameters for example
  *
  * @issue
  *
  * @author Angel
  * @created 5 May 2024
  * @return  return {
  *           description: "This function contains subFunctions to simulate a calculator",
  *           sum: sum,
  *           div: div,
  *           multi: multi,
  *          };
  **/
  calculator: function (fucntionGlobalVariable) {

    // private variables
    var internal_msg = "Calculator of page 1";

    // private functions
    var privateFunction = function () {
      return fucntionGlobalVariable + "/" + internal_msg;
    };

    // public functions
    var sum = function (a,b) {
      return privateFunction() + " - sum is: "
           + (a + b);
    };

    var div = function (a,b) {
      return privateFunction() + " - division is: "
           + (a / b);
    };

    var multi = function (a,b) {
      return privateFunction() + " - multiplication is: "
           + (a * b);
    };

    // Return things that is going to be public
    return {
      description: "This function contains subFunctions to simulate a calculator",
      sum: sum,
      div: div,
      multi: multi,
    };
  }
};


/**
==========================================================================
==========================================================================
**/

// This code simulate to be existing in a different file for example file called page2
// In this example we are creating the direct function, without an object

var namespace = namespace || {};

/**
* @module page 2
**/


  /** ==========================================================================

  * @function calculator
  * This could be usefully to separate different funcionalities in the same file or for organize better the code
  *
  * @example namespace.page2
  * @example namespace.page2.publicFunction()
  * @example namespace.page2.globalVarP2
  *
  * @issue
  *
  * @author Angel
  * @created Monday, 5 May 2024
  * @return  return {
  *            description: internal_msg,
  *            publicFunction: publicFunction,
  *            globalVarP2: globalVarP2,
  *          }
  **/
namespace.page2 = (function(namespace, $, undefined) {

  var globalVarP2 = 'This is a page 2';

  var internal_msg = "This is an internal message of page 2";

  var privateFunction = function () {
    return globalVarP2 + " / " + internal_msg;
  };
  var publicFunction = function () {
    return 'This is a public function with private function: ' + privateFunction();
  };

  return {
    description: internal_msg,
    publicFunction: publicFunction,
    globalVarP2: globalVarP2,
  };

})(namespace, apex.jQuery);

Aqui algunas referencias:

• javascript-namespace
• essential-js-namespacing
• javascript-namespaces-joseph-evans
• avoid-javascript-mess