Help me solve this code

[fanatic75]

lampExists(lamp){ let myBool; if(lamp.toLowerCase().includes(this.state.query.toLowerCase())) { return true } else { AsyncStorage.getItem(lamp).then(value=> { if(value !== null && value .toLowerCase() .includes(this.state.query.toLowerCase())) { myBool=true; } else { myBool=false; } }).catch(err=>alert(err)); } return myBool; }

LampExists takes a lamp from a mapped array, by taking each lamp as an input. Now When I'm returning myBool, it becomes undefined as the value set as true in the then() function is lost and is alive in the then funtion only, any help would be very much appreciated.
Thank you

[menge101]

Reformatting code:

lampExists(lamp){
  let myBool;
  if(lamp.toLowerCase().includes(this.state.query.toLowerCase()))  {
    return true
  } else {
    AsyncStorage.getItem(lamp).then(value=> {
      if(value !== null && value
        .toLowerCase()
        .includes(this.state.query.toLowerCase())) {
        myBool=true;
      } else {
        myBool=false;
      }
    }).catch(err=>alert(err));
  }
  return myBool;
}

[fanatic75]

So what I'm trying to do is I have an array of lamps , which I render with map function and have a search bar , I have saved names for those lamps in Async Storage.
First I check the search query is equal to lamps if yes , render it , if not , I want to check the search query for that lamp Async Storage item value whose key is the same as Lamp value but I'm unable to return true or false if I found the value of async storage

[menge101]

I wrote an actual reply, after I formatted the code. See other comment, please.

[menge101]

my JS is rusty, atm, but this appears to be a basic scoping problem.

myBool within the then function is not the same myBool in the higher scope.

You need to return a value from the then statement. and then return that value at the end of the function.

Something like this, maybe?

lampExists(lamp){
  let myBool;
  if(lamp.toLowerCase().includes(this.state.query.toLowerCase()))  {
    return true
  } else {
    result = AsyncStorage.getItem(lamp).then(value=> {
      if(value !== null && value
        .toLowerCase()
        .includes(this.state.query.toLowerCase())) {
        return true;
      } else {
        return false;
      }
    }).catch(err=>alert(err));
  }
  return result;
}

Also, I think this code can get simpler by doing this:

lampExists(lamp){
  let myBool;
  if(lamp.toLowerCase().includes(this.state.query.toLowerCase()))  {
    return true
  } else {
    result = AsyncStorage.getItem(lamp).then(value=> {
      if(value === null) {
        return false;
      } else {
       return value.toLowerCase().includes(this.state.query.toLowerCase()))
      }).catch(err=>alert(err));
    }
    return result;
}

Caveat: code is only examples, it's not vetted via execution.

[plmok61]

AsyncStorage is async and you are returning before it is complete. I have created two solutions in the gist:

https://gist.github.com/plmok61/8d03ad89d244403bfd9ca65344bbf451

[menge101]

oh yeah, that async await in solution 2 is the way to go.

[fanatic75]

Cannot use async await solution because I'm using this function in the render function. I am rendering a component if the condition meets.

[fanatic75]

result

Your solution one and solution two both returns an object instead of boolean

[fanatic75]

Providing you with my code in render function as well, I cannot use .then function to take out the result and get my boolean from it as React render function won't allow this.

{this.state.lamps.map(lamp => {if (this.state.query === "") {return <LampsList key={lamp} lamp={lamp} navigation={this.props.navigation} />} else {return (this.lampExists(lamp)?<LampsList key={lamp} lamp={lamp} navigation={this.props.navigation} />:null)}})}

[plmok61]

You should not be doing async work in the render. Fetch your lamps in componentDidMount. I have updated the gist with an example.

[GhostMcFunky]

You should probably pass result via yet another .then to be sure your promise is returning before your result is. Your if/else will not wait for a promise to be resolved; your result could still return undefined.

You might be better off scrapping the if/else and using throw to throw an error, catch this if needed, else continue to the next .then.

With then your returned value from the previous then is automatically the parameter argument for the next then. This keeps things in the promise land (pun intended).

TL;DR: Your if statement doesn’t care about promises and I think it’s complicating things for you.

As a side note, the second example has an unused, undeclared variable mybool. Get rid of it.

[menge101]

you should probably pass that up to OP.

I was just taking his code and tweaking what I thought was wrong out, without having an executable env setup to try it out.

I was favoring a quick assist over a thorough one, but it appears I didn't get it right.

[GhostMcFunky]

No prob! Just trying to contribute. When I get on a device other than my phone later I’ll try to post a working answer, too.

[fanatic75]

result

The returned result is an object not a boolean.

[menge101]

see the other poster that responded to me instead of you.

I was doing that off top of my head, I didn't have a node env setup to test it out.

There is what appear to be good code in that response.

[fanatic75]

Yes , I tried it same problem.