JavaScript void(0): como corrigir o erro do seu código?

Em algum momento você provavelmente clicou em algum link ou abriu uma página de um website e se deparou com a mensagem de erro “JavaScript void(0)”. Ou até mesmo em alguma fase do desenvolvimento do seu próprio site você pode ter esbarrado nessa mensagem e não entendeu o que pode ter ocorrido.

Na maioria das vezes, essa mensagem é exibida quando algum script (JavaScript) não pôde ser executado ou não foi carregado como deveria, e isso pode ocorrer por diversos motivos.

Escrevemos esse post justamente para explicar o que é essa mensagem e porque ela acontece. A partir disso, você será capaz de resolver tal problema e ainda aprenderá mais sobre o que é e como utilizar o operador JavaScript responsável por isso em seus códigos, o void.

Nesse post você verá: 

O que significa void?

Void, em inglês, significa “vazio” ou “vazia”. E é justamente esse seu significado no mundo da programação.

Em várias linguagens de programação o termo “void” é uma “palavra reservada”, ou seja, é uma palavra que, ao utilizá-la em seu código, terá um comportamento ou significado especial naquele contexto da linguagem, da mesma forma como as palavras “if”, “else”, “for”, etc..

Como exemplos de linguagens que tem o termo void como palavra reservada, podemos citar o C, C++, Java, PHP e o Javascript, que será justamente o plano de fundo do que falaremos aqui. 

Em JavaScript (JS), void é um operador que, segundo sua definição, avalia uma expressão dada e então retorna undefined.

Vamos explicar de maneira mais simples:

Basicamente, esse operador chamará uma expressão e definirá o valor de retorno como vazio. Por exemplo, ao passar uma função para esse operador, ela será imediatamente executada e, por mais que ela tenha um retorno, sua resposta será dada como vazio, que no JavaScript é representado pela constante “undefined”.

Quando usar o operador void?

Você deve estar se perguntando em quais situações seria interessante utilizar esse operador.

Como já dissemos no tópico anterior, em JavaScript, o void é muitas vezes utilizado para obter o valor primitivo “undefined”.

Para ficar mais evidente, vamos a um exemplo:

Imagine que você que adicionar um link em sua página, e esse link deverá executar um comando JavaScript qualquer quando clicado. Vamos imaginar também que esse comando modificará a cor do fundo (background) da página HTML para verde.

Utilizando o operador void poderíamos fazer essa tarefa da seguinte forma:

Exemplo de código usando o void no Javascript

Vamos entender cada parte do que está sendo realizado nesse código:

Primeiro temos a declaração de um hyperlink utilizando a tag HTML “<a>”. Ao clicar nesse link, o código definido na propriedade “href” será chamado. No nosso exemplo, o código corresponde a um script bem simples que modificará a propriedade “backgroundColor” do body da página para “green”, alterando então a cor de fundo para a cor verde.

Porém, o ponto mais importante do funcionamento desse trecho é o uso do operador void. Observando esse código, podemos notar a ocorrência de dois comportamentos fundamentais para alcançarmos o nosso objetivo (alterar a cor de fundo da página):

  1. o comando que passamos dentro da função “void” é chamado imediatamente, ou seja, ao clicar no link, o código é invocado e então é atribuído o valor para a propriedade.
  2. o retorno da expressão ser dada como “undefined”, que é fundamental para o comportamento correto dessa tag HTML.

E por que é importante retornar undefined nessa expressão?

Para respondermos a essa pergunta, vamos relembrar o funcionamento da tag HTML <a>. Ao clicar nesse hiperlink ela vai “seguir” o conteúdo em “href” e, quando o navegador segue uma URI JavaScript, ele avalia o código da URI substituindo o conteúdo da página pelo valor retornado, a não ser que o valor seja “undefined”.

No nosso caso, se tiramos o “void” do código, o navegador realizará essa substituição, trocando o conteúdo da página pelo retorno da expressão, e o que teremos na página será algo como um conteúdo em branco com o texto “green”:

Resultado da execução de um código sem a presença de void.

Outro uso bastante comum do operador é para chamar imediatamente a expressão de uma função.

Por exemplo, na função abaixo, precisamos declará-la primeiro para em seguida invocá-la (sem segredos):

Exemplo de uma função em JavaScript

Porém, utilizando “void”, podemos fazer um pequeno “hack”, tornando possível executá-la imediatamente à sua declaração.

Void sendo utulizado para garantir um funcionamento mais direto de uma função

Isso é possível porque, ao utilizarmos o operador “void”, forçamos a palavra-chave “function” a retornar “undefined”. Dessa forma, a função pode ser tratada como uma expressão em vez de como uma declaração e, então, pode ser invocada imediatamente.

Legal né?

O que é javascript: void(0);?

Agora que já entendemos como o operador é utilizado, ficará mais fácil compreendermos a expressão: “javascript: void(0);”.

Seguindo a mesma ideia dos conceitos já vistos, ao utilizar o void, a expressão será avaliada como “undefined”, ou seja, o resultado dela será “undefined”.

