JavaScript

Origem: Wikipédia, a enciclopédia livre.

JavaScript é uma linguagem de programação criada pela Netscape em 1995, que a princípio se chamava LiveScript, para atender, principalmente, as seguintes necessidades:

• Validação de formulários no lado cliente (programa navegador);
• Interação com a página. Assim, foi feita como uma linguagem de script. Javascript tem sintaxe semelhante à do Java, mas é totalmente diferente no conceito e no uso.

1. Oferece tipagem dinâmica - tipos de variáveis não são definidos;
2. É interpretada, ao invés de compilada;
3. Possui ótimas ferramentas padrão para listagens (como as linguagens de script, de modo geral);
4. Oferece bom suporte a expressões regulares (característica também comum a linguagens de script).

Sua união com o CSS é conhecida como DHTML. Usando o Javascript, é possível modificar dinamicamente os estilos dos elementos da página em HTML.

Dada sua enorme versatilidade e utilidade ao lidar com ambientes em árvore (como um documento HTML), foi criado a partir desta linguagem um padrão ECMA, o ECMA-262, também conhecido como ECMAScript. Este padrão é seguido, por exemplo, pela linguagem ActionScript da Adobe(Antigamente Macromedia, porém a empresa foi vendida à Adobe).

Além de uso em navegadores processando páginas HTML dinâmicas, o JavaScript é hoje usado também na construção do navegador Mozilla, o qual oferece para a criação de sistemas GUI todo um conjunto de ferramentas (em sua versão normal como navegador, sem a necessidade de nenhum software adicional), que incluem (e não apenas) um interpretador de Javascript, um comunicador Javascript <-> C++ e um interpretador de XUL, linguagem criada para definir a interface gráfica de aplicações.

O uso de JavaScript em páginas XHTML, pelo padrão W3C, deve ser informado ao navegador da seguinte forma:

<script type="text/javascript">

/* aqui fica o script */

</script>

Caso contrário, o navegador irá interpretar o script como sendo código HTML, escrevendo-o na página.

[editar] Exemplos de scripts

[editar] Scripts simples

alert("cuidado");
// mostra um 'alert' de Yes ou No
if(confirm("Escolha Yes Ou No para ver a mensagem correspondente?"))
{
        alert("Mensagem 01"); // mostra um alerta para resposta OK
}
else
{
        alert("Mensagem 02"); // mostra um alerta para resposta Cancelar
}
// escreve na barra de status do navegador
window.defaultStatus="Mensagem que será mostrada";

[editar] Funções

Criando uma função simples:

function nome_da_funcao() { //nome_da_funcao deve ser substituído pelo nome da função que será colocada
window.alert('Função terminada'); // alerta que será exibido quando a função for executada
}
Outra função simples:
function nome_da_funcao(atributos) //nome_da_funcao deve ser substituído pelo nome da função que será colocada
{
confirm("Função terminada"); // pedido de confirmação com os botões OK e Cancelar
}

// constructor function
function MyObject(attributeA, attributeB) {
  this.attributeA = attributeA
  this.attributeB = attributeB
}
// cria um Objeto chamado obj
obj = new MyObject('red', 1000);
// acessa um atributo do obj
alert(obj.attributeA);
// accessa um atributo com notação de array associativo 
alert(obj["attributeA"]);
// adiciona um novo atributo
obj.attributeC = new Date();
// remove um atributo do obj
delete obj.attributeB;
// remove o Objeto inteiro
delete obj;
function Derive()
{
   this.Override = function() {
     alert("Derive::Override()");
   }
}
Derive.prototype = new Base();
d = new Derive();
d.Override();
d.BaseFunction();
d.__proto__.Override(); // somente mozilla
//resultará na exposição:
Derive::Override()
Base::BaseFunction()
Base::Override()  // somente mozilla

[editar] Hierarquia do objeto

function red() {
  this.sayRed = function () {
    alert ('red wine')
  }
}
function blue() {
  this.sayBlue = function () {
    alert('blue sky')
  }
  this.someName = black // inherits black.someName()
  // inherits black
}
function black () {
  this.sayBlack = function () {
    alert('black night')
  }
}
function anyColour() {
  this.anotherName = red // inherits red
  this.anotherName()     // inherits red
  this.sayPink = function() {
    alert('"Any Colour You Like" is a song of Pink Floyd')
  }
  this.anotherName = blue // inherits blue ( + black )
  this.anotherName()      // inherits blue ( + black )
  this.anotherName = 'released 1973' // now it's a string - just for fun
}
function alert(){
  alert('gabriel');
}
var hugo = new anyColour()
hugo.sayRed()
hugo.sayBlue()
hugo.sayBlack()
hugo.sayPink()
alert(hugo.anotherName)

[editar] Exemplos práticos

[editar] Pop-up não bloqueável

<html>
<title></title>
<style type="text/css">
#popup{
position: absolute;
top: 30%;
left: 30%;
width: 300px;
height: 150px;
padding: 20px 20px 20px 20px;
border-width: 2px;
border-style: solid;
background: #ffffa0;
display: none;
}
</style>
<body onload="javascript: abrir()">
<script language="javascript" type="">
function fechar(){
    document.getElementById('popup').style.display = 'none';
}
function abrir(){
    document.getElementById('popup').style.display = 'block';
    setTimeout ("fechar()", 3000);
}
</script>
<DIV id="popup" class="popup"> 
<p>
Esse é um exemplo de popup utilizando DIV. Dessa maneira esse
pop-up não será bloqueado.
</p>
<p>
<small><a href="javascript: fechar();">[X]</a></small>
</DIV>
<br> <a href="javascript: abrir();">Abrir POPUP</a>
<br> <a href="javascript: fechar();">Fechar POPUP</a>
</body>
</html>

[editar] Referências

[editar] Ligações externas

O Wikilivros possui livros e publicações sobre: Javascript

• ((pt)) Grupo de Usuários Javascript - Em Português
• ((pt)) Tutorial de JavaScript - Também em Português.
• ((pt)) Compactador de JavaScript e CSSArquivos de Javascript podem ficar muito grandes e pesados para carregar.Esta ferramenta elimina comentários e alguns caracteres desnecessários como tabulações e quebra de linha.
• ((en)) JScript - Versão da Microsoft do JavaScript, usado no Internet Explorer.
• ((en)) JavaScript - Página de JavaScript da fundação Mozilla.
• ((en)) Guia Javascript da fundação Mozilla um bom guia de javascript.
• ((en)) Standard ECMA-262 - Especificação oficial do JavaScript.
• ((en))

Programação baseada em classe vs. Programação baseada em protótipo essencial para quem está acostumado com o paradigma da programação orientada a objeto.