Section 2: TypeScript Basics
In this section, we will delve into the basics of TypeScript. We will explore data types, variables, functions, and objects, and understand how to leverage TypeScript's type system to write safer and more maintainable code.
Data Types
TypeScript introduces several built-in data types that allow us to specify the kind of values a variable can hold. Here are some commonly used data types:
- number: Represents numeric values, such as 5 or 3.14.
- string: Represents textual data enclosed in single quotes ('') or double quotes ("").
-
boolean: Represents a logical value, either
true
orfalse
. - array: Represents an ordered collection of elements of the same type.
- tuple: Represents an array with fixed-length and specific types for each element.
- enum: Represents a set of named constant values.
- any: Represents any type, allowing flexibility but losing type safety.
let age: number = 30;
let name: string = 'John Doe';
let isStudent: boolean = true;
let numbers: number[] = [1, 2, 3, 4, 5];
let coordinates: [number, number] = [10, 20];
enum Color { Red, Green, Blue };
let favoriteColor: Color = Color.Blue;
let anyValue: any = 'Hello World';
Variables and Constants
In TypeScript, we can declare variables using the let
keyword and constants using the const
keyword. Variables declared with let
can be reassigned, whereas constants declared with const
are read-only and cannot be reassigned.
let age: number = 30;
const PI: number = 3.14;
Functions and Arrow Functions
TypeScript allows us to define the types of function parameters and return values. This provides clarity and helps prevent errors during development.
function add(a: number, b: number): number {
return a + b;
}
const multiply = (a: number, b: number): number => {
return a * b;
};
Objects and Interfaces
In TypeScript, we can define the shape of an object using interfaces. Interfaces provide a way to enforce a contract and ensure that objects have specific properties and methods.
interface Person {
name: string;
age: number;
greet: () => void;
}
const john: Person = {
name: 'John Doe',
age: 30,
greet: () => {
console.log(`Hello, my name is ${john.name} and I'm ${john.age} years old.`);
}
};
john.greet();
Type Inference
TypeScript has a powerful type inference system that can automatically deduce the types of variables based on their initial values. This reduces the need for explicit type annotations in many cases.
let message = 'Hello, TypeScript!'; // TypeScript infers the type as string
let count = 5; // TypeScript infers the type as number
Type inference allows us to write concise code while maintaining type safety.
In the next section, we will dive deeper into TypeScript by exploring advanced concepts such as union and intersection types, type inference, generics, and type guards.
Top comments (2)
Nice work.
Query: Why do we add es6 concepts like let const, arrow function as typescript feature
Good point! Those Es6 concepts are not a TypeScript feature but i wanted the person who read the blog post to have updated (Es6) code to learn from.