0

Bom dia, estou estudando typescript e estou com o seguinte erro:

Inicialmente a intenção desse exemplo é criar uma função que recebe um array de objetos e retorna o nome dos alunos aprovados, obs: coloquei o retorno da função como boolean porque na lógica atual está retornando um array com boolean e strings, mas o problema maior é a mensagem de erro

A propriedade '**nota**' e '**name**' não existe no tipo '**object**'

segue abaixo o exemplo:

 const students: Array<object> = [
  { name: 'Carla', nota: 6 },
  { name: 'Fernando', nota: 5 },
  { name: 'Ana',  nota: 7 },
  { name: 'Denis', nota: 8 },
  { name: 'Alice', nota: 9 },
  { name: 'Antonio', nota: 9 }
]

const aprovados = (lista: Array<object>): Array<boolean | string> => {
  return lista.map((index) => (index.nota >= 7) && `${index.name}`)
}
console.log(aprovados(students));

Queria saber como poderia ficar a tipagem desse index

1
  • Bem simples, no lugar de <object> vc pode passar uma interface, um type ou até mesmo uma classe .
    – LeAndrade
    Commented 1/04/2022 às 14:27

1 Resposta 1

3

Você pode criar uma interface e definir os subtipos do objeto em questão, por exemplo:

interface Alunos {
  name: string;
  nota: number;
}

const alunos: Array<Alunos> = [
  { name: 'Carla', nota: 6 },
  { name: 'Fernando', nota: 5 },
  { name: 'Ana',  nota: 7 },
  { name: 'Denis', nota: 8 },
  { name: 'Alice', nota: 9 },
  { name: 'Antonio', nota: 9 }
]

Já para explicar o porque do retorno da sua função está vindo como boolean ou string, primeiro você deve entender como funciona o método .map():

O método map() invoca a função callback passada por argumento para cada elemento do Array e devolve um novo Array como resultado.

Ou seja, no seu código map está passando por cada item de lista e retornando um array onde cada item desse array é o respectivo retorno da sua função de callback passada como argumento para map():

(index.nota >= 7) && `${index.name}`

O javascript avalia sua expressão da esquerda para a direita, logo ele sempre avalia (index.nota >= 7) e se essa condição for true ele segue avaliando a segunda expressão, que no seu caso você está simplesmente retornando uma string. Ou seja, o retorno da sua função é um array composto por boolean (porque se a primeira expressão retornar false, ele vai adicionar false como um item do array de retorno, e ele não avalia a segunda expressão) ou string (porque se a primeira expressão retornar true ele segue lendo o código e retorna a string index.name, adicionando uma string ao array de retorno). Ou seja seu retorno virou um mix entre boolean e string, por isso o TypeScript avaliou automaticamente o retorno da sua função como um array de boolean ou string.

Outra coisa que observei no seu código, é que para o que você descreveu, o correto não é utilizar o método map() e sim o método filter().

Na sua função você deseja filtrar somente os alunos que possuem nota inferior ou igual à 7, logo utilizar o método map() não vai funcionar, pois ele retorna todos os itens do array, você deve utilizar o método filter(), para filtrar somente os ítens do array que você deseja, no seu caso, os itens que possuam a pripriedade nota maior ou igual à 7.

const alunosAprovados = alunos.filter((index) => (index.nota >= 7));

Veja no Playground funcionando.

Abaixo eu deixo os links da documentação para melhor entendimento do que foi dito:

.map() -> https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Array/map

.filter() -> https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

interface -> https://www.typescriptlang.org/docs/handbook/interfaces.html

1
  • realmente com o filter atende muito bem ao problema, muito obrigado pelos ensinamentos e pela resposta. Commented 11/04/2022 às 13:55

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .