Callback Function with Delay in ECMAScript 2015

Functions in ECMAScript - Part 4

ECMAScript 6

Foreword: In this part of the series I explain callback function, and callback function with delay.

By: Chrysanthus Date Published: 14 Jul 2016

Introduction

This is part 4 of my series, Functions in ECMAScript. It is possible to have a callback function where the code you write is executed after some time the function is defined. In this part of the series I explain callback function, and callback function with delay. You should have read the previous parts of the series before coming here, as this is a continuation.

In an ECMAScript callback scheme, there are two functions: the main function and a smaller function, which is the callback function. In the body of the main function, certain values become arguments to the callback function. The callback function is actually executed when the main function is called. The body of the callback function is coded in the call of the main function. An argument for the callback function may be a scalar e.g. a string or it may be a collection, e.g. an array.

Callback without Delay
In this section I present a callback scheme without delay, so that you appreciate the meaning of callback, first. Read and try the following code:

<script type="text/ecmascript">

    function mainfn (variabl, cb)
        {
            var str= 'We are learning.';
            var colorArr = ['blue', 'green', 'red'];

            cb(str, colorArr);
        }

    mainfn('dummy', function (stri, arr)
        {
            alert(stri);
            alert(arr);
        });

</script>

The name of the callback function is cb. It is defined in the call of the main function. In the call of the main function, the argument, 'dummy' and its corresponding parameter, variabl are for the main function.

The callback function is defined in the call of the main function, but called in the definition of the main function. Above, the arguments of the callback function are developed inside the definition of the main function. The arguments are str and colorArr

The callback function can also be an arrow function. Read and try the following code:

<script type="text/ecmascript">

    function mainfn (variabl, cb)
        {
            var str= 'We are learning.';
            var colorArr = ['blue', 'green', 'red'];

            cb(str, colorArr);
        }

    mainfn('dummy', (stri, arr) =>
        {
            alert(stri);
            alert(arr);
        });

</script>

Note: you can have any name for callback function, not just cb, however, type the name without parentheses as a parameter to the main function definition, and use the same name in the call of the callback function within the definition of the main function.

Callback Function with Delay
Today, you have Node.js. Node.js is a library, which can be programmed to function as a web server. In Node.js the definition of a callback function is executed after a certain delay (time). The delay is in the definition of the main function, and not the definition of the callback function. Read and try the following code, which simulates a delay of 3 seconds (3000 milliseconds).

<script type="text/ecmascript">

    function mainfn (variabl, cb)
        {
            var str= 'We are learning.';
            var colorArr = ['blue', 'green', 'red'];

            window.setTimeout(cb(str, colorArr), 3000);
        }

    mainfn('dummy', (stri, arr) =>
        {
            alert(stri);
            alert(arr);
        });

</script>

The callback function is called in the definition of the main function but its body is executed (alert statements) after some time, in its definition (in the call of the main function). The callback function is defined in the call of the main function and not in the main function.

That is it for this part of the series.

Chrys

Broad Network

Related Articles

Callback Function with Delay in ECMAScript 2015

Functions in ECMAScript - Part 4

ECMAScript 6

Introduction

Related Links

Comments