Às vezes, escrever código JavaScript é difícil e às vezes é assustador, o que é familiar para muitos desenvolvedores. No processo, inevitavelmente surgem erros, e alguns deles são frequentemente repetidos. O artigo, desenvolvido para desenvolvedores iniciantes, fala sobre esses erros e como resolvê-los. Para maior clareza, os nomes das funções, propriedades e objetos são retirados de uma
música popular . Tudo isso ajuda a lembrar rapidamente de como corrigir erros comuns.
Lembramos que: para todos os leitores de "Habr" - um desconto de 10.000 rublos ao se inscrever em qualquer curso Skillbox usando o código promocional "Habr".
A Skillbox recomenda: Curso prático "Mobile Developer PRO" .
TypeError: propriedade não definida
let girl = { name: "Lucky", location: "Hollywood", profession: "star", thingsMissingInHerLife: true, lovely: true, cry: function() { return "cry, cry, cries in her lonely heart" } } console.log(girl.named.lucky)
O código de exemplo acima gera um TypeError não capturado: Não é possível ler a propriedade 'lucky' de erro indefinido. O problema é que o objeto de menina não possui uma propriedade nomeada, embora exista uma propriedade de nome. E como a propriedade girl.named não está definida, é impossível acessá-la, porque formalmente não existe. Mas se você substituir girl.named.lucky por girl.name, tudo funcionará e o programa retornará Lucky.
Leia mais sobre as propriedades
aqui .
Métodos para corrigir erros de TypeError
Erros TypeError ocorrem quando um programador tenta executar ações em dados que não correspondem a um tipo específico. Como exemplo, use .bold (), solicite uma propriedade indefinida ou chame uma função que não é realmente uma função.
Portanto, se você tentar chamar girl (), um erro de TypeError não capturado será exibido: yourVariable.bold não é uma função e girl não é uma função, porque, na verdade, o objeto é chamado, não a função.
Para eliminar erros, você precisa estudar as variáveis. Então, o que é garota? E o que é girl.named? Você pode descobrir se analisa o código, exibe as variáveis usando console.log com o comando debugger ou chamando o nome da variável no console. Você precisa garantir que seja possível operar com o tipo de dados que está contido na variável. Se não se encaixar, altere-o, por exemplo, adicione uma condição ou tente ... bloquear bloco e obtenha controle sobre a operação.
Estouro de pilha
Se você acredita que os autores das palavras da música Baby One More Time (Britney Spears, hein), a palavra hit nesse contexto significa o desejo do cantor de ser chamado novamente (aqui está uma explicação do contexto da música, aproximadamente tradutor). Pode ser que esse desejo leve a um aumento no número de chamadas na vida real. Mas na programação, essa é uma recursão que pode causar um erro se a pilha de chamadas estourar.
Os erros são os seguintes:
Erro: espaço fora da pilha (borda)
InternalError: muita recursão (Firefox)
RangeError: tamanho máximo da pilha de chamadas excedido (Chrome)
O estouro de pilha ocorre se o desenvolvedor não levar em consideração o caso base em recursão ou se o código não abordar o caso fornecido.
function oneMoreTime(stillBelieve=true, loneliness=0) { if (!stillBelieve && loneliness < 0) return loneliness++ return oneMoreTime(stillBelieve, loneliness) }
Nesse caso, stillBelieve nunca pode ser definido como false; portanto, oneMoreTime será chamado toda vez, mas a função nunca terminará.
Se você começar a esperar dois amigos, isso reduzirá a solidão (solidão) e você não poderá esperar pela ligação.
function oneMoreTime(stillBelieve=true, loneliness=0) { if (!stillBelieve && loneliness < 0) return loneliness-- stillBelieve = false return oneMoreTime(stillBelieve, loneliness) }
Como exemplo, existem casos com loops infinitos, quando o sistema não envia uma mensagem de erro e a página na qual o código JavaScript é executado simplesmente congela. Isso acontece se o loop while não tiver uma condição de finalização.
let worldEnded = false while (worldEnded !== true) { console.log("Keep on dancin' till the world ends") }
Você pode resolver o problema da seguinte maneira:
let worldEnded = false while (worldEnded !== true) { console.log("Keep on dancin' till the world ends") worldEnded = true }
Depurar loops e recursões sem fim
Se você tiver um problema com um loop infinito, no Chrome ou Edge, feche a guia e, no Firefox, feche a janela do navegador. Depois disso, você precisa analisar cuidadosamente o código. Se você não conseguir encontrar o problema, adicione o comando debugger ao loop ou função e verifique o valor das variáveis. Se o resultado não for o esperado, substitua-o, isso pode ser feito facilmente.
No exemplo acima, o depurador deve ser adicionado como a primeira linha de uma função ou loop. Em seguida, você precisa abrir a guia de depuração no Chrome analisando as variáveis no escopo. Usando o botão seguinte, você pode acompanhar as alterações em cada iteração. Fazer tudo isso é simples e, na maioria dos casos, o problema é.
Você pode ler mais sobre tudo isso aqui (
para Chrome ) e aqui (
para Firefox ).
Erro de sintaxe
Um dos erros de JavaScript mais comuns é o SyntaxError. Evite que eles ajudem o editor de texto de extensão. Portanto, o Bracket Pair Colorizer marca os colchetes no código em cores diferentes, e o Prettier ou uma ferramenta de análise semelhante possibilita encontrar rapidamente erros. A melhor opção para reduzir a probabilidade de SyntaxError é o aninhamento mínimo.
Compartilhe nos comentários: o que você faz para evitar erros ou detectar e eliminá-los rapidamente?
A Skillbox recomenda: