Back To Module Home

TypeScript for Beginners

0% completed

Introduction to TypeScript

Why Use TypeScript?Using TypeScript What is TypeScript?Understanding the benefits of TypeScript with React

Variables

Declaring a Variable

Declaring Types in Untyped Code

Hoisting Variables

TypeScript Scope is JavaScript Scope

The Multiple Methods of Declaring a String

What is a Number in TypeScript?

Booleans, Functions, and Objects

Avoiding `any` at Any Time Possible

Understanding and using the void type

Mutable and Immutable Arrays

Undefined Versus Null

The Primitive Type never

Unknown: A Better any

Literal Type to Narrow Primitive Type

Symbol and Unique Symbol

Casting to Change Type

Enum

Enum With and Without Values Accessing Enum Values Merging and Adding Functionality to Enum

Mapped Type

Definition and Usages Immutable Data with Readonly Partial Nullable Pick Omit Record Extract Exclude ReturnType Custom Mapped Type

Advanced Variables

Intersecting with Types, Interfaces, and Generics Literal Type, Narrowing, and Const Union with Types and Tagged Union Discriminated Unions in Practice State Machines Discriminated Unions vs Subtyping Const Assertion for Literal Values Tuple For Type and Length Arrays keyof to Validate a Member's Name Conditional Types Introduction Built-in Conditional Types TypeScript Inference Conditional Types Example - React Component Props Type Guards Custom Type Guards Nominal Types Set and Dictionary

Creating Types

Creating a strongly-typed array Creating a strongly-typed tuple Creating type aliases Creating interfaces Creating union types Creating intersection types Understanding type compatibility Quiz

Generic Type

Generic Using some standard generic types Generic Functions Generic Functions Example - Typing `reduce`Creating generic interfaces Creating generic type aliases Generic and Classes Quiz Generic with Construction Functions Generic Interfaces - OOP Perspective Generic Interfaces - FP Perspective Generic Constraint Type Argument Constraints Type Constructors Type Argument Propagation Generic Outside Class Generic Comparison Generic Inference Generic Default Generic and keyof

Strict Types

Introduction No Implicit `any`Fixing `noImplicitAny` Errors The `unknown` Type Strict Null Checks Optionality Strict Property Initialization Non-Null Assertion Operator Exercise in Strictness

Functions

Named and Anonymous Functions Function and Inference Variables Generic Return Type, Optional Parameter and Default Value Functions in Classes Function Relationship with "this"Overload Functions to Enrich your Definition Types of Function Headers

Objects

Introduction to TypeScript's Many Objects The Curly Braces Object New Object Lowercase vs UpperCase Object Creating a strongly-typed object

Iterators

Iterating an Object's Keys with For-In Iterating an Object with Standard For/While Iterating and the Asynchronous Loop

Manipulating Objects and Arrays

Typing an Array Array with a Skipped Value Destructuring an Array Destructuring an Object The Spread Operator and Arrays The Spread Operator and Objects The Bang Operator

Exception, Debugging & Practical Applications

Creating an Exception Catching Synchronous Exceptions Catching Asynchronous Exceptions Assertion Functions Debugging Errors: Type Assignability Debugging Errors: Narrowing Types Debugging Errors: Unintuitive Error Message React and TypeScript: `useState` Hook React and TypeScript: `useReducer` Hook RxJS and TypeScript: `pipe`

Alias

Aliases with the Structural Behavior of TypeScript Aliases with Type Aliases with Generic Types and Recursivity The Differences between Type Aliases and Interfaces Branded Alias

Type Checking

Type Checking and Interface with a Discriminator Type Checking with Intersections Type Checking an Interface with Custom User-Defined Type Guard Optional Chaining and Optional Element Access Nullish Coalescing Assertion Functions

Index Signature

Definitions and Usages String or Number Indexes Members of the Same Type Keys with Constants and Symbols

Sharing Code

Namespace Module Default Module Lazy Loading Module

Conclusion

...

/

Mutable and Immutable Arrays

Mutable and Immutable Arrays

In this lesson, you will learn about two different syntaxes to define an array.

Mutable arrays

Arrays in TypeScript are exactly like the ones in JavaScript in terms of features. The difference is that TypeScript assigns a type to the list.

The syntax, as shown below, utilizes square brackets [] with the actual type before the brackets and after the colon : like so:

Press + to interact

let a: number[];

It is also possible to initialize values during the declaration. In the following example, the two arrays are typed. TypeScript infers that the first one is a number and the second is a string. You can move your cursor over the two variables to see the types.

Press + to interact

let arrayOfNumber = [1, 2, 3]; 
let arrayOfString = ["string", "array", "only"];

Using multiple types will require you to evaluate what the type of each value is before using an individual item of the array. This is because the variable’s operations are type-dependent. There is an equivalent syntax that uses the ...