Essay5 minute read

TypeScript basics with cars

Teaching TypeScript to my autistic son (pt 1)

  • typescript
  • learning
  • teaching
  • software-design

pedro-no-carrinho

Pedro is 8 years old and autistic.

He said he wants to learn to code so he can work with his dad. This series is for him, using cars, which is his hyperfocus.

We start with primitive and special types, always tying each one to a part of the car.

number

The speedometer and odometer return numbers. Only numbers.

function lerVelocidade(): number {}
// 80
function lerQuilometragemTotal(): number {}
// 230000

Without this on the dashboard, you can't tell the speed or how many km the car has driven.

string

License plate, make, model: text with letters and numbers.

function lerPlacaDoCarro(): string {}
// 'ABC-1D34'
function lerMarcaEModelo(): string {}
// 'Chevrolet Classic'

boolean

On or off. Engine running or not.

function motorEstaLigado(): boolean {}
// true | false

null

The luggage that still goes in the trunk: the space exists, the contents don't yet.

let bagagem: string | null = null;

undefined

The empty slot in the console. Nobody decided what to install there yet.

let acessorioDoConsole;
/* Nada foi atribuído ainda */

symbol

Two stickers with the same name in different places on the car. Symbol keeps them apart.

const adesivo1 = Symbol("adesivo");
const adesivo2 = Symbol("adesivo");

const carro = {
  adesivo: "adesivo no capô",
  [adesivo1]: "adesivo embaixo do banco",
  [adesivo2]: "adesivo na caixa de roda"
}

console.log(Object.values(carro))
// ['adesivo no capô']

console.log(carro[adesivo1])
// 'adesivo embaixo do banco'

console.log(carro[adesivo2])
// 'adesivo na caixa de roda'

any

The junk drawer with no organization: broom, tool, ball... you never know what you'll pull out.

let portaTrecos: any = "vassoura";
portaTrecos = 22;
portaTrecos = null;
portaTrecos = false;

unknown

The closed glove box. Something's inside, but you open it and check before using it.

let objetoNoPortaLuvas: unknown = "manual do carro";

function lerManual(manual: string) { /* ... */ }

if (typeof objetoNoPortaLuvas === "string") {
  lerManual(objetoNoPortaLuvas)
}

never

When a function deliberately returns nothing, like trying to start an engine that no longer exists.

function ligarMotorQuebrado(): never {
  throw new Error("Kaboom!");
}

void

Opening a door or the trunk: the action happens, but nothing comes back.

function abrirPortaDoCarro(): void {}

Next episode: more types, still with cars. The series continues soon.