jak masz then
i chcesz zrobić łańcuch, to musisz zwrócić albo wartość albo promisa, czyli np.
Promise.resolve(10) // opakowuje wartość 10 w obiekt promise, który się rozwiązuje do wartości 10
.then(value => value + 9) // dostajesz 10 i zwracasz 10 + 9
.then(value => Promise.resolve(value + 23)) // dostajesz 19 i zwracasz promise, który rozwiąże się do 19 + 23
.then(value => console.log(value)); // dostajesz 42
czyli musisz zwrócić albo wprost wartość, albo wartość opakowaną w obiekt promise (tutaj dla przykładu użyłem Promise.resolve
, ale przecież każdy Promise to po prostu taka opakowana przyszła wartość, a then
odpakowuje te wartości). I kolejne then się wywoła dopiero wtedy, kiedy dany promise się rozwiąże. Jak nic nie zwracasz, to kolejny then
dostanie undefined.
A zobacz, że ty tutaj nic nie zwracasz:
new Promise((resolve, reject) => { // jak to ma działać, skoro ten new Promise nie jest nigdzie "łapany"...?
czyli prędzej powino być return new Promise(...............
Tyle, że ten twój kod i tak nie ma wiele sensu:
if(i === data.incomes.length - 1) {
resolve(Math.round(incomesSum))
}
To wygląda jak syndrom zmęczenia przy pisaniu kodu, gdzie człowiek jest tak zmęczony po iluś godzinach klepania, że robi dziwne rzeczy (ew. syndrom niezrozumienia, jak działa forEach).
Bo przecież wystarczy przenieść ten kod poza forEach i nie będzie potrzebny żaden if.
data.incomes.forEach((income, i) => {
incomesSum += Number(income.value)
});
resolve(Math.round(incomesSum));
chociaż nie rozumiem całego kontekstu. To jakaś apka reactowa, że setState? I czemu czekasz na callback? Przecież i tak masz już wcześniej te dane. Poza tym po co ustawiać "loadingInformation" w stanie do czegoś, co się wywoła ułamek sekundy?
No i zamiast forEach, można napisać prościej te zliczanie sumy używając reduce. Więc moim zdaniem ta cała funkcja, w której jest teraz new Promise
, forEach
i this.setState
, tak powinna raczej wyglądać:
.then((data) => {
return Math.round(data.incomes.reduce((acc, income) => acc + income.value, 0));
})
Co do this.setState, to jeśli potrzeba ustawić stan po odebraniu/przemieleniu danych, to można to zrobić będzie w kolejnym then;
.then((data) => {
return Math.round(data.incomes.reduce((acc, income) => acc + income.value, 0));
}
.then(incomeSum => {
this.setState({incomeSum: incomeSum}); // albo { incomeSum } używając destructuringu
})
No i incomeSum
jakoś brzmi bardziej po ludzku niż incomesSum
, które brzmi dość dziwnie. Chociaż też nie wiem. Może totalIncome
byłoby lepsze?