JavaScript - w3schools.com/js/default.asp - w3schools.com/jsref/default.asp

  1. Where to

<script></script> -> Inserir entre as tags

<head> ou <body> -> Inserir as tags dentro de um ou outro

<script src="myScript.js"></script> -> Inserir script externo

  1. Output

innerHTML -> Escrever dentro de um elemento html

document.write() -> Escrever dentro do elemento body

window.alert() -> Mensagem em um alert box

console.log() -> Escreve no console do navegador

  1. Syntax

Valores fixos são literais e valores variados são variáveis

Comentários -> // ou / /

Identificadores:

  • Primeiro character -> letra, _ ou $

JavaScript é case sensitive e por definição lower camel case

  1. Afirmações

São executadas uma por um

Code blocks dentro de { }

Keywords:

  • break -> Termina um switch ou loop
  • continue -> Salta um loop e vai para o começo
  • debugger -> Para a execução e chama a função de debugging
  • do ... while, for -> Loop enquanto a condição é verdadeira
  • function -> Bloco reutilizavél
  • if ... else -> Bloco de condições
  • return -> Retorna o valor e sai de uma função
  • switch -> Verifica um caso e varias continções
  • try ... catch -> Manipula erros quando ocorrem
  • var -> Declara uma variável
  • For
  • For ... in
  1. Variáveis

5 Tipos:

  • string
  • number
  • boolean
  • object
  • function
  1. Operações

Operadores:

  • Afirmação -> =
  • Adição -> +
  • Multiplicação -> *
  • Subtração -> -
  • Divisão -> /
  • Modulo -> %
  • Incremento -> ++
  • Decremento -> --

Operações de afirmação -> =, +=, -=, *=, /= e %=

Operações de concatenação -> " " + " "

Operadores de comparação:

  • == -> Iqual valor
  • === -> Iqual valor e tipo
  • != -> Não iqual valor
  • !== -> Não iqual valor e tipo
  • < -> Maior que
  • -> Menor que

  • <= -> Maior ou iqual que
  • = -> Menor ou iqual que

  • ? -> Operador ternário

Operador lógico:

  • && -> And
  • || -> Or
  • ! -> Not

3 Tipos de objeto:

  • Object
  • Date
  • Array

2 Tipos que não podem conter valor:

  • null
  • undefined

Operador tipo:

  • typeof -> Retorna o tipo da variavel
  • instanceof -> Retorna verdadeiro se um objeto for uma instância de um tipo de objeto

Operadores Bitwise:

  • & -> AND
  • | -> OR
  • ~ -> NOR
  • ^ -> XOR
  • << -> Zero fill left shift
  • -> Signed right shift

  • -> Zero fill right shift

Operador delete -> Apaga uma propriedade de um objeto

/ e * tem precedência a + e -

Operador in -> Retorna true se existe no array ou objeto

Operador void -> Avalia uma expressão e retorna undefined.

  1. Aritmética

Objeto Math -> Usado para operações matemáticas

Métodos Math:

  • abs(x) -> Retorna o valor absoluto de x
  • acos(x) -> Retorna o arco cosseno de x em radianos
  • asin(x) -> Retorna o arco seno de x em radianos
  • atan(x) -> Retorna o arco tangente de x
  • atan2(y, x) -> Retorna o arctangente do quociente de seus argumentos
  • ceil(x) -> Retorna x arredondado para cima para o número inteiro mais próximo
  • cos(x) -> Retorna o coseno de x em radianos
  • sin(x) -> Retorna o seno de x em radianos
  • exp(x) -> Retorna o valor de E^x
  • floor(x) -> Retorna x arredondado para baixo para o inteiro mais próximo
  • log(x) -> Retorna o logaritmo natural (base E) de x
  • max(x, y, z, ..., n) -> Retorna o número com o valor mais alto
  • min(x, y, z, ..., n) -> Retorna o número com o valor mais baixo
  • pow(x, y) -> Retorna o valor de x para o poder de y
  • random() -> Retorna um número aleatório entre 0 e 1
  • round(x) -> Arredonda x para o inteiro mais próximo
  • sqrt(x) -> Retorna a raiz quadrada de x
  • tan(x) -> Retorna a tangente de um ângulo

Os tipos são dinâmicos

  1. Funções

Syntax:
function name(parameter1, parameter2, parameter3) {
code to be executed
}

Invocar uma função:

  • Evento
  • Invocado no código
  • Automáticamente
  1. Objetos

Objetos podem conter propriedades ou métodos.

Acessar uma propriedade em um objeto:

  • objectName.propertyName
  • objectName["propertyName"]

Acessar um método em um objeto:

  • objectName.methodName()

Outro objetos: new String(), new Number e new Boolean()

  1. Scope

Local e global.

Strict Mode -> Em um programa ou função é em um contexto previne certas ações de ser tomado e lança mais exceções

  1. Strings

Usadas para guardar e manipular texto.

Caracteres especiais:

  • \´-> Aspas simples
  • \" -> Aspas duplas
  • \ -> Barra
  • \b -> Barra de espaço
  • \f -> Feed de formulário
  • \n -> Nova linha
  • \r -> Retorno de carro
  • \t -> Horizontal tabular
  • \v -> Vertical tabular

Podem ser objetos, porém tem baixa performasse e não devem ser usadas. Por exemplo: new String()

String propriedades:

  • constructor -> Retorna a função de construtor da string
  • length -> Retorna o comprimento de uma string
  • prototype -> Permite adicionar propriedades e métodos a um objeto

String métodos:

  • charAt() -> Retorna a posição do caractere no índice especificado
  • charCodeAt() -> Retorna o Unicode do caractere no índice especificado
  • concat() -> Junta-se a duas ou mais strings, e retorna uma nova corda juntada
  • endsWith() -> Verifica se uma string termina com string / caracteres especificados
  • fromCharCode() -> Converte valores Unicode em caracteres
  • includes() -> Verifica se uma string contém a string / caracteres especificados
  • indexOf() -> Retorna a posição da primeira ocorrência encontrada de um valor especificado em uma string
  • Retorna a posição da última ocorrência encontrada de um valor especificado em uma string
  • localeCompare() -> Compara duas strings no local atual
  • match() -> Procura uma string para uma partida contra uma expressão regular e retorna as correspondências
  • repeat() -> Retorna uma nova string com um número especificado de cópias de uma string existente
  • replace() -> Procura uma string para um valor especificado ou uma expressão regular e retorna uma nova seqüência de caracteres onde os valores especificados são substituídos
  • search() -> Procura uma string para um valor especificado, ou expressão regular, e retorna a posição da partida
  • slice() -> Extrai uma parte de uma string e retorna uma nova string
  • split() -> Divide uma string em uma série de substrings
  • startsWith() -> Verifica se uma string começa com caracteres especificados
  • substr() -> Extrai os caracteres de uma string, começando em uma posição de início especificada e pelo número especificado de personagem
  • substring() -> Extrai os caracteres de uma string, entre dois índices especificados
  • toLocaleLowerCase() -> Converte uma string em letras minúsculas, de acordo com a localização do host
  • toLocaleUpperCase() -> Converte uma string em letras maiúsculas, de acordo com a localização do host
  • toLowerCase() -> Converte uma string em letras minúsculas
  • toString() -> Retorna o valor de um objeto String
  • toUpperCase() -> Converte uma string em letras maiúsculas
  • trim() -> Remove espaço em branco de ambas as extremidades de uma string
  • valueOf() -> Retorna o valor primitivo de um objeto String
  1. Numbers

Números são sempre 64-bits de ponto float

NaN (Not a Number) -> Não é um número legal

Infinity (ou -Infinity) -> Retorna se você calcular um número fora do maior número possível.

Hexadecimal -> Exibe números como base de 10 decimais.

Number propriedades:

  • constructor -> Retorna a função que criou o protótipo Número do JavaScript
  • MAX_VALUE -> Retorna o maior número possível em JavaScript
  • MIN_VALUE -> Retorna o menor número possível em JavaScript
  • NEGATIVE_INFINITY -> Representa o infinito negativo
  • NaN -> Representa um valor "Não-numero"
  • POSITIVE_INFINITY -> Representa o infinito
  • prototype -> Permite adicionar propriedades e métodos a um objeto

