Namespaces in TypeScript

Aniruddha Chatterjee
Level Up Coding
Published in
4 min readJun 24, 2020

--

You might have come across the term ‘namespace’ while working with TypeScript. And you might wonder what on earth is a namespace? We will be dealing with the basic concepts of namespaces and how we can use them to write efficient codes.

Working with TypeScript

Namespace is a context for identifiers, a logical grouping of names used in a program.

This definition from MDN Web Docs is a sweet definition of namespaces. We should know that namespace is not an exclusive concept of TypeScript. Languages like C++ and Python also have namespaces. However, in this story, we shall be covering namespace with keeping TypeScript in our minds.

Prerequisites

This post is written assuming you know how to use the basics of TypeScript. Small explanations as to what our code does are given, but no elaboration is made.

Also, it will be helpful if you have Node.js and TypeScript already installed. You can try the online TypeScript Playground. But executing TypeScript with Node.js is preferred.

You can refer to a previous story First Step towards TypeScript to learn how you can get started with TypeScript.

Declaring a Namespace

The keyword to declare a namespace is, well, “namespace”. The syntax is as follows

namespace <name_of_your_space> {
// namespace members go here
}

We will declare a namespace with an identifier “DigitsInNumber” and will define some functions that we will use in a separate file.

Let us break the code down into simpler steps.

Step 1: We declare a namespace with the name of “DigitsInNumber”. We want to use this namespace in another file, so we will be exporting it with the use of the export keyword.

Step 2: We define a function isNumber() which accepts a parameter named value. We would not directly use this function anywhere else outside the file, so we will not be exporting this. We are just returning the negated value of isNaN() with the parameter value.

If value is not a number, isNaN(value) will return a true value. Negating this would result in false as the result. So our isNumber() function will take in a value, check if it is a number using the built-in isNaN() function and return a boolean result accordingly.

Step 3: We now define a function which we will be using to count the number of digits. We will need this function in an external file, we will use export to export the countDigits() function.

We will call our isNumber() function to check if our value is a number. Then we shall proceed to check if it has single, double or more than 2 digits. For simplicity, we shall be ignoring all negative numbers. An appropriate string is returned, based on the outcome of the conditional logic.

Importing and Using our Namespace

Now that we are ready with our namespace, let us use it! For this, we will create a separate file “countDigitsDriver.ts” which we shall use to run our code.

We import namespaces as

import {<name>} from “location”

So we do import {DigitsInNumber} from “./digitsInNumber.ts” to import our namespace. Do note, only exported members of a namespace can be used in external files. So while we can perfectly use countDigits() function here, we will not be able to access isNumber() function, since it is not exported.

The syntax to use a member of a namespace is

nameSpaceName.functionName()

We call our DigitsInNumber.countDigits() function using different parameters and use console.log() to print our outputs. Now, it is time to see our code in action.

Compiling and Execution

We will ask the TypeScript compiler to compile our TypeScript code into JavaScript so that we can use Node.js to run our code. We will type in the command tsc digitsInNumber.ts countDigitsDriver.ts to compile the code. We shall execute it using node countDigitsDriver.ts.

If everything went well, we should see our expected output.

Expected output
Expected output on executing countDigitsDriver with Node.js

Conclusion

We have successfully defined, exported and used a namespace. We learnt how we can export only selected members of a namespace. We also learnt how to use the members of a namespace properly.

We will be seeing some more awesome concepts in TypeScript in the upcoming weeks. Stay tuned, stay safe. Peace out.

Further Ahead

If you want to know more about namespaces and stuff, here are some useful resources.

--

--

Nocturnal animal that thrives on caffeine and loves software development.