13: Modules

In Exercise 10 and Exercise 12 you used const fs = require('fs') to use the "file system (fs)" module. A module is just a way to add a feature, or capability, to your own code. Usually a module is code someone else wrote that you want to use, like the fs module. In this exercise you'll learn how to create your own module and require it. Doing this will teach you more about how modules and require works.

For this exercise you will make two files: code.js and geometry.js. You'll put both files in the same directory so that you can access them. To test that you've done this right, type cat code.js then cat geometry.js to view the two files. If you don't see both, then you did it wrong.

The Geometry Code

The first file you'll make is geometry.js, and it contains the following code:

const area = (r) => Math.PI * r ** 2;
const circumference = (r) => 2 * Math.PI * r;

module.exports = {
    area: area,
    circumference: circumference
}

In this code you create two functions for area and circumference calculations. After that we use the module.exports variable to register these two functions. The syntax you see of { } starts an "object" in JavaScript which is a container using named value, or key and value, pairs. On the left is the key, and on the right is the value.

In our case the key is just the name of the function again, and the value is the actual function we created previously. Why do we do this? Every module system needs a way to tell the computer what is accessible to people who use the module. In some languages (like Python) it's everything. In JavaScript you have to explicitly say what is accessible. You do this by setting module.exports to an object which lists out what you are "exporting".

The Require Code

Once you have the geometry.js written you now need to create this in code.js:

const geometry = require('./geometry');

let area51 = geometry.area(2.8);
let circ2 = geometry.circumference(6);

console.log(`Area: ${area51}, Circumference: ${circ2}`);

You'll see that this code requires your geometry.js file, but it uses the syntax require ('./geometry'), so pay attention. See the ./geometry where I have ./ at the beginning? That's a commmon way to say "in the current directory," so we're saying "require the geometry module that's in the current directory". Next, notice I didn't put .js at the end? That's not necessary, as Node assumes you mean a file called geometry.js, and adding it will keep you from later turning your geometry.js into a directory that has the module.

What You Should See

Running the code should look like this:

$ node "code.js" 
Area: 24.630086404143974, Circumference: 37.69911184307752

There isn't anything special about this, as it's just loading the geometry code and using it. The complexity is all in how you're using more than one file. As you write more JavaScript you'll have to begin to deal with this kind of complexity, so spend some time understanding this. Definitely watch the video for this exercise.

A Note On Browsers

All of this talk of modules doesn't quite apply to web browsers. In a web browser you usually "require" a JavaScript module by just using the <script> tag, or you can use various systems that will let you use require.