Tipos Anuláveis ('strictNull')

Parte da seção Introdução ao TypeScript do Journey de JavaScript da Coddy. Lição 71 de 73.

Por padrão, o TypeScript permite que null e undefined sejam atribuídos a qualquer tipo, o que pode levar a erros de tempo de execução. A opção de compilador strictNullChecks altera esse comportamento ao tornar null e undefined seus próprios tipos distintos.

Quando o strictNullChecks está habilitado, você deve incluir explicitamente null ou undefined em suas anotações de tipo se quiser permitir esses valores:

// Sem strictNullChecks - isso seria permitido
let name: string = null; // Erro com strictNullChecks!

// Com strictNullChecks - você deve ser explícito
let name: string | null = null; // Agora isso funciona

Isso força você a lidar com possíveis valores null antes de usá-los. Você não pode chamar métodos ou acessar propriedades em um valor que pode ser null sem antes verificar:

function processName(name: string | null) {
  // Isso causaria um erro
  // console.log(name.toUpperCase());
  
  // Você deve verificar primeiro
  if (name !== null) {
    console.log(name.toUpperCase()); // Seguro para usar
  }
}

Esta opção do compilador ajuda a prevenir os erros de tempo de execução comuns "Cannot read property of null" ao capturá-los em tempo de compilação, tornando seu código mais confiável e previsível.

Desafio

Fácil

Crie uma função que processe com segurança dados de perfil de usuário que podem conter valores null. Este desafio demonstra como o strictNullChecks força você a lidar com tipos anuláveis explicitamente.

Crie uma função chamada getUserDisplayName que:

Recebe um parâmetro fullName do tipo string | null
Retorna o nome completo se não for null
Retorna "Anonymous User" se o nome completo for null
Possui um tipo de retorno explícito de string

Crie uma segunda função chamada formatUserEmail que:

Recebe um parâmetro email do tipo string | null
Retorna o e-mail em letras minúsculas se não for null
Retorna "No email provided" se o e-mail for null
Possui um tipo de retorno explícito de string

Crie uma terceira função chamada getUserInfo que:

Recebe dois parâmetros: name do tipo string | null e email do tipo string | null
Usa ambas as funções anteriores para processar os parâmetros
Retorna uma string formatada: "Name: [processed name], Email: [processed email]"
Possui um tipo de retorno explícito de string

Teste suas funções com os seguintes dados:

Chame getUserDisplayName("John Smith") e imprima o resultado
Chame getUserDisplayName(null) e imprima o resultado
Chame formatUserEmail("ALICE@EXAMPLE.COM") e imprima o resultado
Chame formatUserEmail(null) e imprima o resultado
Chame getUserInfo("Bob Johnson", "bob@test.com") e imprima o resultado
Chame getUserInfo(null, null) e imprima o resultado
Chame getUserInfo("Sarah Wilson", null) e imprima o resultado

Experimente você mesmo

// TODO: Escreva seu código aqui
// Crie a função getUserDisplayName que recebe fullName (string | null) e retorna string

// Crie a função formatUserEmail que recebe email (string | null) e retorna string

// Crie a função getUserInfo que recebe name e email (ambos string | null) e retorna string

// Teste as funções e imprima os resultados
console.log(getUserDisplayName("John Smith"));
console.log(getUserDisplayName(null));
console.log(formatUserEmail("ALICE@EXAMPLE.COM"));
console.log(formatUserEmail(null));
console.log(getUserInfo("Bob Johnson", "bob@test.com"));
console.log(getUserInfo(null, null));
console.log(getUserInfo("Sarah Wilson", null));