Typescript is a syntactical superset of Javascript that has strict rules for formatting designed to allow programmers to write code with fewer bugs. Open-sourced and maintained by Microsoft, Typescript was created in 2012 to extend the features and syntax of Javascript adding an extra layer of error prevention to large and complex code bases by preventing incorrect datatypes from being entered. Whenever a variable is created, a datatype can be explicitly defined and an error will be thrown if at any point the wrong type of value is assigned to it. One of the many benefits of Typescript is the ease of use for anyone familiar with Javascript, any code that can be written in Javascript can be written in Typescript and it will get trans-piled into Javascript. This article will serve as a brief introduction to the many capabilities of TS.
Explicit vs. Implicit
There are two ways that data types are defined in Typescript. A datatype can be implicitly defined by assigning a value to the variable and that variable can not be re-assign to another
type. When declared explicitly type declaration syntax is used to define the only datatype that the variable can hold.
//Implicit strong typing:
let num = 25;// value of num can only be a number
num = '25'; // re-assigning to string throws an error
//Explicit strong typing:
let int: number = 13;// value of int can only be a number
int = '13' // re-assigning to string throws an error
In the second example above the keyword 'number' after the colon will ensure that that variable will never be re-assigned to a non-number datatype. Forcing a primitive data type is not always a requirement, if a variable may contain different types of data, the 'any' keyword could be used to avoid implicitly setting it.
Arrays
For complex data types the type of primitive data that make up collections is set when when creating the variable, with an array all elements can have the same datatype like this:
let nums: numbers[] = [ 1, 2, 3, 4, 5 ];
nums.push('6'); //throws error
Or Arrays can have a mix of datatypes which enables the creation of a new type of collection, tuples, which are have fixed lengths where each element's data type is pre-determined.
let employee: [string, number];
employee = ['John Doe', 12345];
console.log(`Name: ${employee[0]}`);
console.log(`ID: ${eployee[1]}`);
Objects
When strong typing is used on objects it ensures that a class of objects will have the same format. A very minimal change to a vanilla constructor function will ensure uniformity among all instances which allows you to catch bugs during development and reduce the number of run-time errors. Code will also be easier to read understand and refactor. When creating the blueprint for an object an interface is used:
interface Pet {
name: string;
age: number;
};
const pet: Pet = {
name: 'Mr. Whiskers',
age: 6,
};
Functions
Functions in typescript allow for strong typing either the arguments and/or the returns.
let add = (x: number, y: number): number {
return x + y;
}
console.log(add(3, 5)); //prints: 8
console.log(add('3', '5')); //throws error
Conclusion
This article gives fairly simple examples of how to force type variables and some of them are redundant and would not practically be used but were given to distinguish between the implicit and explicate creation methods, but Typescript is a very useful tool. Utilizing Typescript requires a bit more work at the beginning of a project but will have immense benefits throughout the project allowing for more efficient coding.
Top comments (0)