Esta revisão foi criada para a turma online: Todas em Tech on15 - Back-end, nesta aula do dia 15/05/2022 teremos os seguintes conteúdos:

• Funções;
• Objetos;
• Métodos de Array;
• Async/Await;
  • Try/catch;
• Seção de dúvidas síncronas;

Lilit Bandeira, é uma travesti paraibana residente em São Paulo, trabalha como Software Engineer no Nubank, ex-aluna e professora {reprograma} e professora também no minas programam;

• [email protected]
• LinkedIn
• GitHub

• Manter atenção nas explicações e codar nos momentos definidos;
• Enviar dúvidas no chat para as monitoras ajudarem;
• Levantar a mão sempre que desejar falar, o que pode ser feito a qualquer momento;
• Manter microfones desligados sempre que alguém estiver falando;
• As câmeras ligadas serão de grande apoio para mim!

• É um bloco de comandos a serem executados quando solicitado, através de uma chamada direta ou em decorrência de um evento;
  • Uma função é o menor bloco de execução/construção no JavaScript, um conjunto de instruções que executa uma tarefa ou calcula um valor;
  • Uma função quando é chamada, pausa a thread (script) para realizar seu processamento, depois retorna o valor final e continua a execução da linha de código na sequência;

• O método mais comum de criar uma função no JS consiste no uso da palavra reservada function;
• Em seguida nomeamos a função, é uma boa prática nomear com verbo para indicar a ação realizada pela função;
• () com a lista de argumentos, caso seja necessário, separados por vírgulaç
• {} definição do escopo que recebe a o código que será executado quando a função foi invocada;
• return é a indicação do que a função deve retornar, também interrompendo o a execução do trecho de código em que está inserida;

  
  // funcao sem argumentos

  function funcaoUm() {
    return console.log(`retorno da função que não recebe argumentos`)
  }

  // funcao com um único argumento

  function funcaoDois(argumento) {
    return console.log(`retorno da função que recebe um argumentos, neste caso foi ${argumento}`)
  }

  // funcao com mais de um argumento

  function funcaoTres(numeroUm, numeroDois) {
    let soma = numeroUm + numeroDois
    return console.log(`soma = ${soma}`)
  }

  funcaoUm();
  funcaoDois('reprograma');
  funcaoTres(2, 7);

  // funcao anonima

  let funcao4 = function () {
    return console.log('retorno da função anônima')
  } // muito utilizado quando vamos passar a função como parâmetro para outra função

  let soma = function(numero) {return numero * numero};
  console.log(soma(3))

• Uma sintaxe mais curta e moderna em relação a expressão function e podem substituir em quase todos os casos de forma a diminuir a complexidade de leitura em diversos casos;
• As arrow functions são geralmente anônimas, mas podem ser nomeadas* ou atribuidas a variáveis para que possam ser invocadas;
• Estas expressões de funções tem algumas limitações e são melhor utilizadas em funções que não sejam métodos e nem devem ser usadas como construtores;

  function somar(x, y) {
    return console.log(x + y)
  }

  // sintaxe () => {}
  let somar = (x, y) => console.log(x + y)
  // quando a execução da função ocupa apenas uma linha de código não há neessidade nem do uso do {} e nem do return, simplificando ainda mais a sintaxe

• A sintaxe das arrow functions é bastante comum em padrões funcionais como muito do que aprenderemos em métodos de arrays nas próximas aulas;

Um objeto é uma coleção de dados e/ou funcionalidades relacionadas (que geralmente consistem em diversas variáveis e funções — que são chamadas de propriedades e métodos quando estão dentro de objetos). (MDN) Os objetos são formados por chave e valor

const professora = new Object()
  professora.nome = "Lilit"
  professora.sobrenome = "Bandeira"
  professora.cidade = "São Paulo"

const aluna = {
  nome: { primeiro: "Gabriela", segundo: "Lemos" },
  idade: 20,
  cidade: "São Paulo",
  interesses: ["música", "animes"],
  saudacao: () => console.log("olá meninas"),

};

console.log(aluna.nome.primeiro);
aluna.saudacao();

console.log(aluna["nome"]["primeiro"]);
console.log(aluna["idade"]);
console.log(aluna["interesses"][0]);

const { idade, saudacao } = aluna;

const alunas = ["Lilit, Analu, Beatriz, Simara"]
const cidades = new Array('Recife', 'São Paulo', 'Manaus')
const cursos = "frontend backend".split(' ')
const tecnologias = Array.of('HTML', 'CSS', JS)

console.log(alunas[1])

arrays para exemplos:

const frutas = ['🍎', '🍇', '🍎', '🍌', '🍎', '🥑']

find:

const encontrarPrimeiro = frutas.find(element => element == 🍇')
console.log(encontrarPrimeiro) // retorno 🍇

filter:

const filtrarPor = frutas.filter(element => element == "🍎")
console.log(filtrarPor) // retorno ['🍎', '🍎', '🍎']

map:

const executarTodos = frutas.map(element => element = "🍇")
console.log(executarTodos) // retorno  ['🍇', '🍇', '🍇', '🍇', '🍇', '🍇']

forEach:

const verTodos = frutas.forEach(element => console.log(element))
console.log(verTodos) // retorno  🍎🍇🍎🍌🍎🥑

• As palavra-chaves async e await atuam como um 'açúcar sintático' em cima de promises, faciltando a visualização e tornando a leitura do código assíncrono mais próxima do código síncrono;
• Toda função que recebe o async se torna uma função assíncrona, que passa a retornar uma promise ao invés de retornar um valor diretamente, como uma promise o retorno desta função pode ser tratado com um then() normalmente;
• Uma função assíncrona espera a possibilidade de a palavra-chave await ser usada para invocar código assíncrono;
• await indica que o JavaScript deve esperar o retorno de uma promise para continuar a execução, importante usar apenas quando necessário tratar respostas de uma promise para não paralizar o fluxo, quando usado da maneira correta não altera a performance da aplicação;
• o await só funciona dentro de funções assíncronas e é colocada na frente de qualquer função que retorne promise para pausar o código até que a promise seja resolvida, retornando o valor resultante;
• Não precisa de funções para sincronizar os resultados;
• Outro método importante da promise é o Promisse.all() que recebe uma array de funções assincronas independentes entre si, evitando o uso de awaits que não sejam necessários;
• Facilita o tratamento de erros seja com menor encadeamento do .then() ou ainda com o uso de try/catch;

• É usado para marcar um bloco que será testado (try) e especifica uma ação para que uma possível exceção(erro) seja capturada(catch);
• Ao usar o try é criado um bloco de código protegido, que caso ocorra algum erro neste bloco, a execução é desviada para o catch(), desta forma a aplicação não será quebrada e o erro poderá ser tratado e o código segue sua execução;
• O catch() é executado somente quando há alguma exceção no bloco try, caso contrário ele será ignorado, o argumento recebido pelo catch é a exceção ocorrida no bloco try e costuma ser chamada de err/error;

• Momento aberto para dúvidas específicas e sobre todo o assunto de JS;

• Ainda no domingo 15/05/2022 os exercícios serão adicionados neste espaço do repositório e no classroom com todas as explicações de como realizá-los, além de comentários com dicas. Os exercícios não são entregáveis e devem ser utilizdos para reforçar o aprendizado