Duvida sobre estrutura de return function

[luiz monteiro 0]

Bom dia.

Estava lendo alguns artigos sobre javascript e me deparei com essa estrutura

 

const debounce = function(func, wait, immediate)
        {
            let timeout;

            return function(...args)
            {
                const context = this;
                const later = function()
                {
                    timeout = null;

                    if (!immediate) func.apply(context, args);
                };

                const callNow = immediate && !timeout;

                clearTimeout(timeout);

                timeout = setTimeout(later, wait);

                if (callNow) func.apply(context, args);
            };
        };

 

Minha duvida é nesse ponto return function(...args), o que significa e qual a finalidade dos três pontos antes do args?

 

Agradeço desde já.

[Matheus Tavares 167]

Olá!

 

Isso chama-se Rest Parameters e serve para agrupar (em um array) um conjunto indeterminado e indefinido de parâmetros em uma variável para ser utilizado dentro da função.

 

Um exemplo bem simples:

function teste( ...args ) {
    console.log( args );
}

// Chamamos a função enviando alguns parâmetros de teste
teste( 'string', 2, 3.5, 'outra string' );

// Retorno:
Array(4) [ "string", 2, 3.5, "outra string" ]

[Matheus Tavares 167]

Ops... me dei conta após postar que eu não respondi inteiramente sua pergunta. Perdoe minha falta de atenção.

 

Ao invés de editar o post anterior, vou complementar: o ponto principal da sua dúvida deve estar girando em torno do retorno de uma função, mas não é tão difícil quanto parece.

 

Imagine uma função qualquer, como a do meu exemplo acima. Você chama ela e ela geralmente retorna algum valor primitivo ou objeto.

No caso a função debounce, que é muito utilizada no JS, junto com a throttle, com a implementação que você postou faz um setup e retorna uma função para ser a substituta da sua função original.

 

O que quero dizer é que quando você chama a debounce, você envia a função que você quer aplicar o algoritmo de "atraso" da debounce junto à quantidade de tempo desejada e a função lhe retorna a nova função que você deve passar a chamar, ou seja, uma função "infectada".

 

Como diria Linus, "Talk is cheap, show me the code". Então vamos à prática com um exemplo bobo, mas que deve servir:

// Funcao original
function numAleatorio( min, max ) {
    return parseInt( Math.random() * ( max - min ) + min );
}

// Essa funcao pega uma função genérica que retorne um inteiro e soma 10 ao seu resultado
// Simples, bobo, mas eficaz e reutilizável
function adiciona10AoRetorno( umaFuncao ) {
    return function( ...args ) {
        return umaFuncao( ...args ) + 10;
    }
}

// Agora criamos uma função infectada:
// Perceba que não executamos a função numAleatorio, senão teríamos mandado numAleatorio()
// Enviamos apenas a referência dela, para ser utilizada posteriormente
const aleatorioMais10 = adiciona10AoRetorno( numAleatorio );

// Agora chamamos sempre que quiser e o número sempre será MODIFICADO com a soma por 10:
// Nesse exemplo enviamos minimo como 50 e maximo como 60,
// mas o número retornado sempre fica entre 60 e 70
console.log( aleatorioMais10( 50, 60 ) );

 

No caso da debounce, você envia a função e depois fica com uma "debouncedMinhaFuncao", que é a nova função, infectada com o comportamento provido por debounce.

 

Espero ter ajudado :)

[luiz monteiro 0]

Boa noite.

Muito obrigado.

Na primeira parte já deu para entender.

Mas valeu pelo seu esforço em detalhar mais.

Abraço.