Dessa forma, o objetivo dessa expressão é justamente esse: obter o valor primitivo undefined.

Você deve estar se perguntando: “Mas qualquer valor que eu passar para o void retornará undefined, por que o 0?”

E você tem razão! Poderíamos chamar o operador com qualquer valor: “void(1)”, “void(100)”, “void(‘a’)”, “void(“”)” etc., e em todos esses exemplos chegaríamos no mesmo resultado: undefined.

O ponto é apenas que o “0” foi a forma mais comum de ser utilizada e passou a ser difundido como uma espécie de padrão.

Um detalhe importante que precisamos ter em mente é que se quisermos puramente capturar o valor “undefined”, podemos fazer isso utilizando diretamente a constante “undefined”. Dessa forma, tente entender se realmente esse operador fará sentido no seu contexto ou se existem soluções mais elegantes antes de utilizá-lo.

Exemplo de uso do JavaScript: void(0)

Um exemplo muito comum do uso do de “javascript: void(0)” é para remover o comportamento de um hyperlink, mantendo sua aparência de link na página (cor, sublinhado, etc.), porém, fazendo que, ao clicar nele, nenhuma ação na página seja executada (não recarregar, não navegar, não rodar nenhum código fonte, etc.). Veja um exemplo:

Tirando um hiperlink

O que é o erro JavaScript: void(0);?

Conforme aprendemos, essa expressão não se trata especificamente de um erro. O que pode acontecer é algum problema no carregamento dos scripts da página provocar alguma inconsistência que será exibida no navegador dessa forma.

Por exemplo, um script ou parte dele não é carregado conforme esperado e ao executá-lo é retornado “vazio”, ou no caso, “void”, e não é possível finalizar a execução do comando. Essa inconsistência é então exibida em uma mensagem à pessoa usuária pelo navegador.

Como corrigir o erro javascript: void(0); no navegador?

Como as principais causas desse erro normalmente são problemas no carregamento dos scripts da página, para resolvermos iremos exatamente nesse caminho, validar e garantir que todo o carregamento da página foi feito com sucesso sem nenhum impedimento.

Vamos ver alguns exemplos que podem impactar esses carregamentos e quais seriam as possíveis soluções para resolver o problema em cada situação:

Desative os bloqueadores de anúncios e scripts

Uma das causas mais comuns é o uso de bloqueadores de anúncios ou outros scripts instalados no navegador que interceptam e bloqueiam o carregamento de conteúdos e scripts na tela. Esses bloqueadores normalmente são instalados em forma de extensões diretamente no navegador,como por exemplo o “Adblock”.

Dessa forma, se for identificado o uso de algum plug-in desse tipo instalado, podemos tentar desativá-lo e recarregar a página ou reiniciar o navegador para ver se o problema é resolvido. Às vezes, mesmo desativado o plug-in pode continuar impactando no funcionamento do navegador. Nesses casos, será necessário desinstalar a extensão por completo do browser.

Temos também navegadores que possuem esses recursos de forma nativa, como o navegador Brave, que já possui, de maneira integrada, configurações para bloqueio de anúncios e scripts com potenciais maliciosos. Tais bloqueios impedem o carregamento de alguns conteúdos no navegador, como scripts e chamadas a URLs externas.

Dessa forma, se você estiver utilizando um navegador que tem tais recursos, tente também desativar essas configurações e então recarregar a página.

Limpe os dados do navegador

Outra coisa que pode impactar o funcionamento correto da página é o navegador estar muito poluído, com diversas extensões instaladas e dados de armazenamento antigos e desatualizados, como cache, cookies, históricos e até senhas salvas no browser.

Dessa forma, o ideal é deixar o seu navegador o mais limpo possível, removendo extensões e serviços que não estejam sendo utilizados e limpando os dados de navegação.

Tudo isso pode ser realizado diretamente nas configurações do seu browser ou também utilizando ferramentas específicas de limpeza que normalmente acompanham serviços de antivírus.

Atualize seu navegador

É importante também validar se o seu navegador está utilizando sua versão mais recente, já que versões desatualizadas podem impactar o seu funcionamento.

Sendo assim, verifique se você tem instalada a última versão e, se for necessário, atualize-o. Além de evitar problemas com o carregamento de páginas, já que novas versões normalmente corrigem diversos erros e bugs, você também navegará de forma mais segura.

Agora que você já sabe um pouco mais sobre operador “void” e seus principais uso, assim como solucionar possíveis erros que podem ocorrer por problemas no carregamento de scripts, como o clássico “javascript: void(0);” você saberá lidar rapidamente com situações que envolva esses pontos.

Esses detalhes são bem específicos e o mais importante é tentar entender o que pode estar acontecendo e quais as possíveis causas para gerar aquilo. Dessa forma, você não terá problemas para resolver essas situações.

Se você gostou desse conteúdo não deixe de ver nosso post sobre o que é desenvolvimento web e saiba como iniciar essa carreira!