Essential TypeScript Types – Get Started with TypeScript
source link: https://www.tuicool.com/articles/hit/ZZNZbqE
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
To begin using TypeScript, you must have the compiler installed which can be done through npm. Followthis article if you would like a more in-depth guide to installing and getting started with TypeScript. Be sure that you are always working in a
.ts file and compiling your code using
Learn TypeScript - Best TypeScript Tutorials (2018) | gitconnected
The top 18 TypeScript tutorials. Courses are submitted and voted on by developers, enabling you find the best… gitconnected.com
To declare a variable type, you can simply add colon
: next to the declaration followed by the variable type.
TypeScript is also able to infer types based on the first variable declaration, so in the previous instance, the types are not actually required for TypeScript to correctly identify the variables.
A use-case for declaring types would be a function definition. You define the parameters sothat the function is always invoked correctly.
TypeScript has very clean syntax to handle arrays. You define the type of values in the array follow by braces
Objects as Interfaces
key/value pairs. TypeScript allows you to define the data on an object by using an interface definition.
interface comes before the name. The name itself is typically capitalized and there is no
= before the bracket. The lines end in
; instead of a comma
When defining a function on an interface, you define the types of the arguments and the type of the return value. In this case, it takes a single argument
number and then returns a
To define an array of objects, the syntax is identical to defining it with primitive types. You use the name of the interface followed by braces. Below is an array of
While the concept of extending interfaces is more advanced, I’ll introduce here to provide familiarity. There can be cases when you want to create a base interface and then have other interfaces that inherit from it. For example, we previously created a
Product interface which defines the essential values that belong to a product. We could now create specialized products which will receive all the properties of the original product as well as new ones defined on the interface. This is done using the word
Computer interface contains all the properties associated with a
Product as well as it’s own unique properties. By extending interfaces, you are able to reduce code duplication and create logical base cases.
Null and Undefined and Unions
TypeScript provides built-in types for both
undefined which are defined by using their names.
By themselves, this is not too useful. However, you can combine types in TypeScript by using a
union indicated by a
In this case,
favoriteAthlete can either be a
string or it can be
null . Not everyone may care about sports :)
undefined values are common in objects, there is a special syntax for indicating that a
key/value is optional (meaning it will be undefined if not added). This is accomplished by adding a
? next to the key name.
Special TypeScript Types
Enum:Create named maps in TypeScript
Any:It will work with any value and not throw a TypeScript error.
any should only be used if the value can truly be anything or it’s unknown, and you are prepared to handle that in your code.
void is the opposite of
any — the value has no type at all. Void is used most commonly with functions that do not return.
If you can learn these fundamental TypeScript types, you are well on your way to being able to use the language. In fact, these will cover probably cover at least 80% of your use-cases in daily coding, and you should now be able to dive in and start working with TypeScript. When you feel ready, check out some more advanced TypeScript examples .
Aggregate valuable and interesting links.
Joyk means Joy of geeK