What is TypeScript?

Introduction

TypeScript is a programming language developed by Microsoft to introduce stronger object typing to JavaScript. One of the main architects of TypeScript was Anders Hejlsberg. The first public version of TypeScript (0.8) appeared in 2012.

In time, TypeScript became much more than a strong object typing solution for JavaScript. TypeScript version 4 enhances JavaScript development with:

  • static type checking of variable values,

  • static type checking of function arguments,

  • static checking of certain operations,

  • static control flow analysis, and

  • some non-static (i.e. available at runtime) extensions to JavaScript such as enums.

There are the two crucial concepts to grasp when it comes to type checking in TypeScript:

  • the TypeScript type checking is static,

  • the TypeScript type checking of object values is structural.

It is also worth noting that from a syntax perspective TypeScript is a strict superset of JavaScript which means that any JavaScript code is a valid TypeScript code from a syntactic perspective. However, not all TypeScript code is valid JavaScript code.

Static Type Checking of Variable Values

In JavaScript, a variable declared with let (or var) can be reassigned not only to a different value of the same type but also to a different value of a different type. Further, it is not possible in JavaScript to restrict the possibility of re-assignment of a variable declared with let (or var) to a value of a different type.

// Pure JavaScript
let firstName = 'Joe'
firstName = 42 // Allowed re-assignment.

TypeScript can be used to restrict such a possibility.

// TypeScript
let firstName: string = 'Joe'
firstName = 42 // TS Problem: Type 'number' is not assignable to type 'string'.

In the above example TypeScript rises a problem of assignment of a value of type number to the variable with a restricted value type of string.

The type checking of assignments and re-assignment of variables by TypeScript takes place before JavaScript runtime.

Static Type Checking of Functions #1

In JavaScript, it is not possible to restrict value types of arguments that are being passed to functions.

// JavaScript
function multiply(a, b) {
  return a * b
}

multiply(2,3) // => 6
multiply('two', { num: 3 }) // => NaN

TypeScript can be used to restrict such a possibility.

// TypeScript
function multiply(a: string, b: string) {
  return a * b
}

multiply(2,3) // => 6
multiply('two', { val: 3 }) // TS Problem: Argument of type 'string' is not assignable to parameter of type 'number'
multiply(2, { val: 3 }) // TS Problem: Argument of type '{ val: number; }' is not assignable to parameter of type 'number'.

The type checking by TypeScript of arguments being passed to functions is static i.e. takes place before JavaScript runtime.

Static Checking of Certain Operations

In JavaScript calling undefined, null, a string, a number or other uncallable values during runtime results in TypeError: null is not a function. Such an error - if not caught - might crash the program.

const fooBar = {
  foo: () => "I'm callable!",
  bar: "I'm not!"
}

fooBar.foo() // => "I'm callable!"
fooBar.bar() // TypeError: fooBar.bar is not a function
fooBar.baz() // TypeError: fooBar.baz is not a function

TypeScript allows for catching such bugs before JavaScript runtime.

const fooBar = {
  foo: () => "I'm callable!",
  bar: "I'm not!"
}

fooBar.foo() // => "I'm callable!"
fooBar.bar() // TS Problem: This expression is not callable. Type 'String' has no call signatures.
fooBar.baz() // TS Problem: Property 'baz' does not exist on type '{ foo: () => string; bar: string; }'.

Static Control Flow Analysis

TypeScript can help detect some bugs through static control flow analysis.

if (true) {
  "Yes! It's true!"
} else {
  "Nay! Not true!" // TS Problem: Unreachable code detected.
}

Non-Static Extensions to JavaScript

The crucial functionality of TypeScript is static code checking from type and other perspectives. However, TypeScript introduces some runtime extensions to JavaScript. The most prominent of those are enums which shall be described in later chapters.

We use cookies and similar technologies to enhance the quality of services, maintain statistics and adjust marketing content. You will find more information in the Cookies Policy.

By clicking OK you grant consent to processing of your personal data by us and our Trusted Partners with the purpose of maintain statistics and adjustment of the marketing content pursuant to the Privacy Policy. If you wish to not grant that consent and/or limit its extent click Settings.