Terminology

Terminology plays an important role in understanding TypeScript and JavaScript. Terminology helps us to describe a complex context and prevents us from confusion when talking about code.

As important as it is to know the control structures of a programming language, it is just as important to be able to name their contexts and surroundings. Using the right vocabulary is particularly effective in code reviews as it supports us to put our thoughts into words.

Algorithms & Functions

An algorithm is a set of instructions to solve specific problems or to perform a computation. In TypeScript algorithms can be implemented with functions.

Algorithm Characteristics

Algorithms have defining characteristics such as:

Imperative Programming

Imperative programming is a programming paradigm that uses statements to change an application’s state. In a nutshell, imperative programming defines a set of instructions from start to finish.

Example:

Declarative Programming

Declarative programming is a programming paradigm that defines the desired state of an application without explicitly listing statements that must be executed. In a nutshell, declarative programming defines an application’s execution from finish to start.

Example:

Deterministic Functions

A deterministic function will always produce the same output given the same input. This makes the output of a deterministic function predictable as it does not rely on a dynamic state.

Pure Functions

Pure functions are a subset of deterministic functions. A pure function always produces the same result given a particular input. In addition, it does not cause side effects by avoiding I/O operations like printing to the console or writing to the disk.

A pure function does not mutate its passed parameters and is referentially transparent.

Referentially Transparent Expressions

An expression is referentially transparent when it can be replaced with its return value.

Example:

1
2
3
4
5
function sayHello(): string {
return `Hello!`;
}

const message = sayHello();

The sayHello function always returns the same text, so we can safely replace our expression with const message = Hello! which makes it referentially transparent.

Referentially Opaque Expressions

An expression is referentially transaprent when it cannot be replaced with its return value.

Example:

1
2
3
4
5
function today(): string {
return new Date().toISOString();
}

const isoDate = today();

At the time of writing the exection of today() returned '2021-09-22T12:45:25.657Z'. This result will change over time, so we cannot replace const isoDate = today() with const isoDate = '2021-09-22T12:45:25.657Z' which makes this expression referentially opaque.

Function Declaration

A function declaration gets hoisted and is written the following way:

1
2
3
function myFunction(): number {
return 1337;
}

Function Expression

A function expression is part of an assignment and does not get hoisted:

1
2
3
const myFunction = function(): number {
return 1337;
}

Function Scope

By default, JavaScript is function scoped, which means that variables are acccessible within a function:

1
2
3
4
5
6
7
8
9
function myFunction(): void {
if (true) {
var myNumber = 1337;
}
// Variable `myNumber` can be accessed within the function although it is being used outside of its conditional if-block
return myNumber;
}

console.log(myFunction()); // 1337

Block Scope

To enforce block-scoping in JavaScript, the let keyword can be used. It makes variables unaccessible from the outside of their blocks:

1
2
3
4
5
6
7
8
9
function myFunction(): void {
if (true) {
let myNumber = 1337;
}
// Will throw a `ReferenceError` because `myNumber` is not defined
return myNumber;
}

console.log(myFunction()); // Causes an uncaught `ReferenceError`

TypeScript

Ambient Context

By default, the TypeScript compiler does not know in which runtime environment (for instance Node.js v16, Electron v16, Chrome v94) our code will be executed later. That’s why we can help the compiler knowing that by defining an ambience / ambient context.

Example: If you run your code in an environment where there is a “world” object that TypeScript does not know about, you can define that context using declare var:

1
2
3
4
5
declare var world: {
name: string;
};

console.log(world.name);

Union Types

A union type is a variable which can store multiple types (i.e. string, number, etc.):

1
2
3
4
type MyUnionType = string | number;

const myName: MyUnionType = 'Benny';
const myAge: MyUnionType = 34;

Module

In TypeScript a module is a file with at least one top level import or export statement.