CODEWITHSUNDEEP
javascriptpromise
Mehdi
Mehdi

Reputation: 488

Using Promise on map Function

I have an array and i want to use promises on this array :

let check_duplicate_phone  = store.state.lines.map(function (item) {
    return core.checkIsPhoneDuplicate(item.phone , item.phone_significant);
});

let res  = await Promise.all(check_duplicate_phone).then(function(values) {
    console.log(values);
});

And this the checkIsPhoneDuplicate function :

async checkIsPhoneDuplicate(phone , phone_significant) {
    var data = {
        'phone': phone ,
        'phone_significant' : phone_significant
    }
    let res = await Axios.post(checkPhoneDuplicate_route, data)
        .then(response => {                    
            return response.data;
        }).catch(error => console.log(error));
    return res;
}

But its not waiting for the response and just run the next step. I know its supposed to used to like this and i already read this answer But i didn't findout where is my mistake.

thanks.

Upvotes: 2

Views: 172

Answers (2)

Anthony
Anthony

Reputation: 6482

EDIT: Removed incorrect explanation, as pointed out in the comments. This approach does work, but doesn't address what was asked by OP. Per the comments, OPs code should also work as this code does, so something may have been left out.

function checkIsPhoneDuplicate(phone, phone_significant) {
  var data = {
    phone: phone,
    phone_significant: phone_significant
  };

  return Axios.post(checkPhoneDuplicate_route, data)
    .then(response => response.data)
    .catch(error => console.log(error));
}

async function runCheck() {
  let check_duplicate_phone = store.state.lines.map(function(item) {
    return core.checkIsPhoneDuplicate(item.phone, item.phone_significant);
  });

  let res = await Promise.all(check_duplicate_phone).then(function(values) {
    console.log(values);
  });
}

Upvotes: 1

Adam LeBlanc
Adam LeBlanc

Reputation: 962

I'm not 100% sure exactly what your specific issue is, but let me help you clean this up.

async function someFunc() {
  // Obviously this has to be inside of an async function if using await, so let's add it for clarity

  let check_duplicate_phone = store.state.lines.map(function(item) {
    return core.checkIsPhoneDuplicate(item.phone, item.phone_significant);
  });
  /*
    So with this code, you won't get anything in res. You're awaiting the reuslt of
    the promise, which is great, but the .then is going to be called first, 
    and you return nothing from it, so therefore, you won't get anything back
  */
  //let res = await Promise.all(check_duplicate_phone).then(function(values) {
    //console.log(values);
  //});
  
  // try this
  
  let resolvedValues = await Promise.all(check_duplicate_phone); // Values in here
  
  console.log(resolvedValues); // Or however you want to log them.

}




async function checkIsPhoneDuplicate(phone, phone_significant) {
  var data = {
    'phone': phone,
    'phone_significant': phone_significant
  }
  /*
    Again, here you are mixing async/await and .then, which is okay, but
    Let's take full advantage of async/await to clean it up
  */
  /*let res = await Axios.post(checkPhoneDuplicate_route, data)
    .then(response => {
      return response.data;
    }).catch(error => console.log(error));*/
    try {
      let res = await Axious.post(checkPhoneDuplicate_route, data);
      return res.data;
    } catch (e) {
      console.log(e);
    }
}

Hopefully this helps a bit. I think this will work for you or at the very least set you on the right path with the code being a bit cleaner.

Upvotes: 1

Related Questions