• O padrão do módulo foi usado antes dos módulos ES6.
• Objetivo: Encapsular funcionalidade, suportar dados privados, expor API pública e tudo isso é conseguido usando IIFEs.

IIFE: Ex. (função(){})();

// IIFE Goal: Create a new scope, return the data just once. All of data inside IIFE will be private as it would inside the fn scope. 
// Using this way, we don't need to call it separately. And it ensures its called only once.
// IIFE is created only once, goal is 'NOT TO REUSE' by executing it multiple times.

// Result of running an IIFE is stored, or else it will disappear simply.
const ShoppingCart2 = (function(){
  const cart = [];
  const shippingCost = 10;
  const totalPrice = 237;
  const totalQuantity = 10;

  const addToCart = function(product, quantity){
    cart.push({product, quantity});
    console.log(`${quantity} ${product} added to cart. Shipping cost is ${shippingCost}`);
  };

  const orderStock = function(product, quantity){
    console.log(`${quantity} ${product} ordered from supplier`);
  };
  // Need to return something, in order to return a public API. For that, an object is returned containing stuff which needs to be made public.
  return {
    addToCart,
    cart, 
    totalPrice,
    totalQuantity
  };
})();
// Everything inside the above module is private to the module.
// The above fn returns the object mentioned inside return statement and assign it to the ShoppingCart2 variable mentioned at the start of fn. This IIFE is returned then long ago.
// All this is possible because of closures. Hence, addToCart can acccess the cart variable.

ShoppingCart2.addToCart('apple', 4);
ShoppingCart2.addToCart('pizza', 5);
ShoppingCart2;
ShoppingCart2.shippingCost; // inaccessible.

O padrão Module já funcionava antes mesmo dos módulos ES6.

Desagrado:

1. Agora, se quisermos um módulo por arquivo, como fazemos com os módulos ES6, vários scripts precisam ser criados e vinculados dentro do arquivo HTML.
2. A ordem de carregamento do script também será importante.
3. Todas essas variáveis ​​viverão em escopo global.

Além dos módulos ES6 nativos e do padrão de módulo, JS também suportava outros sistemas de módulos que não eram nativos do JS. Ex. AMD, CommonJS
Ex. Os módulos CommonJS são usados ​​no Node.js durante toda a sua existência. Recentemente, módulos ES6 foram implementados em Node.js
Todos os módulos no repositório npm ainda usam o sistema de módulos commonJS, já que o npm foi originalmente planejado para node. Só mais tarde o npm se tornou o repositório de todo o mundo JS. Portanto, estamos basicamente presos ao CommonJS. Portanto, CommonJS ainda precisa receber atenção, pois é implícito no Node.js
Assim como o módulo ES6, 1 arquivo é 1 módulo no CommonJS.
O código commonJS não funcionará no navegador, mas funcionará em node.js
Os Módulos ES substituirão todo o sistema de módulos eventualmente, mas a partir de agora também precisamos usar commonjs.

a palavra-chave export é um objeto que não está definido em nosso código nem no navegador.

// EXPORT
export.addToCart = function(product, quantity){
    cart.push({product, quantity});
    console.log(`${quantity} ${product} added to cart. Shipping cost is ${shippingCost}`);
};

// IMPORT: is similar to ES Modules but would use a require fn.
// require is not defined in browser env but its defined in node env as its a part of commonjs
const addToCart = require('./shoppingCart.js')