What is TypeScript?

TypeScript is a strongly typed programming language based on JavaScript. It allows developers to specify what type of data a variable, function, or object should contain.

let name: string = "Rahul";

Here, name is declared as a string.

TypeScript was developed and is maintained by Microsoft. It was designed to make JavaScript development easier for large and complex applications.

Today, TypeScript is commonly used in modern web and application development.

TypeScript is built on JavaScript. This means JavaScript knowledge is very useful when learning TypeScript.

let age = 20;

The above JavaScript code is also valid TypeScript code.

The most important feature of TypeScript is its type system. You can specify the type of data stored in a variable.

let age: number = 20;
let name: string = "Amit";
let active: boolean = true;

This helps developers detect many mistakes while writing code.

TypeScript can detect many type-related errors before the program runs.

let age: number = 20;

age = "Twenty";

The second line produces a type error because a string is being assigned to a variable declared as a number.

Type checking means checking whether values are being used with the correct data types.

let marks: number = 90;

The variable marks should contain a number.

Normal TypeScript files use the .ts extension.

app.ts
student.ts
calculator.ts

The .ts extension tells us that the file contains TypeScript code.

When TypeScript is used with JSX, the file normally uses the .tsx extension.

App.tsx
Home.tsx
Profile.tsx

This is especially useful when working with React and React Native.

Browsers and JavaScript environments normally execute JavaScript. Therefore, TypeScript code is compiled into JavaScript.

TypeScript
    ↓
Compiler
    ↓
JavaScript
    ↓
Execution

The TypeScript compiler converts TypeScript code into JavaScript code. The compiler is commonly called tsc.

tsc app.ts

This command can compile app.ts into JavaScript.

TypeScript is often described as a superset of JavaScript. This means valid JavaScript code can generally be used inside a TypeScript file.

let message = "Hello";

console.log(message);

This is valid TypeScript because it is also valid JavaScript.

TypeScript supports static typing. You can explicitly define the type of a variable.

let price: number = 500;

The variable price is expected to contain a number.

Types can be assigned to variables using a colon :.

let studentName: string = "Ravi";
let age: number = 21;
let passed: boolean = true;

This makes the expected data type clear.

TypeScript can also specify parameter and return types in functions.

function add(a: number, b: number): number {
    return a + b;
}

Here both parameters and the return value are numbers.

TypeScript can describe the structure of an object.

let student: {
    name: string;
    age: number;
} = {
    name: "Amit",
    age: 20
};

This helps ensure that the object contains the expected properties.

TypeScript can specify what type of values an array should contain.

let marks: number[] = [80, 90, 75, 88];

This array is expected to contain numbers.

Interfaces allow developers to define the structure of objects.

interface Student {
    name: string;
    age: number;
}

The interface can then be used to describe student objects.

TypeScript supports classes and object-oriented programming.

class Student {
    name: string;

    constructor(name: string) {
        this.name = name;
    }
}

Classes can be useful for creating structured applications.

Type annotations make the expected data type clear.

function calculateTotal(price: number): number {
    return price + 100;
}

A developer can quickly understand what the function accepts and returns.

As an application becomes larger, managing many variables, functions, objects, and components can become difficult.

TypeScript helps developers organize and check the structure of their code.

TypeScript can be used to develop React applications.

function Welcome() {
    return <h1>Welcome</h1>;
}

With TypeScript, React components, props, state, and events can also be given appropriate types.

TypeScript can also be used with React Native to build mobile applications.

const App = () => {
    return (
        <View>
            <Text>Hello Mobile App</Text>
        </View>
    );
};

TypeScript helps provide type safety while developing React Native apps.

TypeScript works well with modern code editors. Editors can provide features such as:

• Code completion
• Error highlighting
• Type information
• Suggestions
• Refactoring support

Because TypeScript understands the types of variables and objects, development tools can provide better autocomplete suggestions.

let student = {
    name: "Amit",
    age: 20
};

When working with student, the editor can understand its available properties.

TypeScript can detect many common programming mistakes during development.

let age: number = 20;

// Error
age = "Hello";

Finding errors during development can make debugging easier.

TypeScript supports modern JavaScript features such as:

• let and const
• Arrow functions
• Classes
• Promises
• Destructuring
• Modules

If you are learning React Native, TypeScript can help you write safer components, props, state, navigation parameters, API data, and forms.

For this reason, TypeScript is an important technology for modern React Native development.

let name: string = "Rahul";
let age: number = 22;

function showStudent(
    studentName: string,
    studentAge: number
): void {
    console.log(studentName);
    console.log(studentAge);
}

showStudent(name, age);

This example uses variables, type annotations, and a typed function.

A simple TypeScript development flow is:

1. Write TypeScript code.
2. Check the code for type errors.
3. Compile TypeScript into JavaScript.
4. Run the resulting JavaScript.

TypeScript
   ↓
Type Checking
   ↓
Compilation
   ↓
JavaScript
   ↓
Application

TypeScript is useful because it provides a type system on top of JavaScript and improves the development experience for larger applications.

For a React Native developer, learning TypeScript will help you work with typed components, props, state, navigation, API responses, and reusable application code.