Callbacks in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to call the callback function.

Javascript

function greet(name, [1]) {
  [1](name);
}

greet('Alice', function(name) {
  console.log('Hello, ' + name);
});

Drag options to blanks, or click blank then click option'

Acallback

Bgreet

Cname

Dconsole

Attempts:

3 left

💡 Hint

Common Mistakes

Using the wrong parameter name to call the callback.

Trying to call a variable that is not a function.

The callback function is passed as the second argument and called inside the greet function using the name 'callback'.

2fill in blank

medium

Complete the code to pass a callback that logs a message.

Javascript

function processData(data, [1]) {
  console.log('Processing: ' + data);
  [1]();
}

processData('info', function() {
  console.log('Done processing');
});

Drag options to blanks, or click blank then click option'

Adata

Bcallback

CprocessData

Dconsole

Attempts:

3 left

💡 Hint

Common Mistakes

Not calling the callback function.

Using the wrong parameter name for the callback.

The callback function is passed as the second argument and called inside processData using the name 'callback'.

3fill in blank

hard

Fix the error in calling the callback function.

Javascript

function fetchData(callback) {
  setTimeout(function() {
    const data = 'Sample data';
    [1](data);
  }, 1000);
}

fetchData(function(result) {
  console.log('Received:', result);
});

Drag options to blanks, or click blank then click option'

Acallback

BfetchData

CsetTimeout

Ddata

Attempts:

3 left

💡 Hint

Common Mistakes

Calling a variable that is not the callback function.

Forgetting to pass the data to the callback.

The callback function should be called by its name 'callback' with the data as argument.

4fill in blank

hard

Fill both blanks to create a callback that doubles numbers.

Javascript

function doubleNumbers(numbers, [1]) {
  const result = numbers.map(function(num) {
    return num * 2;
  });
  [2](result);
}

doubleNumbers([1, 2, 3], function(doubled) {
  console.log(doubled);
});

Drag options to blanks, or click blank then click option'

Acallback

Bnumbers

Cconsole.log

Dresult

Attempts:

3 left

💡 Hint

Common Mistakes

Using the wrong variable name to call the callback.

Not calling the callback at all.

The callback function is passed as 'callback' and called with the doubled array as argument.

5fill in blank

hard

Fill all three blanks to create a callback that filters even numbers and logs them.

Javascript

function filterEven(numbers, [1]) {
  const evens = numbers.filter(function(num) {
    return num [2] 2 === 0;
  });
  [3](evens);
}

filterEven([1, 2, 3, 4], function(result) {
  console.log(result);
});

Drag options to blanks, or click blank then click option'

Acallback

B%

Cconsole.log

D==

Attempts:

3 left

💡 Hint

Common Mistakes

Using '==' instead of '%' for checking even numbers.

Calling the wrong function instead of the callback.

The callback is named 'callback' and called with the filtered evens. The modulo operator '%' checks for even numbers.