Strategies for increasing a value within an asynchronous function

Question

Strategies for increasing a value within an asynchronous function

I'm facing an issue with incrementing the variable loopVal inside a promise. I've tried to increment it without success. Any ideas on how to make this work?

const hi = function(delay) {
  let loopVal = 1;
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("Resolved Successfully", loopVal);
      resolve();
      loopVal++;
    }, delay)
  })
}

const bye = async() => {
  await hi(1000);
  await hi(1000);
  return "bye";
}

bye().then((value) => console.log(value));

javascript asynchronous async-await promise resolve

Answer 1

Answer №1

Initially, the variable loopVal exists only within the function and any modifications to it are lost once the function ends.

Additionally, you fail to return the updated value from the promise.

To address this issue, you may consider placing this variable in a scope where it can serve as both an argument and a return value for your hi function.

const hi = function(val, delay) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("Successfully Resolved", val);
      resolve(val+1);
    }, delay)
  })
}

const bye = async() => {
  let val = 1;
  val = await hi(val, 1000);
  val = await hi(val, 1000);
  console.log("Final result", val);
  return "goodbye";
}

bye().then((value) => console.log(value));

Answer 2

Initially, the variable loopVal exists only within the function and any modifications to it are lost once the function ends.

Additionally, you fail to return the updated value from the promise.

To address this issue, you may consider placing this variable in a scope where it can serve as both an argument and a return value for your hi function.

const hi = function(val, delay) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("Successfully Resolved", val);
      resolve(val+1);
    }, delay)
  })
}

const bye = async() => {
  let val = 1;
  val = await hi(val, 1000);
  val = await hi(val, 1000);
  console.log("Final result", val);
  return "goodbye";
}

bye().then((value) => console.log(value));

Answer 3

Answer №2

Your code currently resets the loopVal to one each time the function is called, causing a lack of state persistence between function calls. To solve this issue, you can use a closure that returns a function which allows you to maintain the variable's state without relying on a global variable.

const hello = (function() {

  let loopVal = 1;
  
  return function(delay) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("Resolved Successfully", loopVal);
        resolve();
        loopVal++;
      }, delay)
    })
  }
}());

const goodbye = async() => {
  await hello(1000);
  await hello(1000);
  return "goodbye";
}

goodbye().then((value) => console.log(value));

Answer 4

Your code currently resets the loopVal to one each time the function is called, causing a lack of state persistence between function calls. To solve this issue, you can use a closure that returns a function which allows you to maintain the variable's state without relying on a global variable.

const hello = (function() {

  let loopVal = 1;
  
  return function(delay) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("Resolved Successfully", loopVal);
        resolve();
        loopVal++;
      }, delay)
    })
  }
}());

const goodbye = async() => {
  await hello(1000);
  await hello(1000);
  return "goodbye";
}

goodbye().then((value) => console.log(value));

Strategies for increasing a value within an asynchronous function

Answer №1

Answer №2

Similar questions

Do I need to include success as a parameter in my Ajax call even if my function does not return any values?

The MomentJS difference calculation is incorporating an additional hour

Tips for excluding specific elements when clicking on a document

Tips for Creating an Upward-Dropping Dropdown Menu in HTML/JavaScript When Space is Limited on the Page

Steps for navigating to a different page by clicking on a gridview row

The Jasmine test in my Angular project is experiencing a timeout issue, displaying the error message "Async callback was not invoked within 5000ms", despite the fact that no async function is being used in the

Display loader while waiting for file to be loaded

Building on the Vuejs3 and Vuex4 framework, create a conditional rendering feature that triggers upon

Develop a Vue.js component embedded within another component to manipulate data stored in the parent

When I implement JavaScript on my website, my HTML content does not show up

Is there a way to categorize data and sort it by using an action and reducer in redux?

Experiencing difficulty moving information from React form to DATA.txt file through Express

Is there a way for me to determine when the modal animation has completed?

Experiencing SyntaxError when utilizing rewire and mocha for Node.js testing. Unexpected token encountered

When attempting to view the PDF file, it appears completely void

Displaying HTML content from a Vuejs response within a Dialog box

How can I efficiently remove elements from the end of an array in Vue.js?

Guide on accessing a local image while setting the background image using JavaScript

Display the number in a formatted manner without displaying any zeros in the decimal part

jQuery providing incorrect measurements for an element's height