Avoir des problèmes pour utiliser les promesses dans jQuery/JavaScript. Le script ne semble pas attendre

Question

Je suis en train de programmer un photon de particules (comme un Arduino). J'essaye d'appeler une variable de lui et puis utilise cette variable pour ajouter une classe .css à un div.

Le problème est que la variable revient sans cesse comme

undefined 

sur l'appel initial. Cependant, si je l'appelle encore quelques secondes plus tard, cela fonctionne très bien.

C'est l'appel API de particules:

particle.getVariable({ deviceId: 'DEVICE_ID', name: 'temp', auth: token }).then(function(data) { 
    console.log('Device variable retrieved successfully:', data); 
}, function(err) { 
    console.log('An error occurred while getting attrs:', err); 
}); 

Voici ma version:

function getVariable(varName) { 
particle.getVariable({ deviceId: device_ID, name: varName, auth: accessToken }).then(function(data) { 
    return data.body.result; 
    }, function(err) { 
     console.log('An error occurred while getting variable:', err); 
}); 
} 

Je voudrais être en mesure de travailler avec cela comme

$(".class").addClass(getVariable("var") 

Je suis assez nouveau pour jQuery et Javascript, mais j'ai fait beaucoup de lecture sur les callbacks et les promesses et je n'arrive nulle part. Une idée de comment accomplir cela?

Answer 1

Vous avez plusieurs problèmes ici.

1. Votre fonction a besoin getVariable() de retourner la promesse de particle.getVariable(). Cela permettra à l'appelant de getVariable() d'utiliser .then() sur le résultat retourné pour obtenir le résultat asynchrone.

2. Les promesses ne font pas magiquement une opération asynchrone dans une opération synchrone. Ainsi, votre fonction getVariable() est toujours asynchrone car elle repose sur le résultat particle.getVariable() qui est asynchrone. Donc, vous ne pouvez pas retourner le résultat directement. Au lieu de cela, vous devriez le faire retourner une promesse et l'appelant de cette fonction peut utiliser .then() pour récupérer le résultat asynchrone. Comme getVariable() sera asynchrone, vous devrez utiliser getVariable(...) .then (...) pour avoir accès au résultat asynchrone.

Changement à ceci:

function getVariable(varName) { 
    return particle.getVariable({ 
     deviceId: device_ID, 
     name: varName, 
     auth: accessToken 
    }).then(function (data) { 
     return data.body.result; // this becomes the fulfilled value of the promise 
    }, function (err) { 
     console.log('An error occurred while getting variable:', err); 
     throw err;     // rethrow error so it will propagate 
    }); 
} 

getVariable("var").then(function (result) { 
    $(".class").addClass(result); 
}, function(err) { 
    // handle error here 
}); 

Pour beaucoup plus description de retour des valeurs asynchrones, vous pouvez voir ceci: How do I return the response from an asynchronous call?