TypeScript

Type an object

1. 05Adding types to objectsWrite down which named values go inside an object, and catch a typo the moment you make it.5 slides · 13 exercisesGo to the exercises

Give the shape a name

1. 06Giving a type a nameWrite type Person = { ... }; to name a shape, so you never write the same type twice.5 slides · 13 exercisesGo to the exercises
2. 07Declaring a shape with interfaceLearn interface Person { ... }, the other way of declaring the shape of an object.6 slides · 13 exercisesGo to the exercises

Pin down the details

1. 08Fields you can leave out, and fields you never changeDeclare "this might not be there" with ?, and "do not change this later" with readonly.6 slides · 13 exercisesGo to the exercises
2. 09Arrays of objectsWrite Item[] and handle data that is a row of objects of the same shape, all by the type.6 slides · 13 exercisesGo to the exercises

Go one step further

1. 10Same shape, and it goes throughWhether a type fits is decided by the shape, not the name. An object that never claimed to be a Person goes through.6 slides · 13 exercisesGo to the exercises
2. 11When you do not know the names of the keysWrite { [key: string]: number } to type an object whose keys you cannot know until it runs.6 slides · 13 exercisesGo to the exercises
3. 12Arrays you cannot changeWrite readonly string[] to declare a read-only array. Changing it by accident gets stopped by the type.5 slides · 13 exercisesGo to the exercises

Say it is one of these types

1. 13Either type will doJoin types with |, as in string | number, to write down "it could be either".5 slides · 13 exercisesGo to the exercises
2. 14Allow only certain valuesMake the values themselves into a type, as in "red" | "blue", and catch typos on the spot.5 slides · 13 exercisesGo to the exercises

Check before you use it

1. 15Check before you use itNarrow it down with if (typeof x === "string") and use it as one of the two types inside.5 slides · 13 exercisesGo to the exercises
2. 16Avoid any, use unknownany switches the checking off. Take a value you do not know with unknown and check it before you use it.5 slides · 13 exercisesGo to the exercises

Tell objects apart

1. 17Unions you tell apart by a markerGive each type a shared marker property so you can tell unions of objects apart with an if.5 slides · 13 exercisesGo to the exercises

Type every way of writing one

1. 18Add types to an arrow functionWith the => shape too, the types of the parameters and the return go in the same places as with function.5 slides · 13 exercisesGo to the exercises
2. 19Parameters you can leave outMake a parameter you do not have to pass with ?, and write out what happens when it is left out.5 slides · 13 exercisesGo to the exercises

Hand a function around

1. 20Hand a function itself aroundA function type is written (n: number) => string. Inside the brackets are the parameters, right of the arrow is the return.5 slides · 13 exercisesGo to the exercises
2. 21Array methods and inferred typesThe parameter of a function you hand to map or filter is settled by the array type, so you need not write it.6 slides · 13 exercisesGo to the exercises

Type the fields

1. 22Type the fields of a classDeclare what a class holds up front, and catch mix-ups around this. the moment they happen.5 slides · 13 exercisesGo to the exercises
2. 23Guard things with private and readonlyWrite into the class how far outside can reach and how long things can change, and stop accidental rewrites.5 slides · 13 exercisesGo to the exercises

Inherit, and promise a shape

1. 24Type a class you inheritedType extends and super, and catch the mix-ups where you thought you were overriding something.5 slides · 13 exercisesGo to the exercises
2. 25Implement an interfaceWrite implements on a class to promise "I meet this shape", and catch anything you forgot to write.5 slides · 13 exercisesGo to the exercises

Write it shorter

1. 26Skip the field declarationsPut private on a constructor parameter and get the field declaration and the assignment in one go.5 slides · 13 exercisesGo to the exercises

Read and write angle brackets

1. 27Read the angle bracketsLearn to read the angle brackets in Array<string>, and see that it is the same thing as string[].5 slides · 13 exercisesGo to the exercises
2. 28A function with a type parameterWrite <T> after the function name and make one function that works with an array of any type.5 slides · 13 exercisesGo to the exercises

Share types between files

1. 29Share types between filesSend a type out with export type and take it in with import type. Reuse your types across files too.6 slides · 13 exercisesGo to the exercises

What you will meet next

1. 30What you will meet nextTake a peek at five ways of writing this course does not cover — just enough to read them.6 slides · 13 exercisesGo to the exercises