Mantenha esse glossário JavaScript salvo para acessar quando houver dúvidas em variáveis, métodos, strings e mais.
Variáveis JavaScript
- var: É a variável mais usada. Pode ser reatribuída, mas é acessada apenas dentro de uma função, alcançando o escopo da função. Variáveis definidas com var são movidas para o topo quando o código é executado;
- const: não podem ser reatribuídas e não acessíveis antes de aparecerem no código; têm alcance de escopo do bloco;
-
let: Semelhante à const, pode ter escopo de bloco. A variável let pode ser reatribuída, mas não declarada novamente.
Tipos de dados
Números:
var age = 33
Variáveis:
var a
Strings:
var a = "Sachin"
Operações:
var b = 4 + 5 + 6
Booleano:
var a = true | var b = false
Números constantes:
const PI = 3.14
-
Objetos:
var fullName = {firstName:"Sachin", lastName: "Samal"}
Objetos
Abaixo um exemplo simples. Este objeto descreve a variavel car
e inclui chaves como marca, modelo e ano
(esses são os nomes das propriedades do objeto). Cada propriedade tem um valor, como Volkswagen
, Fusca
e 1972
.
var carro = {
marca: 'Volkswagen', //Propriedade(1) marca
modelo: 'Fusca', //Propriedade(2) modelo
ano: 2022 //Propriedade(3) ano
};
Um objeto JavaScript é uma coleção de propriedades e funciona como um método.
Operadores de comparação
==
: É igual a
===
: É igual ao valor e igual ao tipo
!=
: Não é igual
!==
: Não é igual ao valor e não é igual ao tipo
>
: É maior que
<
: É menor que
>=
: É maior que ou igual a
<=
: É menor que ou igual a
?
: operador ternário
Operadores lógicos
&&
: E Lógico
||
: OU lógico
!
: NÃO Lógico
Dados de saída
alert()
: Dados de saída em uma caixa de alerta na janela do navegador;
confirm()
: Abra uma caixa de diálogo sim/não e retorne verdadeiro/falso dependendo do clique do usuário;
console.log()
: Grava informações no console do navegador. Bom para depuração;
document.write()
: Gravar diretamente no documento HTML
prompt()
: Crie uma caixa de diálogo para entrada do usuário.
Métodos de Array
Arrays em JavaScript são usados para armazenar vários valores em uma única variável.
var carros = [
"Fusca",
"Corcel",
"Opala"
];
// Cada carro é um valor do array "carros"
Você acessa o valor de um array consultando um número de índice:
var nome = carros[0];
//Essa declaração acessa o valor do
primeiro elemento em carros (Fusca),
que se encontra no índice 0 do array.
Obs: [0] é o primeiro elemento em um Array. [1] é o segundo. Os índices do Array começam com 0.
concat()
: Junte vários arrays em um
indexOf()
: Retorna o valor primitivo do objeto especificado
join()
: Combina elementos de um array em uma única string e retorna a string
lastIndexOf()
: Dê a última posição em que um determinado elemento aparece em uma matriz
pop()
: Remove o último elemento de um array
push()
: Adicione um novo elemento no final
reverse()
: Classifica os elementos em ordem decrescente
shift()
: Remove o primeiro elemento de um array
slice()
: Puxe uma cópia de uma parte de um array para um novo array
splice()
: Adicione posições e elementos de uma maneira especificada
toString()
: Converter elementos em strings
unshift()
: Adiciona um novo elemento ao início
valueOf()
: Retorna a primeira posição em que um determinado elemento aparece em uma matriz
Loops JavaScript
Execute tarefas específicas repetidamente em ciclos sob determinadas condições.
for ( inicializador do ciclo; condição para o ciclo; execute ao final do ciclo) {
// o que fazer durante o loop
}
for
: cria um loop condicional
while
: Configura condições sob as quais um loop é executado pelo menos uma vez, desde que a condição especificada seja avaliada como verdadeira
do... while
: Semelhante ao whileloop, ele é executado pelo menos uma vez e realiza uma verificação no final para ver se a condição foi atendida. Se for, então ele executa novamente
break
: Parar e sair do ciclo em determinadas condições
continue
: Pule partes do ciclo se certas condições forem atendidas
Declarações if-else
Uma instrução if executa o código entre colchetes enquanto a condição entre parênteses for verdadeira. Caso contrário, uma instrução opcional else é executada.
if ( condição ) {
// faça isso se a condição for atendida
} else {
// faça isso se a condição não for atendida
};
Strings
Métodos de Strings
charAt()
: Retorna um caractere em uma posição especificada dentro de uma string
charCodeAt()
: Dê o Unicode do caractere nessa posição
concat()
: Concatenar (unir) duas ou mais strings em uma
fromCharCode()
: Retorna uma string criada a partir da sequência especificada de unidades de código UTF-16
indexOf()
: Fornece a posição da primeira ocorrência de um texto especificado dentro de uma string
lastIndexOf()
: O mesmo que indexOf() mas com a última ocorrência, pesquisando para trás
match()
: Recupere as correspondências de uma string em um padrão de pesquisa
replace()
: Localizar e substituir o texto especificado em uma string
search()
: Executa uma pesquisa por um texto correspondente e retorna sua posição
slice()
: Extraia uma seção de uma string e a retorne como uma nova string
split()
: Dividir um objeto string em uma matriz de strings em uma posição especificada
substr()
: Extraia uma substring dependente de um número especificado de caracteres, semelhante a slice()
substring()
: Não pode aceitar índices negativos, também semelhantes a slice()
toLowerCase()
: Converter strings para minúsculas
toUpperCase()
: Converter strings para maiúsculas
valueOf()
: Retorna o valor primitivo (que não possui propriedades ou métodos) de um objeto string
Métodos numéricos
toExponential()
: Retorna uma string com um número arredondado escrito como notação exponencial
toFixed()
: Retorna a string de um número com um número especificado de decimais
toPrecision()
: String de um número escrito com um comprimento especificado
toString()
: Retorna um número como uma string
valueOf()
: Retorna um número como um número
Métodos matemáticos
abs(a)
: Retorna o valor absoluto (positivo) de a
ceil(a)
: Valor de a arredondado para o inteiro mais próximo
exp(a)
: Valor de E^x retorna ex, onde x é o argumento, e E é a Constante de Euler, a base dos logaritmos naturais
floor(a)
: Valor de a arredondado para o número inteiro mais próximo
log(a)
: Logaritmo natural (base E) de a
max(a,b,c…,z)
: Retorna o número com o maior valor
min(a,b,c…,z)
: Retorna o número com o menor valor
random()
: Retorna um número aleatório entre 0 e 1
round(a)
: Valor de aarredondado para o número inteiro mais próximo
sqrt(a)
: Raiz quadrada de a
Lidando com datas em JavaScript
Definir datas
Date()
: Crie um novo objeto de data com a data e hora atuais
Date(2022, 6, 22, 4, 22, 11, 0)
: crie um objeto de data personalizado. Os números representam ano, mês, dia, hora, minutos, segundos, milissegundos. Você pode omitir qualquer coisa, exceto ano e mês.
Date("2022-07-29")
: Declaração de data como uma string
Extrair valores de data e hora
getDate()
: Dia do mês como um número (1-31)
getDay()
: Dia da semana como um número (0-6)
getFullYear()
: Ano como um número de quatro dígitos (aaaa)
getHours()
: Hora (0-23)
getMilliseconds()
: Milissegundos (0-999)
getMinutes()
: Minuto (0-59)
getMonth()
: Mês como um número (0-11)
getSeconds()
: Segundo (0-59)
getTime()
: Milissegundos desde 1º de janeiro de 1970
getUTCDate()
: Dia (data) do mês na data especificada de acordo com a hora universal (também disponível para dia, mês, ano completo, horas, minutos, etc.)
parse
: analisa uma representação de string de uma data e retorna o número de milissegundos desde 1º de janeiro de 1970
Definir parte de uma data
setDate()
: Defina o dia como um número (1-31)
setFullYear()
: Defina o ano (opcionalmente mês e dia)
setHours()
: Defina a hora (0-23)
setMilliseconds()
: Definir milissegundos (0-999)
setMinutes()
: Defina os minutos (0-59)
setMonth()
: Defina o mês (0-11)
setSeconds()
: Defina os segundos (0-59)
setTime()
: Defina a hora (milissegundos desde 1º de janeiro de 1970)
setUTCDate()
: Defina o dia do mês para uma data especificada de acordo com a hora universal (também disponível para dia, mês, ano completo, horas, minutos, etc.)
Modo Dom
Métodos de nós
appendChild()
: Adicionar um novo nó filho a um elemento como o último nó filho
cloneNode()
: Clonar um elemento HTML
compareDocumentPosition()
: Comparar a posição do documento de dois elementos
getFeature()
: Retorna um objeto que implementa as APIs de um recurso especificado
hasAttributes()
: Retorna true se um elemento tiver algum atributo, caso contrário, false
hasChildNodes()
: Retorna true se um elemento tiver nós filhos, caso contrário, false
insertBefore()
: insira um novo nó filho antes de um nó filho existente especificado
isDefaultNamespace()
: Retorna true se o namespaceURI especificado for o padrão, caso contrário, false
isEqualNode()
: Verifique se dois elementos são iguais
isSameNode()
: Verifique se dois elementos são o mesmo nó
isSupported()
: Retorna true se um recurso especificado for suportado no elemento
lookupNamespaceURI()
: Retorna o namespaceURI associado a um determinado nó
normalize()
: Une nós de texto adjacentes e remove nós de texto vazios em um elemento
removeChild()
: Remova um nó filho de um elemento
replaceChild()
: Substitui um nó filho em um elemento
Métodos de elemento
getAttribute()
: Retorna o valor de atributo especificado de um nó de elemento
getAttributeNS()
: Retorna o valor da string do atributo com o namespace e o nome especificados
getAttributeNode()
: Obtenha o nó de atributo especificado
getAttributeNodeNS()
: Retorna o nó de atributo para o atributo com o namespace e o nome fornecidos
getElementsByTagName()
: Fornece uma coleção de todos os elementos filho com o nome de tag especificado
getElementsByTagNameNS()
: Retorna um HTMLCollection ativo de elementos com um determinado nome de tag pertencente ao namespace fornecido
hasAttribute()
: Retorna true se um elemento tiver algum atributo, caso contrário, false
hasAttributeNS()
: Fornece um valor verdadeiro/falso indicando se o elemento atual em um determinado namespace tem o atributo especificado
removeAttribute()
: Remove um atributo especificado de um elemento
lookupPrefix()
: Retorna um DOMString contendo o prefixo para um dado namespaceURI, se presente
removeAttributeNS()
: remove o atributo especificado de um elemento dentro de um determinado namespace
removeAttributeNode()
: Retire um nó de atributo especificado e retorne o nó removido
setAttribute()
: Defina ou altere o atributo especificado para um valor especificado
setAttributeNS()
: adiciona um novo atributo ou altera o valor de um atributo com o namespace e o nome fornecidos
setAttributeNode()
: Defina ou altere o nó de atributo especificado
setAttributeNodeNS()
: Adicionar um novo nó de atributo com namespace a um elemento
Eventos JavaScript
Mouse
onclick
: o usuário clica em um elemento
oncontextmenu
: o usuário clica com o botão direito do mouse em um elemento para abrir um menu de contexto
ondblclick
: o usuário clica duas vezes em um elemento
onmousedown
: O usuário pressiona um botão do mouse sobre um elemento
onmouseenter
: O ponteiro se move para um elemento
onmouseleave
: O ponteiro se move para fora de um elemento
onmousemove
: O ponteiro se move enquanto está sobre um elemento
onmouseover
: O ponteiro se move para um elemento ou um de seus filhos
setInterval()
: Chama uma função ou avalia uma expressão em
oninput
: entrada do usuário em um elemento
onmouseup
: O usuário libera um botão do mouse enquanto está sobre um elemento
onmouseout
: O usuário move o ponteiro do mouse para fora de um elemento ou de um de seus filhos
onerror
: Acontece quando ocorre um erro ao carregar um arquivo externo
onloadeddata
: Os dados de mídia são carregados
onloadedmetadata
: metadados (como dimensões e duração) são carregados
onloadstart
: O navegador começa a procurar a mídia especificada
onpause
: A mídia é pausada pelo usuário ou automaticamente
onplay
: A mídia é iniciada ou não está mais pausada
onplaying
: A mídia está sendo reproduzida após ter sido pausada ou interrompida para armazenamento em buffer
onprogress
: O navegador está em processo de download da mídia
onratechange
: Mudanças de velocidade de reprodução de mídia
onseeked
: O usuário termina de mover/pular para uma nova posição na mídia
onseeking
: O usuário começa a se mover/pular
onstalled
: O navegador tenta carregar a mídia, mas não está disponível
onsuspend
: O navegador não está carregando mídia intencionalmente
ontimeupdate
: A posição de reprodução mudou (por exemplo, devido ao avanço rápido)
onvolumechange
: O volume da mídia mudou (incluindo mudo)
onwaiting
: Mídia pausada, mas espera-se que seja retomada (por exemplo, armazenamento em buffer)
Traduzido e adaptado de: https://opens...t-glossary
Autor: Marcelo Schäffer Petry
https://marcelopetry.com
Top comments (0)