String:

• Não permite cálculos matemáticos.
• Importante: String sempre são usadas dentro de aspas simples (' ') ou duplas (" ").

"Nike" é uma string.

Number:

• Permite cálculos (somar, subtrair, multiplicar).
• Importante: sempre é usada fora das aspas

4 é um number.

'O aluno Leonardo de 19 anos tirou 7 na prova'

`O aluno ${aluno} de ${idade} anos tirou ${nota} na prova`

Basta colocar a variável dentro de ${} para mencionar ela,e colocar crases `` no lugar das aspas em volta

var nome = prompt("Qual seu
 nome?")
console.log(nome)
var idade = prompt(`Olá 
${nome}, Quantos anos
você tem?`)
console.log(idade)
alert("Que legal!")
document.write(`Seu nome é 
<strong>${nome}</strong>;
e você tem ${idade} anos. 
`)
document.write(`Seu nome tem 
${nome.length} letras. 
`)
document.write('Para contar a
 quantidade de letras
existentes no nome considere 
usar ${variavel.length}
          

Exemplo 1:

      let valor = 45.2
      let resultado = valor.tofixed(2)
      console.log(resultado)
      saída do console = 45.20
            

Exemplo 2

=

Usando Replace:

Mais simples de converter

            let numero = "45.20"
            let numeroComVirgula = numero.replace('.' , ',')
            resultado: 45,20
          

Usando toLocaleString()

Este é o método recomendado porque ele lida automaticamente com o ponto decimal, separadores de milhar (se houver) e arredondamento, tudo de acordo com as regras do local (pt-BR).

• O método toLocaleString com 'pt-BR' garante:
• 1. Vírgula como separador decimal.
• 2. Ponto como separador de milhar.
• 3. Arredondamento (se não especificarmos o máximo de casas).

            let numero = 12345.789
            let numeroBRL = numero.toLocaleString('pt-BR',{
              minimumFractionDigits: 2,
              maximumFractionDigits: 2
            })
            

• Garante que o resultado terá, NO MÍNIMO, 2 casas decimais.
• Efeito: Se o número for '10', ele preenche para '10,00'.

• minimumFractionDigits: 2
• Garante que o resultado terá, NO MÁXIMO, 2 casas decimais.
• maximumFractionDigits: 2
• Efeito: Se o número for '123.456', ele arredonda para '123,46'.

• 5 + 2 = 7
• 5 - 2 = 3
• 5 * 2 = 10
• 5 / 2 = 2.5
• 5 % 2 = 1
• 5 ** 2 = 25

Como incremento funciona(++)

O uso do operador ++ é um atalho para a operação completa de auto atribuição de soma

Pré-incremento (++variável)

            let numero = 5;
          

'numero' é incrementado para 6 ANTES de ser usado no console.log

console.log(++numero);

Resultado no console: 6

Pós incremento

            let numero = 5;
          

'numero' é usado na operação com o valor 5 PRIMEIRO, e depois incrementado

console.log(numero++);  Resultado: 5

(Somente após usar o incremento o resultado irá mudar) resultado agora: 6

Somente após incrementar que ele adiciona,diferente do pré incremento que no mesmo momento em que adiciona ele já altera o valor

Resultado no console: 6

Os Operadores Relacionais (ou de Comparação) em JavaScript são usados para comparar dois valores (operandos) e determinar a relação entre eles.

1. Operadores de Maior, Menor, Maior ou Igual e Menor ou Igual

• Operador > Maior que
• Exemplo: 5 > 3
• Resultado: true
• 5 é maior que 3.
• Operador < Menor que
• Exemplo: 5 < 3
• Resultado: false
• 5 não é menor que 3.
• Operador>= Maior ou igual a
• Exemplo: 5 >= 5
• Resultado: true
• 5 é igual a 5.
• Operador<= Menor ou igual a
• 3 <= 5
• Resultado: true
• 3 é menor ou igual a 5.

2. Operadores de Igualdade e Desigualdade

É composto por dois pontos dentro de uma mesma expressão,eles são: ? :

Se chama ternário pois ele tem três partes.

• Teste
• ?
• true
• :
• false

Exemplo prático

• Média >=
• ?
• "Aprovado"
• :
• "Reprovado"

Resultado irá ser "aprovado" ou "reprovado", depende do teste lógico (da média) do primeiro quadro.

Selecionar um elemento HTML pela TAG

Selecionando a 3º tag p "Parágrafo 3"

Nesse caso tag

1. Primeiro criamos uma variável que irá ser o nome do elemento selecionado dentro do JS.
2. E junto dele selecionamos o documento 'document'.
3. após isso usamos o elemento 'getElementsByTagName' para selecionar a tagName e colocamos a tag dentro dos parenteses ( ),e nesse caso como temos mais de um elemento 'p' utilizamos um equivalente ao nth-child do CSS para selecionar qual dos elementos p será selecionado (os colchestes [ ] ).
• var p1 = document.getElementsByTagName('p')[2]

• variável
• 
• Documento
• 
• Seletor de TagName
• 
• Acesso por Posição (ou Índice)

As condições são o que permitem o código tomar decisões. Ela faz com que o programa execute dois caminhos dependendo se a situação é verdadeira ou falsa.

Condição simples:

Somente com if

            if(condição){
              true
            }
          

Condição padrão (com if &

Condições aninhadas

Para ir para o bloco2 o bloco1 deverá ser falso (executar o else do bloco1)

Exemplo prático:

              
          var idade = 67
          console.log(`Você tem ${idade} anos`)
            if (idade < 16){
              console.log('Não vota')
            }else if (idade > 18 || idade > 65){
                console.log('Voto opcional')
            }else {
                console.log('Voto obrigatório')
              }
            

Segundo exemplo:

          var agora = new Date()
            var hora = agora.getHours()
            var minuto = agora.getMinutes()
            console.log(`Agora são exatamente
             ${hora} horas e ${minuto}
              minutos.` )
          
            if (hora <= 4 || hora >= 18){
              console.log('Boa noite!')
            }else if(hora <=12){
              console.log('Bom dia')
            }else{
              console.log('Boa tarde')
            }
            

Dica: pegar hora exata do sistema variavel.getHours,pegar minuto variavel.getMinutes,...

Condição múltipla (switch)

Tem a possibilidade de varios valores fixos.

Switch serve para testar valores pontuais,valores inteiros e com caracteres/strings

          var day = new Date()
          var diaSem = day.getDay()
          
          
          
           
             0 = domingo
             1 = segunda
             2 = terça
             3 = quarta
             4 = quinta
             5 = sexta
             6 = sábado
             
           
          
          console.log(diaSem)
          
          switch(diaSem){
            case 0:
              console.log('Domingo')
              break
          
            case 1:
              console.log('Segunda')
              break
            case 2:
              console.log('Terça')
              break
            case 3:
              console.log('Quarta')
              break
            case 4:
              console.log('Quinta')
              break
            case 5:
              console.log('Sexta')
            case 6:
              console.log('Sabado')
              break
          
            default:
              console.log('[ERROR]
               Digite um dia válido')
              break
          }
            

Ver exemplos de if & else

Uma Expressão Regular é uma sequência de caracteres que define um padrão de busca.

São eles:

• Buscar: Encontrar a ocorrência de um padrão específico em um texto (string).
• Validar: Verificar se um texto corresponde a um formato exigido (ex: formato de e-mail, CPF, data).
• Substituir/Extrair: Trocar partes de um texto que correspondam ao padrão' ou extrair informações específicas.

'/\D+/g' O que essa expressão faz?

'/' e '/'
Delimitam o início e o fim da expressão.
'\D'
Corresponde a qualquer caractere que NÃO seja um dígito de 0 a 9. (É o oposto de \d, que corresponde a um dígito).
'+'
Significa "uma ou mais" ocorrências do item anterior (\D).
'g'
Significa que a busca deve ser Global, encontrando todas as ocorrências do padrão na string, e não parar após a primeira.

Em resumo, essa Regex busca por uma ou mais sequências de caracteres que não são números, em todo o texto.

Se você aplicar /\D+/g na string: "Minha idade e 30 anos e meu peso e 85 kg"

As correspondências (matches) que seriam encontradas são:

1. "Minha idade e"
2. "anos e meu peso e"
3. "kg"

Os números (30 e 85) seriam ignorados (não correspondidos), pois o padrão é explicitamente por não-dígitos.

Mais Exemplos de Expressões Regulares Comuns

• • Exemplo: user@exemplo.com
  • regex: /user/
  • Resultado: "user"
  • Encontra a sequência exata de caracteres "user".
• • Exemplo: banana e abacaxi
  • regex: /a/g
  • Resultado: ["a", "a", "a", "a", "a", "a"]
  • O flag g (global) encontra TODAS as letras 'a', não apenas a primeira.
• • Exemplo: Abacaxi
  • regex: /^A/
  • Resultado: ["A"]
  • O ^ âncora a busca no início da string.
• • Exemplo:Este é o fim
  • regex: /fim$/
  • Resultado:["fim"]
  • O $ âncora a busca no fim da string.

E existem muitas outros tipos de regex para estudar.

Um objeto é uma estrutura que representa algo com propriedades e comportamentos.

Métodos e Interpolação

              const user = {
                name: "Leonardo",
                message: function(){
          console.log(`Olá
          ${user.name}`) 
                } 
              } 
              user.message() 
               Saída: Olá Leonardo

          const user = {
            email:"João@email.com",
            age: 19,
            name: {
              firstName: "João",
              surname: "Silva",
            },
          
            address:{
              street: "Rua X",
              number: 23,
              city: "São Paulo",
              postal_code: "12345-123"
            },
            message: function (){
                console.log('Oi João')
            }
          }
          

            console.log(user.email)
            
            console.log(user.name.firstName)
            console.log(user.name.surname)
          
            
Acessando os valores das propriedades
            console.log(user.address.postal_code)
          

                  variável.message()
          

                const product = {
          name: "teclado",
          quantity: 100,
                }
                
                
Notação de Ponto
                console.log(product.quantity)
                 Saída: 100
                product.quantity = 90
                console.log(product.quantity)
                 Saída: 90
                
                
Notação de Colchetes
                product["quantity"] = 50
                console.log(product["quantity"])
                 Saída: 50
                
                
Outro exemplo de notação de colchetes
          console.log(user["email"])
          console.log(user["name"]["surname"])
          user["message"]()
                        Ver código completo
                

                Cria um objeto vazio.
                const obj = {}
                console.log(obj)
                console.log(typeof obj)
            

                const automovel = {
          yourName: "Leonardo",
          message: function(){
                console.log(`Olá
                ${this.yourName}`)
          }
                }
                automovel.message() 
                Saída: Olá Leonardo

                const automovel = {
          yourName: "Leonardo",
          message: () => {
                console.log(`Olá${this.yourName}`)
          }
                }
                automovel.message()
                Saída: Olá undefined

                
          const user = {
          id: 1,
          name: "Leonardo",
          address: {
                street: "Avenida Brasil",
                city: "São Paulo",
                geo: {
          latitude: 47.808,
          longitude: 17.5674,
                },
          },
          message: function(){
                console.log(`Olá, ${this.name}`)
          }
                }
                
                

undefined (sem erro!)

          let content = null
          console.log(content ?? "conteúdo padrão")
                

          const user = {
            name: "Leonardo",
            avatar: undefined
          }
          
          console.log(user.avatar ?? "default.png")