Typescript reclama sobre os tipos de variáveis após a desestruturação de arrays

Eu tenho uma função

function foo() {
    return ["", 1, () => ""];
}

os tipos são: string, number e (() => string)

no entanto, depois que eu desconstruo esses valores

const [str, num, func] = foo();

o compilador trata cada variável como tipo: string | number | (() => string)

Quero passar essas variáveis em funções, mas o compilador reclama que os tipos não coincidem e meu IDE enlouquece com o texto sublinhado em vermelho. O que posso fazer?

Resposta #1

Especifique o tipo de retorno da função

function foo(): [string, number, () => string] {
    return ["", 1, () => ""];
}

Isso irá tipar estritamente a função para retornar um array com:

• valor do índice 0 para ser do tipo string
• valor do índice 1 para ser do tipo number
• valor do índice 2 deve ser do tipo () => string/função que retorna string

function foo(): [string, number, () => string] {
    return [0, 1, () => ""]; // Will shows error because index 0 is number, not string
}

Resposta #2

Outra maneira de alcançar isso é:

function foo() {
  return ['', 1, () => ''] as const
}

const [str, num, func] = foo()

A principal diferença com as const e sem ele é que:

• as const diz ao ts que é um valor imutável, portanto ts infere o tipo concreto que, neste caso, é uma tupla de 3, e como você sabe, a tupla pode ter tipos diferentes
• sem as const, o ts infere como Array e o array aceita um único parâmetro de tipo, mas neste caso o array está contendo valores string, number e func. Portanto, o ts infere como (string | number |() -> string)[]