3
votes

Comment accéder aux propriétés dans un objet de retour d'attente asynchrone

Pourquoi je ne peux pas accéder aux propriétés des objets avec un . en asynchrone attendre un objet de retour? Je sais que je peux accéder aux propriétés comme ci-dessous.

const call = (x) => {

    return new Promise((resolve, reject) => {

        setTimeout(() => {
            resolve({
                val: x
            });
        }, 3000)
    })
}

const dummy = async () => {

    //let val1 = await call(3);
    //let val2 = await call(4);
    //alert(value.val + val2.val);
    let v = await call(3).val + await call(4).val;
    alert(v);
}

dummy()

mais je suis intéressé si cela peut être fait

let v = await call(3).val + await call(4).val;

let val1 = await call(3);
let val2 = await call(4);


2 commentaires

Pas exactement plus court: laissez v = attendre Promise.all ([call (3), call (4)]). Then (res => res.reduce ((a, c) => a + c.val, 0)); de cette façon, vous n'avez pas plusieurs lignes manuscrites, et cela prend 3 secondes au total.


Je pense que cela devrait fonctionner comme ceci: let v = (attendre l'appel (3)). Val + (attendre l'appel (4)). Val;


4 Réponses :


1
votes

Enveloppez simplement le await et l'expression à attendre entre parenthèses. Accédez ensuite à la propriété.

const call = (x) => {

  return new Promise((resolve, reject) => {

    setTimeout(() => {
      resolve({
        val: x
      });
    }, 3000)
  })
}

const dummy = async() => {
  // Call both in parallel
  let val1 = call(3);
  let val2 = call(4);
  
  // Await for both
  let v = await Promise.all([val1, val2]);
  
  // *then* add
  alert(v[0].val + v[1].val);
}

dummy()

Notez qu'en procédant de cette façon, vous attendez 3 secondes pour le premier appel, puis attendez encore 3 secondes pour le deuxième appel. À moins que le deuxième appel ne dépende en quelque sorte du premier, je vous suggère de faire ce qui suit:

const call = (x) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({
        val: x
      });
    }, 3000)
  })
}

const dummy = async() => {
  let v = (await call(3)).val + (await call(4)).val;
  alert(v);
}

dummy()


0 commentaires

4
votes

Vous essayez d'attendre la valeur de la propriété val de la promesse .

Vous devez attendre la promesse et puis lisez la propriété val à partir du résultat.

const call = (x) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve({
                val: x
            });
        }, 3000)
    })
}

const dummy = async () => {
    let v = (await call(3)).val + (await call(4)).val;
    alert(v);
}

dummy()


0 commentaires

2
votes

Pourquoi je ne peux pas accéder aux propriétés des objets avec un . en attente de retour asynchrone objet?

Parce que call renvoie une Promise et n'a donc pas de propriété val . Lorsque vous attendez la promesse retournée, l'expression wait call (x) se résoudra finalement en {val: x} , que vous pourrez ensuite utiliser .val activé.

Ainsi, vous pouvez soit attendre chaque appel séparément et enregistrer l'objet retourné dans leurs propres variables, soit envelopper votre expression attendre l'appel (x) dans parenthèses qui leur sont propres, de telle sorte que vous obtenez le .val de la valeur résolue, pas la promesse:

const call = (x) => {

  return new Promise((resolve, reject) => {

    setTimeout(() => {
      resolve({
        val: x
      });
    }, 3000)
  })
}

const dummy = async() => {
  let v = (await call(3)).val + (await call(4)).val;
  alert(v);
}

dummy()

0 commentaires

0
votes

Ceci est dû au fait que l'appel ne renvoie pas d'objet de résultat direct. Il renvoie une promesse qui résoudra la valeur dans .then callback. Vous pouvez attendre cet appel.

const call = (x) => {

    return new Promise((resolve, reject) => {

        setTimeout(() => {
            resolve({
                val: x
            });
        }, 3000)
    })
}

const dummy = async () => {

    //let val1 = await call(3);
    //let val2 = await call(4);
    //alert(value.val + val2.val);
    let v = await call(3).then(result => result.val) + await call(4).then((result)=> result.val);
    alert(v);
}

dummy()


0 commentaires