Versprechen zurück undefined

Question

export function getHotOffers() { 
    let offers; 
    getRequest('/hot-offers').then(x => offers = x); 
    alert(offers); 
    return JSON.parse(offers); 
} 

Das ist meine Funktion, die ich exportieren. Es stellt eine asynchrone Anforderung an den Server und ruft eine JSON-Zeichenfolge ab. Wenn ich das Projekt debugge, funktioniert alles und alert gibt String zurück, aber wenn ich nur den Code ausführe, gibt Alert undefined zurück. Wie kann ich das beheben?

Answer 1

Die Daten sind nicht synchron verfügbar. Sie müssen das Versprechen nutzen, um Zugang zu den Angeboten zu erhalten.

export function getHotOffers() { 
    let offerPromise = getRequest('/hot-offers') 
     .then(offers => JSON.parse(offers)); 
    return offerPromise; 
} 

Ähnlich jeder Code, der dies ein Versprechen bekommen werden Anrufe und den Endwert seine .then Methode verwenden, um zu bekommen.

getHotOffers().then(offers => { 
    alert(offers); 
}); 

Answer 2

So funktionieren Versprechen nicht. Der Code nach getRequest() wartet nicht auf die Versprechung, sondern läuft sofort.

export function getHotOffers() { 
    let offers; 
    getRequest('/hot-offers').then(x => 
     //this only happens after the request is done 
     offers = x 
    ); 
    //this code runs right away, before the request completes 
    alert(offers); 
    //so does this, so "offers" will be undefined at this point 
    return JSON.parse(offers); 
} 

der gesamte Code, nachdem die Anforderung wieder laufen soll zurück in Ihrem Anruf sein, wie folgt aus:

export function getHotOffers() { 
    return getRequest('/hot-offers'); 
} 

//somewhere else 
getHotOffers().then(offers => { 
    useTheOffers(offers); 
}); 

Answer 3

Ihr Code schreitet vor dem Rückruf zu then geben aufgerufen wird.

Mit async/await, können Sie dies umgehen, und zur Verbesserung der Lesbarkeit des Codes:

// emulate your "getRequest" function which returns a promise: 
 
async function getRequest(path) { 
 
    await new Promise(resolve => setTimeout(resolve, 500)); // simulate response delay 
 
    const offers = ['hot-offer-1', 'hot-offer-2', 'hot-offer-3']; 
 
    return offers; 
 
} 
 

 
async function getHotOffers() { 
 
    const offers = await getRequest('/hot-offers'); 
 
    console.log(offers); 
 
    return JSON.parse(offers); 
 
} 
 

 
getHotOffers();