Number métodos:

  • isFinite() -> Verifica se um valor é um número finito
  • isInteger() -> Verifica se um valor é um número inteiro
  • isNaN() -> Verifica se um valor é Number.NaN
  • isSafeInteger() -> Verifica se um valor é um número inteiro seguro
  • toExponential(x) -> Converte um número em uma notação exponencial
  • toFixed(x) -> Formata um número com x números de dígitos após o ponto decimal
  • toPrecision(x) -> Formata um número para x comprimento
  • toString() -> Converte um número em uma string
  • valueOf() -> Retorna o valor primitivo de um número

Number conversão:

  • Number()
  • parseInt()
  • parseFloat()
  1. Dates

new Date(year, month, day, hours, minutes, seconds, milliseconds) -> Como criar objetos data

Date propriedades:

  • constructor -> Retorna a função que criou o protótipo do objeto Date
  • prototype -> Permite adicionar propriedades e métodos a um objeto

Date Métodos:

  • getDate() -> Retorna o dia do mês (de 1-31)
  • getDay() -> Retorna o dia da semana (de 0 a 6)
  • getFullYear() -> Retorna o ano
  • getHours() -> Retorna a hora (de 0 a 23)
  • getMilliseconds() -> Retorna os milissegundos (de 0 a 9999)
  • getMinutes() -> Retorna os minutos (de 0 a 59)
  • getMonth () -> Retorna o mês (de 0 a 11)
  • getSeconds () -> Retorna os segundos (de 0 a 59)
  • getTime () -> Retorna o número de milissegundos desde a meia-noite de 1 de janeiro de 1970 e uma data específica
  • getTimezoneOffset () -> Retorna a diferença horária entre a hora UTC e a hora local, em minutos
  • getUTCDate () -> Retorna o dia do mês, de acordo com o tempo universal (de 1-31)
  • getUTCDay () -> Retorna o dia da semana, de acordo com a hora universal (de 0 a 6)
  • getUTCFullYear () -> Retorna o ano, de acordo com o tempo universal
  • getUTCHours () -> Retorna a hora, de acordo com a hora universal (de 0 a 23)
  • getUTCMilliseconds () -> Retorna os milissegundos, de acordo com o tempo universal (de 0 a 9999)
  • getUTCMinutes () -> Retorna os minutos, de acordo com a hora universal (de 0-59)
  • getUTCMonth () -> Retorna o mês, de acordo com a hora universal (de 0 a 11)
  • getUTCSeconds () -> Retorna os segundos, de acordo com a hora universal (de 0-59)
  • getYear () -> Deprecated. Use o método getFullYear () em vez disso
  • now () -> Retorna o número de milissegundos desde a meia-noite 01 de janeiro de 1970
  • parse () -> Analisa uma string de data e retorna o número de milissegundos desde 1 de janeiro de 1970
  • setDate () -> Define o dia do mês de um objeto de data
  • setFullYear () -> Define o ano de um objeto de data
  • setHours () -> Define a hora de um objeto de data
  • setMilliseconds () -> Define os milissegundos de um objeto de data
  • setMinutes () -> Define os minutos de um objeto de data
  • setMonth () -> Define o mês de um objeto de data
  • setSeconds () -> Define os segundos de um objeto de data
  • setTime () -> Define uma data para um número especificado de milissegundos após / antes de 1 de janeiro de 1970
  • setUTCDate () -> Define o dia do mês de um objeto de data, de acordo com a hora universal
  • setUTCFullYear () -> Define o ano de um objeto de data, de acordo com o tempo universal
  • setUTCHours () -> Define a hora de um objeto de data, de acordo com a hora universal
  • setUTCMilliseconds () -> Define os milissegundos de um objeto de data, de acordo com a hora universal
  • setUTCMinutes () -> Define os minutos de um objeto de data, de acordo com a hora universal
  • setUTCMonth () -> Define o mês de um objeto de data, de acordo com o tempo universal
  • setUTCSeconds () -> Define os segundos de um objeto de data, de acordo com o tempo universal
  • setYear () -> Deprecated. Use o método setFullYear () em vez disso
  • toDateString () -> Converte a parte da data de um objeto Date em uma string legível
  • toGMTString () -> Deprecated. Use o método toUTCString () em vez disso
  • toISOString () -> Retorna a data como uma string, usando o padrão ISO
  • toJSON () -> Retorna a data como uma string, formatada como uma data JSON
  • toLocaleDateString () -> Retorna a porção de data de um objeto Date como uma string, usando convenções de localidade
  • toLocaleTimeString () -> Retorna a porção de tempo de um objeto Date como uma string, usando convenções de localidade
  • toLocaleString () -> Converte um objeto Date para uma string, usando convenções de localidade
  • toString () -> Converte um objeto Date para uma string
  • toTimeString () -> Converte a porção de tempo de um objeto Date para uma string
  • toUTCString () -> Converte um objeto Date para uma string, de acordo com o tempo universal
  • UTC () -> Retorna o número de milissegundos em uma data desde a meia-noite de 1º de janeiro de 1970, de acordo com a hora UTC
  • valueOf () -> Retorna o valor primitivo de um objeto Date

Time Zones -> Ao definir uma data, sem especificar o fuso horário, o JavaScript usará o fuso horário do navegador.

4 Tipos:

  • ISO Date
  • Short Date
  • Long Date
  • Full Date
  1. Arrays

Armazena múltiplos valores em uma variável

Array propriedades:

  • constructor-> Retorna a função que criou o protótipo do objeto Array
  • length -> Define ou retorna o número de elementos em uma matriz
  • prototype-> Permite adicionar propriedades e métodos a um objeto Array

Array métodos:

  • concat () -> junta dois ou mais arrays, e retorna uma cópia das matrizes juntas
  • copyWithin () -> Copia elementos da matriz dentro da matriz, para e de posições especificadas
  • every () -> Verifica se cada elemento em uma matriz passa um teste
  • fill () Preencha os elementos em uma matriz com um valor estático
  • filter () -> Cria uma nova matriz com cada elemento em uma matriz que passa um teste
  • find () -> Retorna o valor do primeiro elemento em uma matriz que passa um teste
  • findIndex () -> Retorna o índice do primeiro elemento em uma matriz que passa um teste
  • forEach () -> Chama uma função para cada elemento da matriz
  • indexOf () -> Pesquisar a matriz para um elemento e retorna sua posição
  • isArray () -> Verifica se um objeto é uma matriz
  • join () -> junta todos os elementos de uma matriz em uma string
  • lastIndexOf () -> Procure a matriz para um elemento, começando no final, e retorna sua posição
  • map () -> Cria uma nova matriz com o resultado de chamar uma função para cada elemento da matriz
  • pop () -> Remove o último elemento de uma matriz e retorna esse elemento
  • push () -> Adiciona novos elementos ao final de uma matriz e retorna o novo comprimento
  • reduzir () -> Reduzir os valores de uma matriz para um único valor (indo da esquerda para a direita)
  • reductionRight () -> Reduza os valores de uma matriz para um único valor (indo da direita para a esquerda)
  • reverse () -> Inverte a ordem dos elementos em uma matriz
  • shift () -> Remove o primeiro elemento de uma matriz e retorna esse elemento
  • slice () -> Seleciona uma parte de uma matriz e retorna a nova matriz
  • some () -> verifica se algum dos elementos de uma matriz passa uma prova
  • sort () -> Classifica os elementos de uma matriz
  • splice () -> Adiciona / Remove elementos de uma matriz
  • toString () -> Converte uma matriz em uma string e retorna o resultado
  • unshift () -> Adiciona novos elementos ao início de uma matriz e retorna o novo comprimento
  • valueOf () -> Retorna o valor primitivo de uma matriz

Diferença entre matrizes e objetos:

  • Arrays usam índices numerados
  • Objetos usam índices nomeados
  1. Booleans

Valor true ou false

Boolean propriedades:

  • constructor-> Retorna a função que criou o protótipo do objeto Array
  • prototype-> Permite adicionar propriedades e métodos a um objeto Array

Boolean métodos:

  • toString () -> Converte um valor booleano para uma string e retorna o resultado
  • valueOf () -> Retorna o valor primitivo de um booleano

Operador ternário -> variableName = (condition) ? value1:value2

  1. Tipo Conversão

Tabela de Conversão de Tipo -> w3schools.com/js/js_type_conversion.asp

  1. RegExp

Expressões regulares -> developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Regular_Expressions

search() -> Usa uma expressão para procurar uma correspondência e retorna a posição da partida.

replace() -> Retorna uma seqüência de caracteres modificada onde o padrão é substituído

RegExp propriedades:

  • consctrutor -> Retorna a função que criou o protótipo do objeto RegExp
  • global -> Verifica se o modificador "g" está configurado
  • ignoreCase -> Verifica se o modificador "i" está configurado
  • lastIndex -> Especifica o índice no qual iniciar a próxima partida
  • multiline -> Verifica se o modificador "m" está configurado
  • source -> Retorna o texto do padrão RegExp

RegExp métodos:

  • compile () -> Deprecated na versão 1.5. Compila uma expressão regular
  • exec () -> Testes para uma correspondência em uma string. Retorna a primeira partida
  • test () -> Testes para uma correspondência em uma string. Retorna verdadeiro ou falso
  • toString () -> Retorna o valor da string da expressão regular
  1. Errors

Errors:

  • try -> Teste um bloco de código para erros
  • catch -> lidar com o erro
  • throw -> Criar erros personalizados
  • finalmente -> Execute o código, depois de tentar e pegar, independentemente do resultado

Error objeto propriedades:

  • name -> Define ou retorna um nome de erro
  • mensagem -> Define ou retorna uma mensagem de erro

6 tipos:

  • EvalError -> Ocorreu um erro na função eval ()
  • RangeError -> Um número "fora do alcance" ocorreu
  • ReferenceError -> Uma referência ilegal ocorreu
  • SyntaxError -> Ocorreu um erro de sintaxe
  • TypeError -> Ocorreu um erro de tipo
  • URIError -> Ocorreu um erro no encodeURI ()
  1. Global

Propriedades e funções globais podem ser usadas com todos os objetos JavaScript incorporados.

Global propriedades:

  • Infinito -> Um valor numérico que representa infinito positivo / negativo
  • NaN -> valor "Não-numero"
  • indefinido -> Indica que uma variável não recebeu um valor

Global functions:

  • decodeURI () -> Decode um URI
  • decodeURIComponent () -> Decode um componente URI
  • encodeURI () -> Encode um URI
  • encodeURIComponent () -> Codifica um componente URI
  • escape () -> Deprecated na versão 1.5. Use encodeURI () ou encodeURIComponent () em vez disso
  • eval () -> Avalia uma string e executa-a como se fosse um código de script
  • isFinite () -> Determina se um valor é um número finito e legal
  • isNaN () -> Determina se um valor é um número ilegal
  • Number () -> Converte o valor de um objeto em um número
  • parseFloat () -> Analisa uma string e retorna um número de ponto flutuante
  • parseInt () -> Analisa uma string e retorna um número inteiro
  • String () -> Converte o valor de um objeto em uma string
  • unescape () -> Desativado na versão 1.5. Use decodeURI () ou decodeURIComponent () em vez disso
  1. Debugging

Debuggers podem ser ativados e desativados, obrigando os erros a serem relatados ao usuário.

Breakpoints -> lugares onde a execução do código pode ser interrompida e examinar variáveis enquanto o código está sendo executado.

F12, e selecione "Console" no menu do depurador.

console.log() -> Exibir valores de JavaScript na janela do depurador

debugger keyword -> Interrompe a execução do JavaScript e chama (se disponível) a função de depuração

  1. Console

window.console ->

Console métodos:

  • assert () -> Grava uma mensagem de erro no console se a asserção for falsa
  • clear () -> Limpa o console
  • count () -> Registra o número de vezes que essa chamada particular para contar () foi chamada
  • error () -> Sai uma mensagem de erro para o console
  • group () -> Cria um novo grupo inline no console. Este recuo segue as mensagens do console por um nível adicional, até que console.groupEnd () seja chamado
  • groupCollapsed () -> Cria um novo grupo inline no console. No entanto, o novo grupo é criado colapsado. O usuário precisará usar o botão de divulgação para expandi-lo
  • groupEnd () -> Sai do grupo inline atual no console
  • info () -> Saída de uma mensagem informativa para o console
  • log () -> Sai uma mensagem para o console
  • table () -> Exibe dados tabulares como uma tabela
  • time () -> Inicia um temporizador (pode seguir o tempo que leva uma operação)
  • timeEnd () -> Pára um temporizador que foi iniciado anteriormente por console.time ()
  • trace () -> Emite um rastreamento de pilha para o console
  • warn () -> Saída de uma mensagem de aviso para o console
  1. Storage

Storage objeto método:

  • chave (n) -> Retorna o nome da nth chave no armazenamento
  • getItem (keyname) -> Retorna o valor do nome da chave especificada
  • setItem (keyname, value) -> Adiciona essa chave ao armazenamento, ou atualiza o valor dessa chave se já existe
  • removeItem (keyname) -> Remove essa chave do armazenamento
  • clear () -> Vazio toda a chave do armazenamento

API de armazenamento na Web:

  • window.localStorage -> Permite salvar pares de chaves / valores em um navegador da Web. Armazena os dados sem data de validade
  • window.sessionStorage -> Permite salvar pares de chaves / valores em um navegador da Web. Armazena os dados para uma sessão
  1. Hoisting

Comportamento padrão de mover todas as declarações para o topo do escopo atual

Para evitar erros, sempre declare todas as variáveis no início de cada escopo

  1. Strict Mode

Sintaxe ruim em erros reais

Mais fácil de escrever JavaScript seguro

Precisa ser declarado no inicio do codigo

  1. JavaScript Style Guide e Coding Conventions

Orientações de estilo para programação

Segurança de código

  1. Best Practices

Evite as variáveis globais

Variáveis de declarações no topo

Nunca Declare Number, String ou Objetos Booleanos

Não use novo Object()

Use === Comparação

Usar Padrões de Parâmetros

Encerre seus switchs com defaults

Evite usar eval()

  1. Performasse

Reduza a atividade em Loops

Reduzir o acesso DOM

Reduzir o tamanho do DOM

Evite variáveis desnecessárias

Atrasar JavaScript carregando

Evite usar with

  1. Reserved Words

64 Palavras reservadas:

  • abstract, arguments, await, boolean, break, byte, case, catch, char, class, const, continue, debugger, default, delete, do, double, else, enum, eval, finally, float, for, function, goto, if, implements, import, in, instanceof, int, interface, let, long, native, new, null, package, private, protected, public, return, short, static, super, switch, synchronized, this, throw, throws, transient, true, try, typeof, var, void, volatile, while, with e yield

16 Palavras reservadas removidas:

  • abstract, boolean, byte, char, double, final, float, goto, int, long, native, short, synchronized, throws, transient e volatile

20 Objetos, propriedades e métodos:

  • Array, Date, eval, function, hasOwnProperty, Infinity, isFinite, isNaN, isPrototypeOf, length, Math, NaN, name, Number, Object, prototype, String, toString, undefined e valueOf

6 Palavras reservadas de Java:

  • getClass, java, JavaArray, javaClass, JavaObject e JavaPackage

85 Outras palavras reservadas:

  • alert, all, anchor, anchors, area, assign, blur, button, checkbox, clearInterval, clearTimeout, clientInformation, close, closed, confirm, constructor, crypto, decodeURI, decodeURIComponent, defaultStatus, document, element, elements, embed, embeds, encodeURI, encodeURIComponent, escape, event, fileUpload, focus, form, forms, frame, innerHeight, innerWidth, layer, layers, link, location, mimeTypes, navigate, navigator, frames, frameRate, hidden, history, image, images, offscreenBuffering, open, opener, option, outerHeight, outerWidth, packages, pageXOffset, pageYOffset, parent, parseFloat, parseInt, password, pkcs11, plugin, prompt, propertyIsEnum, radio, reset, screenX, screenY, scroll, secure, select, self, setInterval, setTimeout, status, submit, taint, text, textarea, top, unescape, untaint e window

12 Manipuladores de eventos HTML:

  • onblur, onclick, onerror, onfocus, onkeydown, onkeypress, onkeyup, onmouseover, onload, onmouseup, onmousedown e onsubmit
  1. Versões

JavaScript é a linguagem e EcmaScript é a padronização.

Edições do ECMAScript:

  • 1997 - ECMAScript 1 - Primeira edição
  • 1998 - ECMAScript 2 - Somente mudanças editoriais
  • 1999 - ECMAScript 3 - Adicionado expressões regulares e try/catch
  • 1999 - ECMAScript 4 - Nunca foi lançado
  • 2009 - ECMAScript 5 - Adicionado "strict mode" e suporte JSON
  • 2011- ECMAScript 5.1 - Alterações editoriais
  • 2015 - ECMAScript 6 - Adicionado classes e modules
  • 2016 - ECMAScript 7 - Adicionado operador exponencial (**) e Array.prototype.includes

Suporte de navegadores:

  • O ECMAScript 3 é totalmente suportado em todos os navegadores
  • O ECMAScript 5 é totalmente suportado em todos os navegadores modernos
  • ECMAScript 6 é parcialmente suportado em todos os navegadores modernos
  • ECMAScript 7 é mal suportado em todos os navegadores
  1. JSON

JSON is a format for storing and transporting data

JavaScript Object Notation

  1. Formulários

Atributos de entrada em HTML:

  • disabled - Especifica que o elemento de entrada deve ser desativado
  • max - Especifica o valor máximo de um elemento de entrada
  • min - Especifica o valor mínimo de um elemento de entrada
  • pattern - Especifica o padrão de valor de um elemento de entrada
  • required - Especifica que o campo de entrada requer um elemento
  • type - Especifica o tipo de um elemento de entrada

CSS pseudo selectors:

  • :disabled - Seleciona elementos de entrada com o atributo "desativado" especificado
  • :invalid - Seleciona elementos de entrada com valores inválidos
  • :optional - Seleciona elementos de entrada sem atributo "obrigatório" especificado
  • :required - Seleciona elementos de entrada com o atributo "necessário" especificado
  • :valid - Seleciona elementos de entrada com valores válidos

Validação de restrição DOM Methods:

  • checkValidity () - Retorna verdadeiro se um elemento de entrada contiver dados válidos.
  • setCustomValidity () - Define a propriedade validationMessage de um elemento de entrada.

Validação de restrição Propriedades do DOM:

  • validade - Contém propriedades booleanas relacionadas à validade de um elemento de entrada
  • validationMessage - Contém a mensagem que um navegador exibirá quando a validade for falsa
  • willValidate - Indica se um elemento de entrada será validado
  1. Objetos

Quase "tudo" é um objeto, objetos são variáveis contendo variáveis:

  • Booleanos podem ser objetos (se definidos com a nova palavra-chave)
  • Os números podem ser objetos (se definidos com a nova palavra-chave)
  • As strings podem ser objetos (se definido com a nova palavra-chave)
  • As datas são sempre objetos
  • As matemáticas são sempre objetos
  • Expressões regulares são sempre objetos
  • Arrays são sempre objetos
  • As funções são sempre objetos
  • Objetos são sempre objetos

Objeto literal - você define e cria um objeto em uma declaração

3 maneiras de acessar propriedades:

  • objectName.property
  • objectName["property"]
  • objectName[expression]

delete - deleta a propriedade

this - acessar atributo e métodos dentro de objetos

Atributos são variáveis e métodos são funções

maneira de acessar método:

  • objectName.methodName()

new - construir um novo objeto

Litérais vs objectos:

  • array[] x new Arra()
  • pattern () x new RegExp()
  • function(){} x new Function()
  • object{} x new Object()

prototype - São usadas para adicionar atributos e métodos de fora do objeto

  1. Funções

Função declarada:

  • function functionName(parameters){
    code to be executed
    }

Função expressiva:

  • var x = function (a, b) {return a * b};

Função anonima - Sem um nome

Função hoisting - Comportamento padrão das declarações móveis no topo do escopo atual

Auto-invocação ou IIFE - É invocado automaticamente, sem ser chamado

  • (function () {
    var x = "Hello!!";
    })();

Funções podem ser usadas como valor

toString() - Método retorna a função como uma string

parâmetros - São os nomes listados na definição da função
argumentos - Os valores reais são passados para (e recebidos por) a função

call, apply ou bind - Métodos que toda função em JavaScript possui nativamente implementada

call - Método de funções capaz de alterar o valor this, o primeiro parâmetro que recebe é o valor de this que que será atribuído à função e os demais parâmetros são os parâmetros da função que invoca o método Call

apply - Exatamente como o método Call, porém seu segundo parâmetro recebe um Array ou Array-like dos parâmetros da função

bind - Não executa a função, mas retorna uma outra, altera o this ou alterar o número de parâmetros de uma função

Closures - Funções definidas dentro de um "contexto léxico". Por exemplo aumentar a fonte do site

  1. DOM

Modelo de objeto padrão e interface de programação para HTML

3 Maneiras de encontrar elementos HTML

  • document.getElementById(id) - Pega o id de um elemento
  • document.getElementsByTagName(name) - Pega o tag name
  • document.getElementsByClassName(name) - Pega a classe name

4 Maneiras de alterar elementos HTML:

  • element.innerHTML = novo conteúdo html - Muda o HTML interno de um elemento
  • element.attribute = new value - Muda o valor do atributo de um elemento HTML
  • element.setAttribute (atributo, valor) - Alterar o valor do atributo de um elemento HTML
  • element.style.property = new style - Muda o estilo de um elemento HTML

5 Maneiras de adicionar e excluir elementos:

  • document.createElement (elemento) - Crie um elemento HTML
  • document.removeChild (elemento) - Remove um elemento HTML
  • document.appendChild (elemento) - Adicionar um elemento HTML
  • document.replaceChild (elemento) - Substitua um elemento HTML
  • document.write (texto) - Escreva no fluxo de saída HTML

Adicionando manipuladores de eventos:

  • document.getElementById(id).onclick = function(){code} Adding event handler code to an onclick event

24 Maneiras de como encontrar objetos HTML:

  • document.anchors - Retorna todos os <a> elementos que possuem um atributo de nome
  • document.baseURI - Retorna o URI de base absoluta do documento
  • document.body - Retorna o elemento <body>
  • document.cookie - Retorna o cookie do documento
  • document.doctype - Retorna o documento do documento
  • document.documentElement - Retorna o elemento <html>
  • document.documentMode - Retorna o modo usado pelo navegador
  • document.documentURI - Retorna o URI do documento
  • document.domain - Retorna o nome de domínio do servidor de documentos
  • document.domConfig - Obsoleto. Retorna a configuração do DOM
  • document.embeds - Retorna todos os elementos <embed>
  • document.forms - Retorna todos os elementos <form>
  • document.head - Retorna o elemento <head>
  • document.images - Retorna todos os elementos <img>
  • document.implementation - Retorna a implementação do DOM
  • document.inputEncoding - Retorna a codificação do documento (conjunto de caracteres)
  • document.lastModified - Retorna a data e hora em que o documento foi atualizado
  • document.links - Retorna todos os elementos <area> e <a> que possuem um atributo href
  • document.readyState - Retorna o status (carregando) do documento
  • document.referrer - Retorna o URI do referente (o documento de ligação)
  • document.scripts - Retorna todos os elementos <script>
  • document.strictErrorChecking - Retorna se a verificação de erros for aplicada
  • document.title - Retorna o elemento <title>
  • document.URL - Retorna o URL completo do documento
  1. BOM

Browser Object Model

Propriedades, métodos, navegação, tela, histórico e localização

  1. AJAX

Asynchronous JavaScript And XML

Combinação de XMLHttpRequest object, JavaScript e HTML DOM