JavaScript Module System PART I

My intention was not to make this article on JavaScript Module system but rather how require and import work, but sometimes we move slightly in an opposite direction.

Read Through;

We must first understand what going behind the scene,

Updating a module is much easier if it is decoupled from other pieces of code. This encourages the programmer to go through the program a lot less intimidating. It solves the namespace ambiguity as well allowing the objects to be created in publicly accessible namespaces while the functions in it remain private.

Modules can be reused, eliminating duplicate pieces of code thereby saving huge amount of time.
Before the modules arrived, The Revealing Module Pattern was getting used.

CommonJS Implementation

They came up with a separate approach to interact with the module system using the keywords require and exports. require is a function used to import functions from another module. exports is an object where any function put into it will get exported.

Nodejs Implementation:

They are heavily influenced by CommonJS specification. The major difference arises in the exports object. NodeJS modules use module.exports as the object to get exported while CommonJS uses just the exports variable.

//data module

function data(){
return customers.get(’store);
}
modules.exports = data;

The cons are just one file per module, only objects are made as modules and the browsers cannot use these modules directly without transpiling.

Asynchronous Module Definition (AMD) Implementation:

AMD is a module definition system that attempts to address some of the common issues with other systems like CommonJS and anonymous closures. It’s wasn’t suited for the browser at first.

It is designed to be used in browsers for better startup times and these modules can be objects, functions, constructors, strings, JSON, etc. Modules can be split in multiple files, which are compatible for require and exports and circular dependencies are supported as well.

Require-Js Implementation

RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.

It loads the plain JavaScript files as well as modules by using plain script tags. It includes an optimizing tool which can be run while deploying our code for better performance.

EcmaScript 6 modules

ECMAScript 6 a.k.a., ES6 a.ka., ES2015 offers possibilities for importing and exporting modules compatible with both synchronous and asynchronous modes of operation.

export function greet(name) {
console.log("Hello %s!", name);
}

var myMethod = function(param) {
return "Here's what you said: " + param;
};

export {myMethod}

export class MyClass {
test() {}
}

If you are looking at starting a new module or project, ES2015 is the right way to go and CommonJS/Node remains the choice for the server.

You Love this Article hit the follow button: https://iamgabrielsoft.medium.com