JavaScript

JavaScript

Paradigma	orientado a eventos , funcional , imperativo
Projetado por	Brendan Eich da Netscape inicialmente; outros também contribuíram para o padrão ECMAScript
Apareceu pela primeira vez	4 de dezembro de 1995 ; 25 anos atrás [1] ( 1995-12-04 )
Versão estável	ECMAScript 2021 (12ª edição) [2]  / junho de 2021 ; há 4 meses ( Junho de 2021 )
Versão de visualização	ECMAScript 2022 [3]  / 22 de julho de 2021 ; 2 meses atrás ( 22 de julho de 2021 )
Disciplina de digitação	Dinâmico , fraco , pato
Extensões de nome de arquivo	.js .cjs .mjs[4]
Local na rede Internet	www .ecma-international .org / publicações-and-standards / standards / ecma-262 /
Implementações principais
V8 , JavaScriptCore , SpiderMonkey , Chakra
Influenciado por
Java , [5] [6] Esquema , [6] AWK , [7] HyperTalk [8]
Influenciado
TypeScript , CoffeeScript , AssemblyScript , ActionScript , Dart , Objective-J , Opa , Haxe
JavaScript no Wikilivros

JavaScript ( / dʒ ɑː v do ə ˌ s k r ɪ p t / ), ^[9] , muitas vezes abreviado como JS , é uma linguagem de programação que está em conformidade com o ECMAScript especificação. ^[10] JavaScript é de alto nível , frequentemente compilado just-in-time e multiparadigma . Possui sintaxe de chaves , tipagem dinâmica , orientação a objetos baseada em protótipo e funções de primeira classe.

Junto com HTML e CSS , JavaScript é uma das principais tecnologias da World Wide Web . ^[11] Mais de 97% dos sites usam -no do lado do cliente para comportamento de página da web , ^[12] frequentemente incorporando bibliotecas de terceiros . ^[13] A maioria dos navegadores da web tem um mecanismo JavaScript dedicado para executar o código no dispositivo do usuário .

Como uma linguagem multiparadigma, o JavaScript oferece suporte a estilos de programação orientados a eventos , funcionais e imperativos . Possui interfaces de programação de aplicativos (APIs) para trabalhar com texto, datas, expressões regulares , estruturas de dados padrão e o Document Object Model (DOM).

O padrão ECMAScript não inclui nenhuma entrada / saída (E / S), como rede , armazenamento ou recursos gráficos . Na prática, o navegador da web ou outro sistema de tempo de execução fornece APIs JavaScript para E / S.

Os mecanismos JavaScript eram originalmente usados ​​apenas em navegadores da web, mas agora são componentes principais de outros sistemas de software, principalmente servidores e uma variedade de aplicativos .

Embora existam semelhanças entre JavaScript e Java , incluindo o nome da linguagem, sintaxe e respectivas bibliotecas padrão , as duas linguagens são distintas e diferem muito em design.

História

Criação da Netscape

O navegador Mosaic foi lançado em 1993. Como o primeiro navegador com uma interface gráfica de usuário acessível a pessoas não técnicas, ele desempenhou um papel proeminente no rápido crescimento da nascente World Wide Web . ^[14] Os principais desenvolvedores do Mosaic fundaram a corporação Netscape , que lançou um navegador mais sofisticado, o Netscape Navigator , em 1994. O Navigator rapidamente se tornou o navegador mais usado. ^[15]

Durante esses anos de formação da Web, as páginas da Web só podiam ser estáticas, sem a capacidade de comportamento dinâmico depois que a página era carregada no navegador. Havia um desejo no crescente cenário de desenvolvimento da Web de remover essa limitação, então, em 1995, a Netscape decidiu adicionar uma linguagem de script ao Navigator. Eles seguiram duas rotas para conseguir isso: colaborar com a Sun Microsystems para incorporar a linguagem de programação Java , enquanto também contratou Brendan Eich para incorporar a linguagem Scheme . ^[6]

O gerenciamento da Netscape logo decidiu que a melhor opção era para Eich criar uma nova linguagem, com sintaxe semelhante a Java e menos como Scheme ou outras linguagens de script existentes. ^{[5] [6]} Embora a nova linguagem e sua implementação de interpretador fossem chamadas de LiveScript quando lançadas pela primeira vez como parte de uma versão beta do Navigator em setembro de 1995, o nome foi alterado para JavaScript para o lançamento oficial em dezembro. ^{[6] [1] [16]} Eich afirma que a sintaxe do HyperTalk e os nomes dos manipuladores influenciaram o JavaScript. ^[17]

A escolha do nome JavaScript causou confusão, implicando que ele está diretamente relacionado ao Java. Já que Java era a nova linguagem de programação quente na época, isso foi caracterizado como uma jogada de marketing da Netscape para dar seu próprio cachet de nova linguagem. ^[18]

Adopção pela Microsoft

A Microsoft estreou o Internet Explorer em 1995, levando a uma guerra de navegadores com o Netscape. No front do JavaScript, a Microsoft fez a engenharia reversa do interpretador Navigator para criar o seu próprio, chamado JScript .

JScript foi lançado pela primeira vez em 1996, junto com o suporte inicial para CSS e extensões para HTML . Cada uma dessas implementações era visivelmente diferente de suas contrapartes no Navigator. ^{[19] [20]} Essas diferenças dificultaram para os desenvolvedores fazerem seus sites funcionarem bem em ambos os navegadores, levando ao uso generalizado dos logotipos "melhor visualizado no Netscape" e "melhor visualizado no Internet Explorer" por vários anos. ^{[19] [21]}

A ascensão do JScript

Em novembro de 1996, a Netscape submeteu o JavaScript à Ecma International , como ponto de partida para uma especificação padrão que todos os fornecedores de navegadores poderiam seguir. Isso levou ao lançamento oficial da primeira especificação de linguagem ECMAScript em junho de 1997.

