What is causing this code to run immediately upon the addition of Promise logic?

Question

What is causing this code to run immediately upon the addition of Promise logic?

The coding scenario written below was supposed to have two 4-second delays. However, when the code is run, it executes immediately. It seems that there might be a lack of understanding on my part regarding some basic concept, or perhaps there's a hidden error I'm unable to identify.


          function calculatesomething(resolve) {
            console.log("calculating");

            setTimeout(results(resolve,3),4000);
          }

          var answer=0;
          function results(resolve,n) {
            console.log("got results");

            answer=1;
            resolve(answer+n);
          }

          function doingstuff() {
            console.log("starting");

            var promise1 = new Promise(function(resolve) {
              setTimeout(calculatesomething(resolve),4000);
            });

            promise1.then(function(value) {
              console.log("done: "+value);
            });

            console.log("regular execution");
          }

          doingstuff();

(apologies for the incorrect indenting here. The indentation issues seem to be inconsistent and outside my control.)

javascript promise settimeout

Answer 1

Answer №1

One key concept to remember is this:

 setTimeout(calculate(resolve,3),4000);

Instead of directly calling the function and passing the result, you can simply pass a reference to the function:

 setTimeout(calculate, 4000, /*arguments:*/ resolve, 4);

Answer 2

One key concept to remember is this:

 setTimeout(calculate(resolve,3),4000);

Instead of directly calling the function and passing the result, you can simply pass a reference to the function:

 setTimeout(calculate, 4000, /*arguments:*/ resolve, 4);

Answer 3

Answer №2

setTimeout requires a callback function as its first parameter. One approach to solve this is by encapsulating your function invocation within an anonymous function, like so:

function calculateTotal(resolve) {
  console.log("calculating");

  setTimeout(function() {
    generateResults(resolve, 3);
  }, 4000)
}

var finalAnswer = 0;

function generateResults(resolve, number) {
  console.log("retrieving results");

  finalAnswer = 1;
  resolve(finalAnswer + number);
}

function performTask() {
  console.log("starting task");

  var promise1 = new Promise(function(resolve) {
    setTimeout(function() {
      calculateTotal(resolve)
    }, 4000);
  });

  promise1.then(function(value) {
    console.log("task completed: " + value);
  });
        
  console.log("normal execution flow");
}

performTask();

Answer 4

setTimeout requires a callback function as its first parameter. One approach to solve this is by encapsulating your function invocation within an anonymous function, like so:

function calculateTotal(resolve) {
  console.log("calculating");

  setTimeout(function() {
    generateResults(resolve, 3);
  }, 4000)
}

var finalAnswer = 0;

function generateResults(resolve, number) {
  console.log("retrieving results");

  finalAnswer = 1;
  resolve(finalAnswer + number);
}

function performTask() {
  console.log("starting task");

  var promise1 = new Promise(function(resolve) {
    setTimeout(function() {
      calculateTotal(resolve)
    }, 4000);
  });

  promise1.then(function(value) {
    console.log("task completed: " + value);
  });
        
  console.log("normal execution flow");
}

performTask();

What is causing this code to run immediately upon the addition of Promise logic?

Answer №1

Answer №2

Similar questions

"Enhancing User Experience with Bootstrap's masonry layout feature while retaining scroll position

Combining two JSON objects using Angular's ng-repeat

How can you sift through an array of objects by looking at the elements within another nested array? Are you utilizing Vanilla JS, lodash, or another tool from the

Vue-moment displaying incorrect time despite timezone setting

Is it possible for me to invoke an anonymous self-executing function from a separate scope?

No matter what I try, the Mongoose query consistently comes back with

Moving the words from textArea to each 'ol' element using JavaScript

Converting a JSON object into a format suitable for transmission through AJAX requests

Accepting POST requests from an external source in AngularJS

Unlock the power of Angular pipes in window.open with URL parameters!

Switch up the Thumbnail Image based on the selected category

What is the best way to apply a specific style based on the book ID or card ID when a click event occurs on a specific card in vue.js

How can I trigger my function in jQuery after inputting into the jQuery text field?

"Terminate the current window that is open within the handler for the XMLHttpRequest

Mocha struggles to locate the ID within an input field - react-native

Accessing the facebox feature within a dropdown menu

Passport.js implementation in a Next.js application does not persist the user's login state when navigating between routes

Does anyone have tips on how to upload images to MongoDB using React?

Exploring the functionality of dimensions in d3 parcoords

Is it possible to save the project by generating incremental JSON diffs?