Visão geral da tecnologia JavaScript

Este artigo necessita de uma revisão técnica. Como posso ajudar.

Este artigo necessita de uma revisão editorial. Como posso ajudar.

Esta tradução está incompleta. Ajude atraduzir este artigo.

Introdução

Enquanto o HTML é usado para armazenar o conteúdo e a formatação de uma página web o CSS codifica o estilo de como o conteúdo formatado deve ser exibido graficamente, JavaScript é usado para adicionar interatividade a uma página web ou criar aplicações web ricas.

No entanto, o termo genérico "JavaScript" tal como é entendido no contexto navegador contém vários elementos diferentes. Um deles é a linguagem principal (ECMAScript), outra é a coleção das Web APIs, incluindo o DOM (Document Object Model).

JavaScript, a linguagem principal (ECMAScript)

O core da linguagem JavaScript é padronizado pelo comitê ECMA TC39 como uma linguagem chamada ECMAScript. A última versão da especificação é ECMAScript 5.1.
 

Esta linguagem core é também usada em ambientes não-browser, por exemplo em node.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 de erros definido pelo usuário)
  • Tipo (boolean, number, string, function, object...)
  • O objeto global. Num browser esse objeto global é o objeto window, mas o ECMAScript apenas define as APIs, não especificamente para navegadores, por exemplo: parseInt, parseFloat, decodeURI, encodeURI...
  • Um mecanismo de herança prototype-based
  • Objetos e funções embutidas (JSON, Math, Array.prototype, Object introspection...)
  • Strict mode

Suporte do Browser

Desde Agosto de 2014, as atuais versões dos principais navegadores implementaram o ECMAScript 5.1, 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 do ECMAScript 6.

Futuro

The proposed fourth edition of ECMA-262 (ECMAScript 4 or ES4) would have been the first major update to ECMAScript since the third edition was published in 1999. As of August 2008, the ECMAScript 4th edition proposal has been scaled back into a project codenamed ECMAScript Harmony, that defines among others, things like Proxies or the const keyword. Progress can be followed here.

Internationalization API

A Especificação da Internationalization API do ECAMSCRIPT é uma adição da Especificação de Linguagem ECMAScript, também padronizada pela Ecma TC39. The internationalization API provides collation (string comparison), formato numérico, e data e tempo para aplicações javascript, and lets applications choose the language and tailor the functionality to their needs. The standard was approved in December 2012; the status of implementations in browsers is tracked in the documentation of the Intl object.

As APIs Web e o DOM

WebIDL

A Especificação da WebIDL provê a junção entre as tecnologias DOM e o ECMAScript.

O núcleo do DOM

O Document Object Model (DOM) é uma convenção cross-platform e language-independent para representar e interagir com objetos em documentos HTML, XHTML, e XML. Objetos no DOM tree podem ser adereçados e apontados utilizando métodos em objetos. O Core Document Object Model é padronizado pela W3C. Ela define inferfaces language-agnosticque abstraem documentos HTML e XML como objetos e mecanismos para manipular essa abstração. Entre as definições do DOM, podemos encontrar:

  • A estrutura do documento, um tree model, e o DOM Event architecture no DOM core: Node, Element, DocumentFragment, Document, DOMImplementation, Event, EventTarget, …
  • Uma definição menos rigorosa do DOM Event Architecture, assim como eventos específicos no DOM events.
  • Outras coisas como o DOM Traversal e o DOM Range.

Pela perspectiva do EXMScript, objetos definidos na especificação do DOM são chamados de "host objects".

HTML DOM

HTML, a linguagem de markup da Web, é especificada nos termos do DOM. Situado além dos conceitos de abstração definidos no DOM Core, o HTML também define o significado dos elementos. O HTML DOM inclui coisas como a propriedade className em elementos HTML, ou APIs como document.body.

A especificação HTML também define restrições nos objetos; por exemplo, ele requer que todos os filhos de um elemento ul, que representa uma lista desordenada, a serem elementos li, que representam itens de lista. Em lihas gerais, ele também proíbe o uso de elementos e atributos que não estão definidos no padrão.

Procurando pelo Document object, Window object, e outros elementos DOM? Leia o Gecko DOM Documentation.

Outras APIs de destaque

  • As funções setTimeout e setInterval foram inicialmente especificadas na interface Window no Padrão HTML.
  • XMLHttpRequest. API que permite enviar requisições HTTP assíncronas.
  • 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 desenho para o elemento canvas.

Suporte de Navegadores

Todo desenvolvedor já percebeu que o 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 o jQuery, o prototype, e o YUI.

Etiquetas do documento e colaboradores

 Colaboradores desta página: caioabe, marcio-ti, IanRamosC, teoli, cleitongalvao, treax
 Última atualização por: caioabe,