O processo de padronização continuou por alguns anos, com o lançamento do ECMAScript 2 em junho de 1998 e do ECMAScript 3 em dezembro de 1999. O trabalho no ECMAScript 4 começou em 2000.

Enquanto isso, a Microsoft conquistou uma posição cada vez mais dominante no mercado de navegadores. No início dos anos 2000, a participação de mercado do Internet Explorer atingiu 95%. ^[22] Isso significa que o JScript se tornou o padrão de fato para scripts do lado do cliente na Web.

A Microsoft participou inicialmente do processo de padronização e implementou algumas propostas em sua linguagem JScript, mas eventualmente parou de colaborar no trabalho da Ecma. Assim, o ECMAScript 4 foi desativado.

Crescimento e padronização

Durante o período de domínio do Internet Explorer no início dos anos 2000, os scripts do lado do cliente estavam estagnados. Isso começou a mudar em 2004, quando o sucessor do Netscape, o Mozilla , lançou o navegador Firefox . O Firefox foi bem recebido por muitos, conquistando uma fatia de mercado significativa do Internet Explorer. ^[23]

Em 2005, a Mozilla ingressou na ECMA International e o trabalho começou no padrão ECMAScript for XML (E4X). Isso levou a Mozilla a trabalhar em conjunto com a Macromedia (posteriormente adquirida pela Adobe Systems ), que estava implementando o E4X em sua linguagem ActionScript 3, que era baseada em um ECMAScript 4 draft. O objetivo passou a ser padronizar o ActionScript 3 como o novo ECMAScript 4. Para esse fim, a Adobe Systems lançou a implementação do Tamarin como um projeto de código aberto . No entanto, Tamarin e ActionScript 3 eram muito diferentes dos scripts do lado do cliente estabelecidos e, sem a cooperação da Microsoft , o ECMAScript 4 nunca se concretizou.

Enquanto isso, desenvolvimentos muito importantes estavam ocorrendo em comunidades de código aberto não afiliadas ao trabalho da ECMA. Em 2005, Jesse James Garrett lançou um white paper no qual cunhou o termo Ajax e descreveu um conjunto de tecnologias, das quais o JavaScript era o backbone, para criar aplicativos da web onde os dados podem ser carregados em segundo plano, evitando a necessidade de página inteira recarrega. Isso deu início a um período de renascimento do JavaScript, liderado por bibliotecas de código aberto e as comunidades que se formaram em torno delas. Muitas novas bibliotecas foram criadas, incluindo jQuery , Prototype , Dojo Toolkit e MooTools .

O Google estreou seu navegador Chrome em 2008, com o motor V8 JavaScript mais rápido que seus concorrentes. ^{[24] [25]} A principal inovação foi a compilação just-in-time (JIT), ^[26] então outros fornecedores de navegadores precisaram revisar seus motores para JIT. ^[27]

Em julho de 2008, essas partes díspares se reuniram para uma conferência em Oslo . Isso levou a um eventual acordo no início de 2009 para combinar todo o trabalho relevante e levar o idioma adiante. O resultado foi o padrão ECMAScript 5, lançado em dezembro de 2009.

Server-side JavaScript e Node.js

Em 2009, Ryan Dahl lançou a primeira versão do Node.js , que combinava o motor V8 do Google, um loop de eventos e uma API de I / O de baixo nível ^[28] para fornecer um ambiente de programação JavaScript baseado em eventos e do lado do servidor completo. Isso simplificou o compartilhamento de dados entre o código do lado do cliente e do servidor, permitindo que os desenvolvedores da Web com experiência em JavaScript do lado do cliente transferissem suas habilidades para o desenvolvimento do lado do servidor. ^[29] Isso eventualmente resultou em uma comunidade de vários milhões de desenvolvedores ^[30] , bem como no npm , o maior registro de pacotes de software do mundo. ^[31]

Atingir a maturidade

O trabalho ambicioso na linguagem continuou por vários anos, culminando com uma extensa coleção de adições e refinamentos sendo formalizados com a publicação do ECMAScript 6 em 2015. ^[32]

A especificação preliminar é mantida abertamente no GitHub , e as edições ECMAScript são produzidas por meio de instantâneos anuais regulares. ^[33] As possíveis revisões do idioma são examinadas por meio de um processo de proposta abrangente. ^{[34] [35]} Agora, em vez de números de edição, os desenvolvedores verificam o status dos próximos recursos individualmente. ^[33]

O ecossistema JavaScript atual tem muitas bibliotecas e estruturas , práticas de programação estabelecidas e maior uso de JavaScript fora dos navegadores da web. Além disso, com o aumento de aplicativos de página única e outros sites pesados ​​em JavaScript, vários transpiladores foram criados para auxiliar o processo de desenvolvimento. ^[36]

Marca Registrada

"JavaScript" é uma marca comercial da Oracle Corporation nos Estados Unidos. ^{[37] [38]}

Uso do lado do cliente do site

JavaScript é a linguagem de script do lado do cliente dominante na Web, com 97% dos sites usando-o para essa finalidade. ^[12] Scripts são embutidos ou incluídos em documentos HTML e interagem com o DOM . A maioria dos navegadores da web, incluindo a grande maioria dos navegadores do Android e todos os navegadores do iPad, tem um mecanismo JavaScript integrado que executa o código no dispositivo do usuário.

Exemplos de comportamento guião

• Carregar o novo conteúdo da página da web sem recarregar a página, via Ajax ou um WebSocket . Por exemplo, os usuários de mídia social podem enviar e receber mensagens sem sair da página atual.
• Animações de página da Web, como o aparecimento e desaparecimento de objetos, redimensionamento e movimentação.
• Jogar jogos de navegador .
• Controlando a reprodução de mídia de streaming .
• Gerando anúncios pop-up .
• Validar os valores de entrada de um formulário da web antes que os dados sejam enviados a um servidor da web .
• Registrar dados sobre o comportamento do usuário e enviá-los a um servidor. O proprietário do site pode usar esses dados para análises , rastreamento de anúncios e personalização .
• Redirecionando um usuário para outra página.

Bibliotecas e frameworks

Mais de 80% dos sites usam uma biblioteca JavaScript de terceiros ou estrutura da web para seus scripts do lado do cliente. ^[13]

jQuery é de longe a biblioteca mais popular, usada por mais de 75% dos sites. ^{[13] O} Facebook criou a biblioteca React para seu site e mais tarde a lançou como código aberto ; outros sites, incluindo o Twitter , agora o usam. Da mesma forma, a estrutura Angular criada pelo Google para seus sites, incluindo YouTube e Gmail , agora é um projeto de código aberto usado por terceiros. ^[13]

Em contraste, o termo "Vanilla JS" foi cunhado para sites que não usam nenhuma biblioteca ou estrutura, em vez disso, contam inteiramente com a funcionalidade JavaScript padrão. ^[39]

Outro uso

O uso de JavaScript se expandiu além das raízes do navegador da web . Os mecanismos JavaScript agora estão incorporados em uma variedade de outros sistemas de software, tanto para implantações de sites do lado do servidor quanto para aplicativos sem navegador .

As tentativas iniciais de promover o uso de JavaScript no lado do servidor foram o Netscape Enterprise Server e o Internet Information Services da Microsoft , ^{[40] [41]} mas eram pequenos nichos. ^[42] O uso do lado do servidor finalmente começou a crescer no final dos anos 2000, com a criação do Node.js e outras abordagens . ^[42]

Electron , Cordova , React Native e outras estruturas de aplicativos foram usadas para criar muitos aplicativos com comportamento implementado em JavaScript. Outros aplicativos que não são do navegador incluem suporte do Adobe Acrobat para scripts de documentos PDF ^[43] e extensões GNOME Shell escritas em JavaScript. ^[44]

O JavaScript começou a aparecer recentemente em alguns sistemas embarcados , geralmente aproveitando o Node.js. ^{[45] [46] [47]}

Características

Os recursos a seguir são comuns a todas as implementações ECMAScript em conformidade, a menos que seja explicitamente especificado de outra forma.

Imperativo e estruturado

JavaScript suporta grande parte da sintaxe de programação estruturada de C (por exemplo, ifinstruções, whileloops, switchinstruções, do whileloops, etc.). Uma exceção parcial é o escopo : originalmente, o JavaScript só tinha o escopo de função com var; em seguida, o escopo do bloco foi adicionado no ECMAScript 2015 com as palavras let- chave e const. Como C, JavaScript faz uma distinção entre expressões e instruções . Uma diferença sintática de C é a inserção automática de ponto-e-vírgula , que permite que pontos-e-vírgulas (que encerram as instruções) sejam omitidos. ^[48]

Fracamente tipado

JavaScript é fracamente tipado , o que significa que certos tipos são implicitamente convertidos dependendo da operação usada. ^[49]

• O +operador binário converte ambos os operandos em uma string, a menos que ambos sejam números. Isso ocorre porque o operador de adição também funciona como um operador de concatenação
• O -operador binário sempre converte ambos os operandos em um número
• Ambos os operadores unários ( +, -) sempre convertem o operando em um número

Os valores são convertidos em strings como o seguinte: ^[49]

• Strings são deixadas como estão
• Os números são convertidos para sua representação em string
• As matrizes têm seus elementos convertidos em strings, após as quais são unidos por vírgulas ( ,)
• Outros objetos são convertidos para a string [object Object]onde Objecté o nome do construtor do objeto

Os valores são convertidos em números, convertendo em strings e, em seguida, convertendo as strings em números. Esses processos podem ser modificados definindo toStringe valueOffunções no protótipo para string e número de conversão, respectivamente.

JavaScript tem recebido críticas pela maneira como implementa essas conversões, pois a complexidade das regras pode ser confundida com inconsistência. ^{[50] [49]} Por exemplo, ao adicionar um número a uma string, o número será convertido em uma string antes de realizar a concatenação, mas ao subtrair um número de uma string, a string é convertida em um número antes de realizar a subtração.

Freqüentemente, também mencionado {} + []resulta em 0(número). Isso é enganoso: o {}é interpretado como um bloco de código vazio em vez de um objeto vazio, e a matriz vazia é convertida em um número pelo +operador unário restante . Se você envolver a expressão entre parênteses, ({} + [])as chaves são interpretadas como um objeto vazio e o resultado da expressão é "[object Object]"o esperado. ^[49]

Dinâmico

Digitando

JavaScript é dinamicamente tipado como a maioria das outras linguagens de script . Um tipo está associado a um valor em vez de uma expressão. Por exemplo, uma variável inicialmente ligada a um número pode ser reatribuída a uma string . ^[51] JavaScript suporta várias maneiras de testar o tipo de objetos, incluindo a digitação de pato . ^[52]

Avaliação de tempo de execução

JavaScript inclui uma evalfunção que pode executar instruções fornecidas como strings em tempo de execução.

Orientação a objetos (com base em protótipo)

A herança prototípica em JavaScript é descrita por Douglas Crockford como:

Você faz objetos de protótipo e então… cria novas instâncias. Os objetos são mutáveis ​​em JavaScript, então podemos aumentar as novas instâncias, dando-lhes novos campos e métodos. Estes podem atuar como protótipos para objetos ainda mais recentes. Não precisamos de classes para fazer muitos objetos semelhantes ... Objetos herdam de objetos. O que poderia ser mais orientado a objetos do que isso? ^[53]

Em JavaScript, um objeto é uma matriz associativa , aumentada com um protótipo (veja abaixo); cada chave fornece o nome de uma propriedade de objeto e há duas maneiras sintáticas de especificar esse nome: notação de ponto ( obj.x = 10) e notação de colchetes ( obj['x'] = 10). Uma propriedade pode ser adicionada, rebote ou excluída em tempo de execução. A maioria das propriedades de um objeto (e qualquer propriedade que pertença à cadeia de herança de protótipo de um objeto) pode ser enumerada usando um for...inloop.

Protótipos

JavaScript usa protótipos onde muitas outras linguagens orientadas a objetos usam classes para herança . ^[54] É possível simular muitos recursos baseados em classe com protótipos em JavaScript. ^[55]

Funciona como construtores de objetos

As funções funcionam também como construtores de objetos, junto com sua função típica. Prefixar uma chamada de função com new criará uma instância de um protótipo, herdando propriedades e métodos do construtor (incluindo propriedades do Objectprotótipo). ^[56] ECMAScript 5 oferece o Object.createmétodo, permitindo a criação explícita de uma instância sem herdar automaticamente do Objectprotótipo (ambientes mais antigos podem atribuir o protótipo null). ^[57] A prototypepropriedade do construtor determina o objeto usado para o protótipo interno do novo objeto. Novos métodos podem ser adicionados modificando o protótipo da função usada como construtor. Construtores integrados do JavaScript, como ArrayouObject, também têm protótipos que podem ser modificados. Embora seja possível modificar o Objectprotótipo, geralmente é considerado uma prática ruim porque a maioria dos objetos em JavaScript herdará métodos e propriedades do Objectprotótipo e eles podem não esperar que o protótipo seja modificado. ^[58]

Funções como métodos

Ao contrário de muitas linguagens orientadas a objetos, não há distinção entre uma definição de função e uma definição de método . Em vez disso, a distinção ocorre durante a chamada de função; quando uma função é chamada como um método de um objeto, o local da função, esta palavra-chave, é vinculado a esse objeto para essa invocação.

Funcional

Uma função é de primeira classe ; uma função é considerada um objeto. Como tal, uma função pode ter propriedades e métodos, como .call()e .bind(). ^[59] Uma função aninhada é uma função definida dentro de outra função. Ele é criado sempre que a função externa é chamada. Além disso, cada função aninhada forma um fechamento léxico : o escopo léxico da função externa (incluindo qualquer constante, variável local ou valor de argumento) torna-se parte do estado interno de cada objeto de função interna, mesmo após a conclusão da execução da função externa . ^[60] JavaScript também suporta funções anônimas .

Delegativo

JavaScript oferece suporte à delegação implícita e explícita .

Funções como papéis (traços e mixins)

JavaScript suporta nativamente várias implementações baseadas em funções de padrões de papéis ^[61] como Traits ^{[62] [63]} e Mixins . ^[64] Tal função define o comportamento adicional por pelo menos um método vinculado à thispalavra - chave dentro de seu functioncorpo. Uma função, então, deve ser delegada explicitamente por meio de callou applypara objetos que precisam apresentar comportamento adicional que não é compartilhado por meio da cadeia de protótipo.

Composição e herança de objetos

Enquanto a delegação baseada em função explícita cobre a composição em JavaScript, a delegação implícita já acontece toda vez que a cadeia de protótipos é percorrida para, por exemplo, encontrar um método que pode estar relacionado, mas não é propriedade direta de um objeto. Uma vez que o método é encontrado, ele é chamado dentro do contexto deste objeto. Assim, a herança em JavaScript é coberta por um automatismo de delegação que está vinculado à propriedade de protótipo das funções do construtor.

Diversos

JS é uma linguagem de índice zero .

Ambiente de execução

JavaScript normalmente depende de um ambiente de tempo de execução (por exemplo, um navegador da web ) para fornecer objetos e métodos pelos quais os scripts podem interagir com o ambiente (por exemplo, um DOM de página da web ). Esses ambientes são de thread único . JavaScript também depende do ambiente de tempo de execução para fornecer a capacidade de incluir / importar scripts (por exemplo, elementos HTML <script> ). Este não é um recurso de linguagem em si, mas é comum na maioria das implementações de JavaScript. JavaScript processa mensagens de uma fila, uma de cada vez. JavaScript chama uma função associada a cada nova mensagem, criando um quadro de pilha de chamadas com os argumentos da funçãoe variáveis ​​locais . A pilha de chamadas diminui e aumenta com base nas necessidades da função. Quando a pilha de chamadas está vazia após a conclusão da função, o JavaScript prossegue para a próxima mensagem na fila. Isso é chamado de loop de evento , descrito como "executar até a conclusão" porque cada mensagem é totalmente processada antes que a próxima mensagem seja considerada. No entanto, o modelo de simultaneidade da linguagem descreve o loop de eventos como sem bloqueio : a entrada / saída do programa é realizada usando eventos e funções de retorno de chamada . Isso significa, por exemplo, que o JavaScript pode processar um clique do mouse enquanto espera que uma consulta ao banco de dados retorne informações. ^[65]

Funções variáveis

Um número indefinido de parâmetros pode ser passado para uma função. A função pode acessá-los por meio de parâmetros formais e também por meio do argumentsobjeto local . Funções variáveis também podem ser criadas usando o bindmétodo.

Literais de matriz e objeto

Como muitas linguagens de script, arrays e objetos ( arrays associativos em outras linguagens) podem ser criados com uma sintaxe de atalho sucinta. Na verdade, esses literais formam a base do formato de dados JSON .

Expressões regulares

JavaScript também oferece suporte a expressões regulares de maneira semelhante ao Perl , que fornece uma sintaxe concisa e poderosa para manipulação de texto que é mais sofisticada do que as funções de string integradas. ^[66]

Promessas

JavaScript também suporta promessas, que são uma forma de lidar com operações assíncronas. Há um objeto Promise embutido que dá acesso a várias funcionalidades para lidar com promessas e define como elas devem ser feitas. Ele permite associar manipuladores a um eventual valor de sucesso ou motivo de falha de uma ação assíncrona. Isso permite que os métodos assíncronos retornem valores como os métodos síncronos: em vez de retornar imediatamente o valor final, o método assíncrono retorna uma promessa de fornecer o valor em algum ponto no futuro. Recentemente, métodos combinatórios foram introduzidos na especificação do JavaScript, o que permite aos desenvolvedores combinar várias promessas do JavaScript e fazer operações com base em diferentes cenários. Os métodos introduzidos são: Promise.race, Promise.all, Promise.allSettled e Promise.any.

Extensões específicas do fornecedor

Historicamente, alguns mecanismos JavaScript suportavam esses recursos não padrão:

• catchcláusulas condicionais (como Java)
• compreensões de array e expressões geradoras (como Python)
• expressões de função concisas ( function(args) expr; esta sintaxe experimental funciona com setas anteriores)
• ECMAScript para XML (E4X), uma extensão que adiciona suporte XML nativo ao ECMAScript (não suportado no Firefox desde a versão 21 ^[67] )

Sintaxe

Exemplos simples

Variáveis em JavaScript podem ser definidas usando as palavras-chave var, ^[68] let^[69] ou const^[70] .

// Declara uma variável com escopo de função chamada `x`, e atribui implicitamente o 
// valor especial` undefined` a ela. Variáveis ​​sem valor são automaticamente 
// definidas como indefinidas. 
var  x ;

// Variáveis ​​podem ser definidas manualmente para `undefined` assim 
var  x2  =  undefined ;

// Declara uma variável com escopo de bloco chamada `y`, e a define implicitamente como 
//` undefined`. A palavra-chave `let` foi introduzida no ECMAScript 2015. 
let  y ;

// Declara uma variável com escopo de bloco e não reatribuível chamada `z`, e a define como 
// um literal de string. A palavra-chave `const` também foi introduzida no ECMAScript 2015, 
// e deve ser explicitamente atribuída a.

// A palavra-chave `const` significa constante, portanto, a variável não pode ser reatribuída 
// pois o valor 
é` constante`. const  z  =  "este valor não pode ser reatribuído!" ;

// Declara uma variável chamada `myNumber` e atribui um literal de número (o valor 
//` 2`) a ela. 
deixe  meuNumero  =  2 ;

// Reatribui `myNumber`, configurando-o para uma string literal (o valor` "foo" `). 
// JavaScript é uma linguagem tipada dinamicamente, então isso é legal. 
meuNumero  =  "foo" ;

Observe os comentários no exemplo acima, todos precedidos por duas barras .

Não há funcionalidade de entrada / saída integrada em JavaScript; o ambiente de tempo de execução fornece isso. A especificação ECMAScript na edição 5.1 menciona: ^[71]

na verdade, não há disposições nesta especificação para entrada de dados externos ou saída de resultados calculados.

No entanto, a maioria dos ambientes de execução tem um consoleobjeto ^[72] que pode ser usado para imprimir a saída. Aqui está um programa Hello World minimalista em JavaScript:

console . log ( "Olá, mundo!" );

Uma função recursiva simples :

função  fatorial ( n )  { 
    if  ( n  ===  0 ) 
        return  1 ;  // 0! = 1

    retornar  n  *  fatorial ( n  -  1 ); 
}

fatorial ( 3 );  // retorna 6

Uma função anônima (ou lambda):

 contador de função ()  { 
    deixar  contar  =  0 ;

     função de retorno ()  { 
        retornar  ++ contagem ; 
    }; 
}

deixe  fechamento  =  contador (); 
fechamento ();  // retorna 1 
closure ();  // retorna 2 
closure ();  // retorna 3

Este exemplo mostra que, em JavaScript, encerramentos de função capturam suas variáveis ​​não locais por referência.

As funções de seta foram introduzidas pela primeira vez na 6ª Edição - ECMAScript 2015 . Eles encurtam a sintaxe para escrever funções em JavaScript. As funções das setas são anônimas por natureza; uma variável é necessária para se referir a eles a fim de invocá-los após sua criação.

Exemplo de função de seta:

// As funções de seta nos permitem omitir a palavra-chave `function`. 
// Aqui, `long_example` aponta para um valor de função anônima. 
const  long_example  =  ( input1 ,  input2 )  =>  { 
    console . log ( "Olá, mundo!" ); 
    saída const  = entrada1 + entrada2 ;    

     saída de retorno ; 
};

// Se não houver colchetes, a função de seta simplesmente retorna a expressão 
// Então aqui está (input1 + input2) 
const  short_example  =  ( input1 ,  input2 )  =>  input1  +  input2 ;

long_example ( 2 ,  3 );  // Imprime "Hello, World!" e retorna 5 
exemplo_curto ( 2 ,  5 );   // Retorna 7

// Se uma função de seta tiver apenas um parâmetro, os parênteses podem ser removidos. 
const  no_parentheses  =  input  =>  input  +  2 ;

no_parentheses ( 3 );  // Retorna 5

Em JavaScript, os objetos são criados da mesma maneira que as funções; isso é conhecido como um objeto de função .

Exemplo de objeto:

função  Ball ( r )  { 
    this . raio  =  r ;  // o argumento "r" é local para o objeto bola 
    this . área  =  matemática . PI  *  ( r  **  2 );  // parênteses não fazem nada além de esclarecer
    
    // objetos podem conter funções ("método") 
    isso . show  =  function ()  { 
        drawCircle ( this . radius );  // faz referência a outra função (que desenha um círculo) 
    }; 
}

deixe  minhaBola  =  nova  Bola ( 5 );  // cria uma nova instância do objeto bola com raio 5 
myBall . radius ++ ;  // as propriedades do objeto geralmente podem ser modificadas de fora de 
myBall . show ();  // usando a função herdada "show"

Demonstração da função variável ( argumentsé uma variável especial ): ^[73]

função  sum ()  { 
    deixe  x  =  0 ;

    para  ( seja  i  =  0 ;  i  <  argumentos . comprimento ;  ++ i ) 
        x  + =  argumentos [ i ];

    return  x ; 
}

soma ( 1 ,  2 );  // retorna 3 
sum ( 1 ,  2 ,  3 );  // retorna 6

Expressões de função imediatamente invocadas são freqüentemente usadas para criar fechamentos. Os fechamentos permitem reunir propriedades e métodos em um namespace e torná-los privados:

let  counter  =  ( function ()  { 
    let  i  =  0 ;  // propriedade privada

    return  {    // métodos públicos 
        get :  function ()  { 
            alert ( i ); 
        }, 
        definir :  função ( valor )  { 
            i  =  valor ; 
        }, 
        incremento :  function ()  { 
            alert ( ++ i ); 
        } 
    }; 
}) ();  // módulo

contador . get ();       // mostra 0 
contador . conjunto ( 6 ); 
contador . incremento ();  // mostra 7 
contadores . incremento ();  // mostra 8

Exportando e importando módulos em JavaScript ^[74]

Exemplo de exportação:

/ * mymodule.js * / 
// Esta função permanece privada, pois não é exportada 
let  sum  =  ( a ,  b )  =>  { 
    return  a  +  b ; 
}

// Exportar variáveis 
export  let  name  =  'Alice' ; 
idade de locação de exportação  = 23 ;   

// Exportar funções nomeadas 
exportar  função  add ( num1 ,  num2 )  { 
    return  num1  +  num2 ; 
}

// Exportar classe 
exportar  classe  Multiplicação  { 
    construtor ( num1 ,  num2 )  { 
        this . num1  =  num1 ; 
        isso . num2  =  num2 ; 
    }

    add ()  { 
        return  sum ( this . num1 ,  this . num2 ); 
    } 
}

Exemplo de importação:

// Importar uma 
importação de  propriedade {  add  }  de  './mymodule.js' ;

console . log ( adicionar ( 1 ,  2 ));  // 3

// Importar propriedades múltiplas 
import  {  name ,  age  }  from  './mymodule.js' ; 
console . log ( nome ,  idade ); 
//> "Alice", 23

// Importar todas as propriedades de uma 
importação de  módulo *  do  console './module.js' 
. log ( nome , idade ); //> "Alice", 23 console . log ( adicionar ( 1 , 2 )); //> 3 

Exemplo mais avançado

Este código de amostra exibe vários recursos de JavaScript.

/ * Encontra o menor múltiplo comum (LCM) de dois números * / 
função  LCMCalculator ( x ,  y )  {  // função do construtor 
    let  checkInt  =  function ( x )  {  // função interna 
        if  ( x  %  1  ! ==  0 ) 
            jogar  new  TypeError ( x  +  "não é um inteiro" );  // var a = mouseX

        return  x ; 
    };
    
    isso . a  =  checkInt ( x ) 
    // semicolons ^^^^ são opcionais, uma nova linha é suficiente 
    este . b  =  checkInt ( y ); 
} 
// O protótipo de instâncias de objeto criadas por um construtor é 
// a propriedade "protótipo" desse construtor. 
LCMCalculator . prototype  =  {  // 
    construtor literal do objeto :  LCMCalculator ,  // ao reatribuir um protótipo, defina a propriedade do construtor apropriadamente 
    gcd :  function ()  { // método que calcula o maior divisor comum 
        // algoritmo euclidiano: 
        let  a  =  Math . abs ( este . a ),  b  =  Matemática . abs ( este . b ),  t ;

        if  ( a  <  b )  { 
            // variáveis ​​de troca 
            // t = b; b = a; a = t; 
            [ a ,  b ]  =  [ b ,  a ];  // troca usando atribuição de desestruturação (ES6) 
        }

        enquanto  ( b  ! ==  0 )  { 
            t  =  b ; 
            b  =  a  %  b ; 
            a  =  t ; 
        }

        // Só precisa calcular o GCD uma vez, então "redefina" este método. 
        // (Na verdade, não é redefinição - é definido na própria instância, 
        // para que this.gcd se refira a esta "redefinição" em vez de LCMCalculator.prototype.gcd. 
        // Observe que isso leva a um resultado errado se os membros do objeto LCMCalculator "a" e / ou "b" são alterados posteriormente.) 
        // Além disso, 'gcd' === "gcd", this ['gcd'] === this.gcd 
        this [ 'gcd' ]  =  function ()  { 
            return  a ; 
        };

        return  a ; 
    },

    // Os nomes das propriedades do objeto podem ser especificados por strings delimitadas por aspas duplas (") ou simples ('). 
    Lcm :  function ()  { 
        // Os nomes das variáveis ​​não colidem com as propriedades do objeto, por exemplo, | lcm | não é | isso. lcm |. 
        // não usando | this.a * this.b | para evitar problemas de precisão do FP, 
        deixe  lcm  =  this . a  /  this . gcd ()  *  this . b ;
        
        // Só precisa calcular lcm uma vez, então "redefina" este método. 
        isso . lcm  =  função ()  { 
            lcm de retorno  ; };
        

        return  lcm ; 
    },

    toString :  function ()  { 
        return  "LCMCalculator: a ="  +  this . a  +  ", b ="  +  isso . b ; 
    } 
};

// Definir função de saída genérica; esta implementação só funciona para 
saída de função de  navegadores da Web ( x ) { documento . corpo . appendChild ( document . createTextNode ( x )); documento . corpo . appendChild ( document . createElement ( 'br' )); } 
    
    


// Observação: map () e forEach () da matriz são definidos em JavaScript 1.6. 
// Eles são usados ​​aqui para demonstrar a natureza funcional inerente do JavaScript. 
[ 
    [ 25 ,  55 ], 
    [ 21 ,  56 ], 
    [ 22 ,  58 ], 
    [ 28 ,  56 ] 
]. map ( function ( pair )  {  // array literal + função de mapeamento 
    return  new  LCMCalculator ( pair [ 0 ],  pair [ 1 ]); 
}).sort (( a ,  b )  =>  a . lcm ()  -  b . lcm ())  // classificar com esta função comparativa; => é uma forma abreviada de uma função, chamada "função de seta" 
    . forEach ( printResult );

função  printResult ( obj )  { 
    output ( obj  +  ", gcd ="  +  obj . gcd ()  +  ", lcm ="  +  obj . lcm ()); 
}

A seguinte saída deve ser exibida na janela do navegador.

