Javascript

Javascript é uma linguagem de programação front-end (ou client-side) que manipula os elementos de uma página de forma dinâmica. Ele não tem nada a ver com a linguagem Java. Enquanto o Javascript é uma linguagem client-side, ou seja, que é entendida pelos navegadores, o Java é uma linguagem server-side, que é entendida pelos servidores.

O Javascript surgiu em 1995 e foi criada por Brendan Eich, que na época trabalhava na Netscape e tinha nomeado essa linguagem como Mocha, e depois mudou para LiveScript. A linguagem havia sido inserida no navegador da Netscape. O nome mudou para Javascript quando a Netscape adicionou suporte à tecnologia Java em seu navegador, conhecido como Applets. Logo, a linguagem foi rapidamente aceita por todos. A Microsoft logo criou a linguagem JScript para não ter problemas com a marca e a lançou no Internet Explorer 3.

Em 1996, a Netscape passou a bola para a ECMA, que logo trabalhou em sua padronização, ficando conhecida como ECMAScript. No lado Microsoft, pode-se dizer que nem tudo no JScript segue as especificações definidas pela ECMA. Independente disso, o Javascript foi ganhando cada vez mais fama e se tornou a linguagem de programação front-end mais famosa do mundo, se tornando a base de boa parte dos sites hoje existentes na web, junto com o HTML e o CSS.

O Javascript encontra-se na versão 1.8.5, lançado no final de 2010. Ele é considerado uma linguagem orientada a objetos, ou seja, trabalha com classes e objetos que se compõe e interagem entre si, determinando seus comportamentos. Em uma página, o Javascript pode ser incluído através da tag HTML <script>, tendo o código já incluído dentro dele ou usando o atributo “src” para apontar para um arquivo .js. Mas você também pode usar a tag <noscript> para indicar ao usuário caso o navegador não tenha suporte ao Javascript, desta forma:

<noscript>Seu navegador não tem suporte ao Javascript. Que tal atualizá-lo ou trocar por um mais moderno?</noscript>

Abaixo segue um exemplo de código Javascript:

window.onload = function(){
  document.getElementById("botao").addEventListener("click", function () {
    var classes = this.classList;
    if(classes.contains("ola")){
      alert("Sejam bem-vindo!");
    } else {
      alert("Click!");
    }
  });
};
  • window.onload = function(){ .. }; indica que a função (bloco de código responsável em executar uma tarefa) indicada nele deve funcionar assim que tudo na página for carregado: estrutura HTML e arquivos apontados por ele (arquivos de script, imagens, arquivo css, etc);
  • document.getElementById("botao").addEventListener("click", function(){ .. }); aponta para um elemento HTML presente no documento que tenha o atributo “id” igual a “botao”, adicionando um “ouvinte de evento”, ou seja, um evento que ocorre durante uma determinada ação, que no caso é a ação de clicar sobre ele (“click”). Esse ouvinte irá executar a função indicada nele toda vez que detectar o clique;
  • var classes = this.classList; é um exemplo de variável, ou uma tipagem dinâmica. Melhor dizendo, pode ser um espaço no código que armazena vários tipos de dados que podem ser alterados a qualquer momento. No caso, a variável foi nomeada “classes” e ela puxa todos os valores incluídos no atributo “class” do elemento atual (o que tem o “id” igual a “botao”), indicado pelo “this”;
  • if(classes.contains("ola")){ ... } abre uma condicional, aonde ele analisa os dados presentes na variável “classes” e analisa se dentro dele contém alguma classe chamada “ola”;
  • Se tiver, ele realiza o alert("Sejam bem-vindo!");, indicando que o navegador deve abrir uma janela de alerta com a frase “Sejam bem-vindo!”;
  • } else { significa “se não”. Se a linha da condicional não for verdadeira, ou seja, não tiver a classe “ola” dentro da variável “classes”, ele executará a linha seguinte;
  • alert("Click!"); é o alerta que o navegador deve exibir se a condicional não achar a classe especifica, ou, se a condicional retornar um valor falso.

Saiba mais

Manda sua palavra ae! Deixe um comentário: