Javascript Assíncrono - Entenda o que são Callbacks

Javascript é uma linguagem de programação leve, interpretada e com inúmeras aplicações, com ela podemos desenvolver desde páginas web até sistemas complexos. Ter o domínio e entendimento do seu funcionamento principal lhe trará diversas vantagens no desenvolvimento das suas soluções e também ter o conhecimento necessário para explorar diversas funcionalidades avançadas.
Com base nisso criaremos uma série de artigos para explicar como funciona a parte assíncrona do Javascript, começando por esse primeiro artigo sobre Callbacks.

콜백이 필요합니까?

Se traduzirmos Callback será algo como chamada de retorno, o que soa um pouco complicado né? vamos tentar melhorar um pouco esse entendimento:

Callback é uma função que será executada quando algum evento ocorrer.

아주두? 아니오?

No Javascript, Callback é uma função passada como argumento para outra função, que será executada posteriormente, mais abaixo traremos exemplo no qual ficará mais fácil de entender seu uso.

Javascript 콜백이 중요하지 않습니까?

O Javascript, e outras linguagens de programação, os codigos são executados de forma sequencial, mas haverá casos que essa execução não será dessa maneira, mas sim de forma assíncrona, ou seja, não esperar a finalização de um fluxo para executar o próximo.

예시

콜백의 예를 확인하려면 다음을 수행하십시오.

Função abaixo imprime no console o valor que ela recebe por paraâmetro. 단순함은 콘솔이 없는 경우에만 가능하며 그래픽과 색상이 다를 수 있습니다.

function imprimeNoConsoleOResultado(valor) {
  console.log(`==> Resultado: ${valor} <===`);
}

Essa outra função abaixo executa um calculo com os valores recebidos por parâmetro, o resultado desse calculo será repassado para o Callback, que é a função recebida no terceiro parâmetro da função calcula .

function calcula(valor1, valor2, exibirResultado) {
  const resultado = valor1 + valor2;
  exibirResultado(resultado);
}

콜백imprimeNoConsoleOResultado:

calcula(2, 2, imprimeNoConsoleOResultado);

O que será exibido: ==> Resultado: 4 <===
Digamos que queremos criar uma função de Callback de exibição mais complexa, que desenha um canvas com o resultado, segue exemplo abaixo:

function imprimeResultadoComCanvas(valor) {
  const canvas = document.createElement("canvas");
  const ctx = canvas.getContext("2d");
  ctx.font = "30px Arial";
  ctx.strokeText(`Resultado: ${valor}`, 5, 50);
  document.body.appendChild(canvas);
}

콜백 또는 콜백imprimeResultadoComCanvas을 사용하여 캔버스에서 결과를 렌더링할 수 있습니다.

calcula(2, 2, imprimeResultadoComCanvas);

Você poderá conferir o resultado por aqui: https://jsfiddle.net/h5w2cn8f/19/

com esses는 função에 대한 vimos의 예입니다calcula realiza o calculo e o resultado ela repassa para o Callback, que por sua vez manipula de acordo com a sua implementação.

Objetos de Primeira Classe

O Javascript tem recursos de programação funcional graças às suas funções serem de primeira classes, ou seja, todas funções do Javascript são tratadas como objetos, como valores, podemos guardá-las dentro de variáveis ​​e elas também podem ser retornadas através de funções, isso abre um leque grande de utilização como por exemplo nos padrões de projeto como High Order Functions.

결론

Callback é um recurso muito importante e muito utilizado no Javascript, esse entendimento nos ajudará no entendimento dos próximos artigos sobre processamento assíncrono.

원래 내 블로그carlosvaz.com.br에 게시되었습니다.

참조

https://developer.mozilla.org/pt-BR/docs/Glossary/Callback_function

https://blog.betrybe.com/tecnologia/callback/

https://www.freecodecamp.org/portuguese/news/funcoes-de-callback-em-javascript-o-que-sao-e-como-usa-las/