Pesquisa de site

javascript - Como lidar com dezenas de avisos de variáveis não resolvidas no WebStorm?

Eu tenho uma função que recebe dados do servidor:

function getData(data){
    console.log(data.someVar);
}

O WebStorm diz que someVar é uma variável não resolvida. Como posso me livrar desses avisos?

Vejo várias opções:

  • Suprimir avisos nas configurações da IDE;
  • Adicione um arquivo de origem JSON com campos (detalhes);
  • Use a sintaxe semelhante a array: data['some_unres_var'];

Além disso, o WebStorm está me oferecendo criar um namespace para o "data" (adicionar uma anotação como /** @namespace data.some_unres_var*/), criar esse campo ou renomeá-lo.

Resposta #1

Use JSDoc:

/**
 * @param {{some_unres_var:string}} data
 */
function getData(data){
    console.log(data.some_unres_var);
}

Resposta #2

Documente o objeto com JSDoc. Depois, seus membros.

/**
 * @param data          Information about the object.
 * @param data.member   Information about the object's members.
 */
function getData(data){
    console.log(data.member);
}
  • @property para variáveis locais (não parâmetros).
  • Testado no PyCharm. @Nicholi confirma que funciona no WebStorm.
  • A sintaxe {{ member:type }} que Andreas sugeriu pode entrar em conflito com os templates do Django.
  • Obrigado à resposta de Jonny Buchanan citando a wiki @param.

Para documentar arrays de objetos, use colchetes [] como sugere o JSDoc:

/**
 * @param data
 * @param data.array_member[].foo
 */

Resposta #3

Todas as outras respostas estão incorretas para o caso geral. E se você não receber data como um parâmetro? Então você não tem JSDoc:

function niceApiCall(parameters) {
  const result = await ...  // HTTP call to the API here
  for (const e of result.entries) {
    .. // decorate each entry in the result
  }
  return result;
}

O WebStorm alertará que "result.entries" é uma variável (campo) não resolvida.

A solução geral é adicionar uma declaração @namespace:

function niceApiCall(parameters) {
  /** @namespace result.entries **/
  const result = await ...  // HTTP call to the API here
  for (const e of result.entries) {
    .. // decorate each entry in the result
  }
  return result;
}

Resposta #4

Uso de destruição, Luke.

function getData(data){
    const {member} = data;
    console.log(member);
}

Artigos relacionados