Este conteúdo faz parte do livro “Introdução à programação Web para a Bioinformática: HTML, CSS, PHP & JavaScript“. Você pode adquirir a versão impressa desse livro aqui ou a versão para Kindle aqui. Para nos citar, consulte este link.
JavaScript é uma linguagem de programação executada em client-side. Foi criada com o objetivo de permitir que scripts pudessem ser executados diretamente no computador do usuário sem a necessidade de enviar novas requisições ao servidor. JavaScript é uma linguagem de programação interpretada, baseada em scripts, com tipagem fraca e dinâmica e suporte a orientação a objetos.
JavaScript é considerada a principal linguagem de desenvolvimento client-side. Além disso, seu uso em ambiente server-side tem se intensificado nos últimos anos por meio de plataformas, como Node.js. Segundo uma pesquisa realizada pelo site StackOverflow, dos anos de 2014 a 2016, JavaScript foi considerada a linguagem de programação mais utilizada por desenvolvedores.
Preferência de desenvolvedores por linguagens de programação (baseado em 49.397 respostas). Fonte: StackOverflow (https://insights.stackoverflow.com/survey/2016).
História
JavaScript foi criado por Brendan Eich, em 1995, quando ele trabalhava na Netscape. Inicialmente a linguagem foi chamada de LiveScript. Mais tarde foi renomeada para JavaScript. Não a confunda com a linguagem Java. JavaScript é uma linguagem de scripts client-side, enquanto Java é uma linguagem de programação que requer uma máquina virtual.
Declarando um script com JavaScript
Um script JavaScript pode ser declarado numa página HTML através da tag <script>. Scripts podem ser inseridos diretamente no código HTML:
<script type="text/javascript">
/* script */
</script>
c10_s1.html | https://goo.gl/BlvSAv
Ou podem ser declarados em arquivos externos. Neste caso, o atributo src deve ser utilizado para indicar a localização do script:
<script type="text/javascript" src="meu_script.js"></script>
c10_s2.html | https://goo.gl/pWksqq
Olá mundo, JavaScript!
Agora vamos apresentar um simples uso do JavaScript. Dentro de uma página HTML devidamente estruturada, insira uma tag <script> com o comando alert(‘Olá mundo, JavaScript!’). Sua página deverá ter a seguinte estrutura:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<title>Hello world, JavaScript!</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
alert('Olá mundo, JavaScript!');
</script>
</body>
</html>
c10_s3.html | https://goo.gl/1XVcls
Agora execute-a em seu navegador.
O comando alert exibe uma caixa de diálogo com uma mensagem. Entretanto, essa caixa de diálogo inibe quaisquer outras ações que possam ser feitas na página até que o usuário clique em OK. Ao clicar, a caixa de diálogo desaparece.
Em JavaScript, declarações de linhas devem ser terminadas em ponto e vírgula. Entretanto, o código pode funcionar se for capaz de reconhecer algum outro caractere de fim de linha, como uma quebra de linha. Apesar dessas peculiaridades, convém encerrar declarações usando ponto e vírgula e manter boas práticas de programação.
Pegando data e hora com Javascript
Um outro exemplo simples é usar JavaScript para coletar informações sobre o sistema, como data e hora. No exemplo a seguir, utilizaremos um evento para interagir com um botão e gravar informações de dada e hora na página. Observe a seguir:
<!DOCTYPE html>
<html>
<head>
<title>Pegando data e hora com javascript</title>
</head>
<body>
<h2>Pegando a data e hora com JavaScript</h2>
<button type="button"
onclick="document.getElementById('aqui').innerHTML = Date()">
Clique aqui para ver que horas são :D</button>
<p id="aqui"></p>
</body>
</html>
c10_s4.html | https://goo.gl/sdYGF2
Não é feitiçaria! Você usou JavaScript para pegar a hora atual do sistema. Ao clicar novamente no botão, o valor será atualizado. Nos próximos capítulos aprenderemos mais sobre JavaScript e como funcionam os eventos apresentados.
Quer aprender mais? Conheça nossos cursos profissionalizantes à partir de R$19,99:
Capítulo 1
Introdução ao HTML
Capítulo 2
Fundamentos do HTML
Capítulo 3
Estrutura de páginas
Capítulo 4
Folhas de Estilo em Cascata (CSS)
Capítulo 5
Bootstrap
Capítulo 6
Iniciando a construção de um Website
Capítulo 7
Introdução ao PHP
Capítulo 8
Fundamentos do PHP
Capítulo 9
Transformando um Website em dinâmico
Capítulo 10
Introdução ao JavaScript
Capítulo 11
Fundamentos do JavaScript
Capítulo 12
jQuery
Capítulo 13
Bootstrap JavaScript
Capítulo 14
D3.js
Capítulo 15
3Dmol
Capítulo 16
Projeto Final