Visão geral das tecnologias JavaScript
Enquanto oHTML é usado para armazenar o conteúdo e a formatação de uma página web e oCSS define a formatação e a aparência, oJavaScript é usado para adicionar interatividade a uma página web e criar aplicações web ricas.
No entanto, o termo genérico "JavaScript" tal como é entendido no contexto do navegador contém vários elementos bem diferentes. Um deles é a linguagem principal (ECMAScript), outra é a coleção dasWeb APIs, incluindo o DOM (Document Object Model).
JavaScript, a linguagem principal (ECMAScript)
O núcleo da linguagem JavaScript é padronizado pelo comitê ECMA TC39 como uma linguagem chamadaECMAScript. A última versão da especificação éECMAScript 5.1.
Este núcleo da linguagem é também usado em ambientes fora do navegador, por exemplo emnode.js.
O que se enquadra no escopo ECMAScript?
Entre outras coisas, o ECMAScript define:
- A sintaxe da linguagem (regras de análise, palavras-chave, controle de fluxo, inicialização de objetos literais...)
- Mecanismos para manuseio de erros (
throw
,try...catch
, habilidade para criar tipos deError
definido pelo usuário) - Tipos (boolean,number,string,function,object...)
- O objeto global. Num navegador esse objeto global é o objetowindow, mas o ECMAScript apenas define as APIs, não especificamente para navegadores, por exemplo:parseInt,parseFloat,decodeURI,encodeURI...
- Um mecanismo de herança baseado em protótipo
- Objetos e funções embutidas (
JSON
,Math
,Array,Object introspection...) - Modo estrito (rigoroso)
Suporte do navegador
Desde Agosto de 2014, as atuais versões dos principais navegadores implementaram oECMAScript 5.1 e oECMAScript 2015, mas versões mais antigas continuam usando a implementação do ECMAScript 3 e apenas partes do ECMAScript 5. Navegadores mais modernos já implementaram grande parte doECMAScript 6.
Futuro
A 6ª edição principal do ECMAScript foi oficialmente aprovada e publicada como norma em 17 de junho de 2015 pela Assembléia Geral da ECMA. Desde então, as Edições ECMAScript são publicadas anualmente.
API de Internacionalização
AAPI de Especificação de Internacionalização do ECMASCRIPT é uma adição para a Especificação de Linguagem ECMAScript, também padronizada pela Ecma TC39. A API de internacionalização fornece intercalação (comparação de string), formatação numérica, formatação de data e tempo para aplicações JavaScript, permitindo que aplicativos escolham o idioma e adaptem a funcionalidade às suas necessidades. O padrão foi aprovado em dezembro de 2012; O status das implementações nos navegadores é rastreado na documentação do objeto Intl. A especificação de Internacionalização hoje em dia também é ratificada anualmente e os navegadores aprimoram as suas implementações constantemente.
As APIs Web e o DOM
WebIDL
AEspecificação da WebIDL provê a junção entre as tecnologias DOM e o ECMAScript.
O núcleo do DOM
O Document Object Model (DOM) é umaconvenção multiplataforma elndependente de linguagem para representação e interação com objetos em documentos HTML, XHTML, e XML. Objetos noDOM tree (árvore do DOM) podem ser adereçados e manipulados utilizando métodos em objetos. AW3C padroniza o Core Document Object Model (Núcleo do Documento do Modelo de Objeto), o qual define interfaces de agnóstico de linguagem que abstraem documentos HTML e XML como objetos, e também define mecanismos para manipular essa abstração. Entre as definições do DOM, podemos encontrar:
- A estrutura do documento, um tree model (modelo de árvore), e a arquitetura do DOM Event (Evento do DOM) noDOM core (núceo do DOM):
Node
,Element
,DocumentFragment
,Document
,DOMImplementation
,Event
,EventTarget
, … - Uma definição menos rigorosa do DOM Event Architecture, assim como eventos específicos noDOM events.
- Outras coisas como oDOM Traversal e oDOM Range.
Pela perspectiva do EXMScript, objetos definidos na especificação do DOM são chamados de "host objects".
HTML DOM
HTML, a linguagem de marcação da Web, é especificada nos termos do DOM. Situado além dos conceitos de abstração definidos no DOM Core, o HTML também define osignificado dos elementos. O HTML DOM inclui coisas como a propriedadeclassName
em elementos HTML, ou APIs comodocument.body
.
A especificação HTML também define restrições nos objetos; por exemplo, ela requer que todos os filhos de um elementoul
, que representam uma lista desordenada, sejam elementosli
, que representem itens de lista. Em linhas gerais, ele também proíbe o uso de elementos e atributos que não estão definidos em um padrão.
Procurando peloDocument
object,Window
object, e outros elementos DOM? Leia aDocumentação do DOM.
Outras APIs de destaque
- As funções
setTimeout
esetInterval
foram inicialmente especificadas na interfaceWindow
no Padrão HTML. - XMLHttpRequest. Possibilita enviar requisições HTTP assíncronas.
- AFetch API fornece uma abstração mais ergonômica para requisições de rede.
- CSS Object Model. O CSSOM é utilizado para abstrair regras CSS como objetos
- WebWorkers. API que permite computação paralela.
- WebSockets. API que permite comunicação bi-direcional de baixo-nível.
- Canvas 2D Context. API de ilustração (desenho) para o elemento canvas.
- Ainterface WebAssembly fornece utilitários para comunicação entre código JavaScript e módulosWebAssembly.
Ambientes sem navegador (como Node.js) geralmente não têm APIs DOM — porque não interagem com um documento — mas ainda assim implementam muitas APIs da Web, comofetch()
esetTimeout()
.
Suporte de Navegadores
Todo desenvolvedor já percebeu queo DOM é uma bagunça. A uniformidade no suporte dos Navegadores varia muito de feature para feature. A principal razão para essa situação é o fato de que muitas features importantes do DOM possuem (quando possuem) especificações não muito claras. Além disso, diferentes Navegadores adicionaram features incompatíveis para a sobreposição de casos de uso (como o event model do Internet Explorer). A atual (Junho de 2011) tendência é que a W3C e particularmente a WHATWG estão definindo features mais antigas em detalhes, a fim de melhorar a interoperabilidade. Seguindo esta tendência, Navegadores estão melhorando suas implementações baseados nessas especificações.
Uma abordagem comum, porém não a mais confiável, para compatibilidade cross-browser é utilizar a biblioteca JavaScript. Essas bibliotecas abstrem as features do DOM e garantem que suas API's funcionem de forma similar nos navegadores. Alguns dos frameworks mais utilizados são ojQuery, oprototype, e oYUI.