LCMCalculator: a = 28, b = 56, gcd = 28, lcm = 56
LCMCalculator: a = 21, b = 56, gcd = 7, lcm = 168
LCMCalculator: a = 25, b = 55, gcd = 5, lcm = 275
LCMCalculator: a = 22, b = 58, gcd = 2, lcm = 638

Segurança

JavaScript e o DOM fornecem o potencial para autores mal-intencionados entregarem scripts para serem executados em um computador cliente através da web. Os autores do navegador minimizam esse risco usando duas restrições. Primeiro, os scripts são executados em uma caixa de proteção na qual podem realizar apenas ações relacionadas à Web, não tarefas de programação de propósito geral, como a criação de arquivos. Em segundo lugar, os scripts são restringidos pela política de mesma origem : os scripts de um site da Web não têm acesso a informações como nomes de usuário, senhas ou cookies enviados a outro site. A maioria dos bugs de segurança relacionados ao JavaScript são violações da política de mesma origem ou da sandbox.

Existem subconjuntos de JavaScript geral - ADsafe, Secure ECMAScript (SES) - que fornecem maiores níveis de segurança, especialmente em código criado por terceiros (como anúncios). ^{[75] [76] O} Closure Toolkit é outro projeto para incorporação e isolamento seguros de JavaScript e HTML de terceiros. ^[77]

A Política de Segurança de Conteúdo é o principal método pretendido para garantir que apenas o código confiável seja executado em uma página da web.

Vulnerabilidades cross-site

Um problema comum de segurança relacionado ao JavaScript é o cross-site scripting (XSS), uma violação da política de mesma origem . As vulnerabilidades de XSS ocorrem quando um invasor consegue fazer com que um site de destino, como um site de banco online, inclua um script malicioso na página apresentada à vítima. O script neste exemplo pode acessar o aplicativo bancário com os privilégios da vítima, potencialmente divulgando informações secretas ou transferindo dinheiro sem a autorização da vítima. Uma solução para vulnerabilidades XSS é usar HTML escaping sempre que exibir dados não confiáveis.

Alguns navegadores incluem proteção parcial contra ataques XSS refletidos , nos quais o invasor fornece um URL incluindo script malicioso. No entanto, mesmo os usuários desses navegadores são vulneráveis ​​a outros ataques XSS, como aqueles em que o código malicioso é armazenado em um banco de dados. Apenas o design correto de aplicativos da Web no lado do servidor pode impedir totalmente o XSS.

Vulnerabilidades de XSS também podem ocorrer devido a erros de implementação pelos autores do navegador. ^[78]

Outra vulnerabilidade entre sites é a falsificação de solicitação entre sites (CSRF). No CSRF, o código no site de um invasor engana o navegador da vítima e faz com que ele execute ações que o usuário não pretendia no site de destino (como transferir dinheiro em um banco). Quando os sites de destino dependem exclusivamente de cookies para autenticação de solicitação, as solicitações originadas do código do site do invasor podem ter as mesmas credenciais de login válidas do usuário inicial. Em geral, a solução para o CSRF é exigir um valor de autenticação em um campo de formulário oculto, e não apenas nos cookies, para autenticar qualquer solicitação que possa ter efeitos duradouros. Verificar o cabeçalho HTTP Referrer também pode ajudar.

"JavaScript hijacking" é um tipo de ataque CSRF no qual uma <script>tag no site de um invasor explora uma página no site da vítima que retorna informações privadas, como JSON ou JavaScript. As soluções possíveis incluem:

• exigindo um token de autenticação nos parâmetros POST e GET para qualquer resposta que retorne informações privadas.

Confiança equivocada no cliente

Os desenvolvedores de aplicativos cliente-servidor devem reconhecer que clientes não confiáveis ​​podem estar sob o controle de invasores. O autor do aplicativo não pode presumir que seu código JavaScript será executado conforme pretendido (ou de todo) porque qualquer segredo incorporado no código pode ser extraído por um determinado adversário. Algumas implicações são:

• Os autores de sites não podem esconder perfeitamente como seu JavaScript opera porque o código-fonte bruto deve ser enviado ao cliente. O código pode ser ofuscado , mas a ofuscação pode ser submetida a engenharia reversa.
• A validação do formulário JavaScript fornece apenas conveniência para os usuários, não segurança. Se um site verifica se o usuário concordou com seus termos de serviço, ou filtra caracteres inválidos de campos que devem conter apenas números, deve fazê-lo no servidor, não apenas no cliente.
• Os scripts podem ser desabilitados seletivamente, portanto, não se pode confiar em JavaScript para impedir operações como clicar com o botão direito do mouse em uma imagem para salvá-la. ^[79]
• É considerada uma prática muito ruim incorporar informações confidenciais, como senhas, em JavaScript, porque elas podem ser extraídas por um invasor. ^[80]

Confiança equivocada no desenvolvedores

Os sistemas de gerenciamento de pacotes, como npm e Bower, são populares entre os desenvolvedores de JavaScript. Esses sistemas permitem que um desenvolvedor gerencie facilmente as dependências de seus programas das bibliotecas de programas de outros desenvolvedores. Os desenvolvedores confiam que os mantenedores das bibliotecas as manterão seguras e atualizadas, mas nem sempre é o caso. Uma vulnerabilidade surgiu por causa dessa confiança cega. As bibliotecas confiáveis ​​podem ter novos lançamentos que causam o aparecimento de bugs ou vulnerabilidades em todos os programas que dependem das bibliotecas. Inversamente, uma biblioteca pode ficar sem correção com vulnerabilidades conhecidas à solta. Em um estudo feito examinando uma amostra de 133 mil sites, os pesquisadores descobriram que 37% dos sites incluíam uma biblioteca com pelo menos uma vulnerabilidade conhecida. ^[81]"O intervalo médio entre a versão da biblioteca mais antiga usada em cada site e a versão mais recente disponível dessa biblioteca é de 1.177 dias na ALEXA, e o desenvolvimento de algumas bibliotecas ainda em uso foi encerrado anos atrás." ^[81] Outra possibilidade é que o mantenedor de uma biblioteca pode removê-la completamente. Isso ocorreu em março de 2016, quando Azer Koçulu removeu seu repositório do npm . Isso fez com que dezenas de milhares de programas e sites que dependiam de suas bibliotecas quebrassem. ^{[82] [83]}

