Causas e soluções para erros de compilação ao usar funções de seta + ts para definir funções genéricas

Primeiro, quando usamos function+ts para definir uma função, como segue:

// 根据某个字段给数组排序
function sortArray<T> (arr: T[], field: keyof T): T[] {
  return arr.sort((a, b) => {
    if (a[field] > b[field]) {
      return -1
    }
    if (a[field] < b[field]) {
      return 1
    }
    return 0
  })
}

Esta forma de escrever compila normalmente.

Ao alterá-lo para uma função de seta, o código fica assim:

const sortArray = <T>(arr: T[], field: keyof T): T[] => {
  return arr.sort((a, b) => {
    if (a[field] > b[field]) {
      return -1
    }
    if (a[field] < b[field]) {
      return 1
    }
    return 0
  })
}

Ao utilizar este método de escrita, o seguinte erro será relatado durante o processo de compilação:

        “ erro Erro de análise: token inesperado. Você quis dizer `{'>'}` ou `>`?

Razões para o erro acima:

        Em alguns casos, o uso de colchetes angulares (<>) para indicar genéricos será analisado como tags JSX.

Existem várias soluções como segue (a primeira é recomendada):

        O primeiro: Adicione um "(,)" após o genérico em <>, para que não seja analisado em uma tag jsx durante a análise. O código é o seguinte:

const sortArray = <T, >(arr: T[], field: keyof T): T[] => {
    return T[]
}

        Segundo tipo: reescrever usando a palavra-chave extends, o código é o seguinte:

const sortTable = <T extends {}>(arr: T[], field: keyof T): T[] => {
    return T[]
}

        O terceiro método: reescrever o método de definição de tipo, o código é o seguinte:

const sortTable:<T>(arr: T[], field: keyof T) => T[] = (arr, field) => {
    return T[]
}

Conclusão: Ao definir tipos para ts, muitas vezes encontro alguns problemas que não conheço. Consultando as informações e combinando minha própria experiência de desenvolvimento, finalmente os resolvi perfeitamente.

O conteúdo acima é original do autor. Se houver algum erro, aponte-o na área de comentários. Muito obrigado! Anexe um link ao reimprimir.

Qualquer semelhança de conteúdo é mera coincidência.

Acho que você gosta

Origin blog.csdn.net/listener_life/article/details/130758858
Recomendado
Clasificación