0

I have two classes example1 and example2. example1 is having async method inside await keyword and promise response from API. When console inside async function am able to get print this.data and this.data but when I tried this to console inside example2 coming blank response where able to get response for this.key. How to solve this issue. This might be due to resolving promising taking time. Any suggestion ? below is sample example.

One class :

class example1{

constructor(){
  
 this.asyncFunction();
}

async asyncFunction(){
 this.key = await this.callAPI(url);

 this.data = await this.callAPI(url2);
}

callAPI(url) {
    const metadata = new Promise((resolve) => {
      fetch(url).then((res) => {
        const json = res.json();
        // console.log(json);
        resolve(json);
      });
    });
    return metadata;
  }
}


Second class :

import example1; // just added to show it imported class
class example2{

constructor(){
 const a = new example1();
 console(a); // i got all response; 
 console(a.data) // got blank response; 
}

Avinash Dalvi
  • 8,551
  • 7
  • 27
  • 53
  • Doing anything async in a constructor is a bad idea, because the async operation *cannot* resolve before the synchronous constructor finishes. You need to rethink your design to not require an async operation in the constructor. – deceze Aug 04 '21 at 08:46
  • any suggestion for this ? above suggestion not helping me to solve my problem – Avinash Dalvi Aug 04 '21 at 08:47
  • 2
    We *understand* what you want, we can’t tell you how to fix it. As said, what you want is impossible. The two linked duplicates explain why. How to do it differently so it still fits your requirements we can’t tell you. – deceze Aug 04 '21 at 08:50
  • is there will be different approach to solve this problem ? – Avinash Dalvi Aug 04 '21 at 08:50
  • 1
    The duplicates are exactly what you need to understand, please read them, understand them. And then your problem is much easier to fix. One suggestion is create a method called `async init()`, and then your caller can do `const example = new Example(); await example.init()`.. Or something similar. – Keith Aug 04 '21 at 08:50
  • if i used await inside example2 then I have declared that function or constructor as async which is not right ? – Avinash Dalvi Aug 04 '21 at 08:56
  • 2
    Exactly, you’d need to make an `async` constructor, and do `await new Example`, and that doesn’t exist. Async operations in constructors = no go. – deceze Aug 04 '21 at 08:57
  • `async` constructor is good idea to use ? – Avinash Dalvi Aug 04 '21 at 08:59
  • If you don't like the `var obj = new Class(); await obj.init()`, Another option is don't use a class in the first place. Plain Javascript functions can pretty much do the same as a class, without the headache's of `this`, you could then create a kind of async constructor pattern. – Keith Aug 04 '21 at 09:01
  • 1
    Or make an `async` function that fetches the data and *then* returns a class with that data… – deceze Aug 04 '21 at 09:02

0 Answers0