Navegador e erros de codificação do plugin

JavaScript fornece uma interface para uma ampla gama de recursos do navegador, alguns dos quais podem ter falhas, como estouro de buffer . Essas falhas podem permitir que os invasores escrevam scripts que executariam qualquer código que desejassem no sistema do usuário. Este código não está, de forma alguma, limitado a outro aplicativo JavaScript. Por exemplo, uma exploração de saturação de buffer pode permitir que um invasor obtenha acesso à API do sistema operacional com privilégios de superusuário.

Essas falhas afetaram os principais navegadores, incluindo Firefox, ^[84] Internet Explorer, ^[85] e Safari. ^[86]

Plug-ins, como reprodutores de vídeo, Adobe Flash e a ampla gama de controles ActiveX habilitados por padrão no Microsoft Internet Explorer, também podem ter falhas exploráveis ​​via JavaScript (essas falhas foram exploradas no passado). ^{[87] [88]}

No Windows Vista, a Microsoft tentou conter os riscos de bugs, como estouros de buffer, executando o processo do Internet Explorer com privilégios limitados. ^{[89] O} Google Chrome confina de forma semelhante seus renderizadores de página em sua própria "caixa de areia".

Erros de implementação Sandbox

Os navegadores da Web são capazes de executar JavaScript fora da sandbox, com os privilégios necessários para, por exemplo, criar ou excluir arquivos. Esses privilégios não se destinam a ser concedidos a códigos da web.

A concessão incorreta de privilégios para JavaScript da Web tem desempenhado um papel nas vulnerabilidades tanto no Internet Explorer ^[90] quanto no Firefox. ^[91] No Windows XP Service Pack 2, a Microsoft rebaixou os privilégios do JScript no Internet Explorer. ^[92]

O Microsoft Windows permite que os arquivos de origem do JavaScript no disco rígido de um computador sejam iniciados como programas de uso geral, sem área restrita (consulte: Windows Script Host ). Isso torna o JavaScript (como o VBScript ) um vetor teoricamente viável para um cavalo de Tróia , embora os cavalos de Tróia JavaScript sejam incomuns na prática. ^{[93] [ falha na verificação ]}

Vulnerabilidades de hardware

Em 2015, uma implementação de prova de conceito baseada em JavaScript de um ataque de martelo de remo foi descrita em um artigo por pesquisadores de segurança. ^{[94] [95] [96] [97]}

Em 2017, um ataque baseado em JavaScript via navegador foi demonstrado que poderia contornar o ASLR . É chamado de "ASLR⊕Cache" ou AnC. ^{[98] [99]}

Em 2018, o jornal que anunciou os ataques Spectre contra a execução especulativa na Intel e outros processadores incluiu uma implementação de JavaScript. ^[100]

Ferramentas de desenvolvimento

Ferramentas importantes evoluíram com a linguagem.

• Todos os principais navegadores da web possuem ferramentas de desenvolvimento da web integradas , incluindo um depurador de JavaScript .
• Ferramentas de análise de programa estático , como ESLint e JSLint , varrem o código JavaScript para conformidade com um conjunto de padrões e diretrizes.
• Alguns navegadores têm perfis integrados . Bibliotecas de perfis independentes também foram criadas, como benchmark.js e jsbench. ^{[101] [102]}
• Muitos editores de texto têm suporte de realce de sintaxe para código JavaScript.

Tecnologias relacionadas

Java

Um equívoco comum é que o JavaScript é semelhante ou intimamente relacionado ao Java . É verdade que ambos têm uma sintaxe semelhante a C (a linguagem C sendo sua linguagem ancestral comum mais imediata). Eles também são normalmente colocados em sandbox (quando usados ​​dentro de um navegador), e o JavaScript foi projetado com a sintaxe Java e a biblioteca padrão em mente. Em particular, todas as palavras-chave Java foram reservadas no JavaScript original, a biblioteca padrão do JavaScript segue as convenções de nomenclatura do Java e os JavaScript Mathe Dateobjetos são baseados em classes do Java 1.0, ^[103] mas as semelhanças terminam aí.

Java e JavaScript apareceram pela primeira vez em 1995, mas Java foi desenvolvido por James Gosling da Sun Microsystems e JavaScript por Brendan Eich da Netscape Communications.

As diferenças entre as duas línguas são mais proeminentes do que suas semelhanças. Java possui tipagem estática , enquanto a digitação de JavaScript é dinâmica . Java é carregado a partir do bytecode compilado, enquanto o JavaScript é carregado como código-fonte legível por humanos. Os objetos do Java são baseados em classes , enquanto os do JavaScript são baseados em protótipos . Por fim, o Java não oferecia suporte à programação funcional até o Java 8, enquanto o JavaScript o fazia desde o início, sendo influenciado pelo Scheme .

JSON

JSON , ou JavaScript Object Notation, é um formato de intercâmbio de dados de propósito geral que é definido como um subconjunto da sintaxe literal do objeto JavaScript.

WebAssembly

Desde 2017, os navegadores da web têm suporte para WebAssembly , um formato binário que permite que um mecanismo JavaScript execute partes críticas de desempenho de scripts de página da web próximos à velocidade nativa. ^[104] O código WebAssembly é executado na mesma sandbox que o código JavaScript normal.

asm.js é um subconjunto do JavaScript que serviu como o precursor do WebAssembly. ^[105]

Transpilers

JavaScript é a linguagem dominante do lado do cliente na Web, e muitos sites usam muitos scripts. Assim, transpiladores foram criados para converter códigos escritos em outras linguagens, o que pode auxiliar no processo de desenvolvimento. ^[36]

Referências