Escrever código JavaScript pode ser desafiador e, às vezes, francamente intimidante, como muitos desenvolvedores sabem. Erros inevitavelmente surgem durante o processo, alguns dos quais são recorrentes. Este artigo, voltado para desenvolvedores iniciantes, discute esses erros e como resolvê-los. Para maior clareza, os nomes de funções, propriedades e objetos são retirados de... Tudo isso ajuda você a se lembrar rapidamente de como corrigir erros comuns.
Lembramos: para todos os leitores de "Habr" - um desconto de 10 rublos ao se inscrever em qualquer curso Skillbox usando o código promocional "Habr".
A Skillbox recomenda: curso prático .
TypeError: a propriedade não está 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 exemplo de código acima produz o erro "Uncaught TypeError: Cannot read property 'lucky' of undefined". O problema é que o objeto "girl" não possui uma propriedade "named", embora possua uma propriedade "name". E como a propriedade "girl.named" está indefinida, ela não pode ser acessada, pois tecnicamente não existe. No entanto, se você substituir "girl.named.lucky" por "girl.name", tudo funciona e o programa retorna "Lucky".
Mais detalhes sobre os imóveis podem ser encontrados. .
Como solucionar problemas de TypeError
Erros de tipo ocorrem quando um programador tenta executar uma ação em dados que não estão em conformidade com um tipo definido. Exemplos incluem o uso de `.bold()`, a consulta de uma propriedade indefinida ou a chamada de uma função que não é de fato uma função.
Portanto, se você tentar chamar `girl()`, receberá o erro `Uncaught TypeError: yourVariable.bold is not a function` e `girl` não é uma função, já que, na verdade, está sendo chamado um objeto, e não uma função.
Para solucionar erros, você precisa examinar as variáveis. Então, o que é "girl"? E o que é "girl.named"? Você pode descobrir analisando o código, exibindo as variáveis usando `console.log`, o comando do depurador ou chamando o nome da variável no console. Você precisa garantir que consegue manipular o tipo de dados que a variável contém. Se não conseguir, altere-o — por exemplo, adicionando uma condição ou um bloco `try..catch` — e obtenha controle sobre a execução da operação.
Stack Overflow
Se acreditarmos na letra da música "Baby One More Time" (da Britney Spears, claro), a palavra "hit" nesse contexto se refere ao desejo da cantora de ser chamada novamente (aqui está uma explicação do contexto da música – nota do tradutor). É bem possível que esse desejo leve a um aumento nas ligações na vida real. Mas em programação, isso é recursão, o que pode causar um erro em caso de estouro da pilha de chamadas.
Os erros são semelhantes a este:
Erro: Espaço de pilha insuficiente (Edge)
InternalError: recursão excessiva (Firefox)
Erro de intervalo: Tamanho máximo da pilha de chamadas excedido (Chrome)
Um estouro de pilha ocorre quando o desenvolvedor não leva em consideração o caso base na recursão, ou quando o código não aborda o caso pretendido.
function oneMoreTime(stillBelieve=true, loneliness=0) {
if (!stillBelieve && loneliness < 0) return
loneliness++
return oneMoreTime(stillBelieve, loneliness)
}Nesse caso, stillBelieve nunca poderá ser avaliado como falso, então oneMoreTime será chamado todas as vezes, mas a função nunca concluirá sua execução.
Se você começar a contar com dois amigos, isso reduzirá a solidão e você não precisará esperar por uma ligação.
function oneMoreTime(stillBelieve=true, loneliness=0) {
if (!stillBelieve && loneliness < 0) return
loneliness--
stillBelieve = false
return oneMoreTime(stillBelieve, loneliness)
}Um exemplo disso são os loops infinitos, em que o sistema não exibe uma mensagem de erro, mas a página que executa o código JavaScript simplesmente trava. Isso acontece quando o loop while não possui uma condição de término.
let worldEnded = false
while (worldEnded !== true) {
console.log("Keep on dancin' till the world ends")
}O problema pode ser resolvido da seguinte forma:
let worldEnded = false
while (worldEnded !== true) {
console.log("Keep on dancin' till the world ends")
worldEnded = true
}Depurando loops infinitos e recursões
Se você se deparar com um problema de loop infinito, feche a aba no Chrome ou Edge, ou a janela do navegador no Firefox. Depois disso, analise o código cuidadosamente. Se não conseguir encontrar o problema, adicione um comando de depuração ao loop ou à função e verifique os valores das variáveis. Se o resultado não for o esperado, substitua-o — é fácil.
No exemplo acima, o depurador deve ser adicionado como a primeira linha da função ou do loop. Em seguida, abra uma guia de depuração no Chrome e analise as variáveis no escopo. Usando o botão "Avançar", você pode acompanhar as alterações a cada iteração. Tudo isso é fácil de fazer e, na maioria dos casos, o problema é facilmente identificado.
Você pode ler mais sobre tudo isso aqui () e aqui ().
Erro de sintaxe
Um dos erros mais comuns em JavaScript é o SyntaxError. Extensões de editores de texto podem ajudar a evitá-los. Por exemplo, o Bracket Pair Colorizer destaca os colchetes no seu código com cores diferentes, enquanto o Prettier ou uma ferramenta de análise similar permite encontrar erros rapidamente. A melhor maneira de reduzir a probabilidade de SyntaxErrors é minimizar o aninhamento.
Compartilhe nos comentários: o que você faz para evitar erros ou para detectá-los e eliminá-los rapidamente?
A Skillbox recomenda:
- Curso prático de dois anos .
- Curso online .
- curso de ano prático .
Fonte: habr.com
