[mmaciejow]

Hej :) Potrzebuje pomocy z #js. Mam taki skrypt:

var url = "..."

function getArticle(uri) {
 axios(uri).then( response => {
 var html = response.data;
 var doc = new JSDOM(html, {url: uri});
 var article = new Readability(doc.window.document).parse();
 return article;
 })
}

var article = getArticle(url);
console.log(article)

Zamiast treść artykułu dostaje undefined. Nie ogarniam tego Promise w #javascript .
Jak to zrobić aby funkcja getArticle zwracała wartość. Dwie ostatnie linie to tylko wyciągniecie danych - taki debug. Funkcja getArticle będzie inaczej wywoływana, dlatego nie chce tego mieć asynchronicznie.
Dzięki za pomoc :)
#nodejs #naukaprogramowania

[S.....a]

@mmaciejow: nic nie zwracasz z funkcji getArticle, dodaj "return axios..."

[mmaciejow]

@SleepingKarma: dostaje wtedy "Promise { }".
jeśli dodam return i przerobie ostatnie linie na

getArticle(url).then( result =>
 console.log(result)
);

to zadziała, ale w ten sposób nie mogę przypisać do zmiennej wyniku.

[lobo]

@mmaciejow: promisy są asynchroniczne, popatrz na async await.

[lobo]

@mmaciejow: Takie krótkie bardzo pobieżne tłumaczenie

var a = 1;
var b = 2;
console.log(a);
console.log(b);
tu masz kod synchroniczny każdy z kroków wykonuje się jeden po drugim
zaloguje się 1, a potem 2

var a = 1;
var b = 2;
setTimeout(() => {
b = 10;
}, 1000);
setTimeout(() => {
console.log(b);
}, 2000);
console.log(a);
console.log(b);
tu masz kod synchroniczny i 2 funkcje wykonujące się asynchronicznie. Wykonają się dopiero

[mmaciejow]

@lobo: zgadza się, też próbowałem tak:

async function getArticle(uri) {
 return await axios(uri).then( response => {
 var html = response.data;
 var doc = new JSDOM(html, {url: uri});
 var article = new Readability(doc.window.document).parse();
 return article;
 })
}

I również dostaje Promise { }

[lobo]

@mmaciejow: https://medium.com/better-programming/understanding-promises-in-javascript-13d99df067c1

[lobo]

@mmaciejow: Nieco nie rozumiesz działania promisów :)

async await to jest taki sugarcoat na promisy aby wyglądały na funkcje synchroniczne aby to zadziałało musiałbyś użyć jeszcze await

var article = await getArticle(url);

dodatkowo musisz opakować tow funkcje również oznaczoną jako async

async function a() {
var article = await getArticle(url);
console.log(article)
}

a();

[lobo]

@mmaciejow: https://developer.mozilla.org/pl/docs/Web/JavaScript/Referencje/Polecenia/funkcja_async

[mmaciejow]

@lobo: tak jak wspomniałem, próbuje to zrozumieć. Twój kod działa, ale nadal nie wiem jak przypisać wynik z funkcji do zmiennej, abym mógł dalej na tej zmiennej operować.
Takie coś nie działa.

var test = a();
console.log(test);

Ja jestem trochę przyzwyczajony to innego asynchronicznego kodu i dla mnie await to znaczy, że czeka i nie pcha się dalej. https://bit.ly/34crpHB.
A tutaj idzie i tak jakby ignoruje to słowo await.

[lobo]

@mmaciejow: Zobacz jak to powinno wyglądać
https://codesandbox.io/s/little-tree-2lwkr?file=/src/index.js
mam nadzieję, że teraz zobaczysz różnicę

[lobo]

@mmaciejow: aby async/await działał musisz odpalać funkcje async w innej funkcji async dodatkowo mając await przed tym

[mmaciejow]

@lobo: dzięki. Jak dla mnie to dziwny ten js. W tych klamrach, nawiasach, jakiś anonimowych funkcjach można się pogubić...

[lobo]

@mmaciejow: To co napisałem to po prostu samowykonujące się funkcje

[mmaciejow]

@lobo: cały myk polega, że ja to wywołuje z zewnętrznego źródła, dokładnie webview w androidzie) i potrzebuje aby funkcja zwróciła mu wartość, która powraca przez listener. O ile proste funkcje działają, o tyle z funkcjami asynchronicznymi jest problem. Dlatego dwie ostatnie linie napisałem w celu przetestowania, aby mieć pewność, że funkcja wypluje poprawny wynik, a nie informacje, że to jest Promise. Mimo to dziękuje za pomoc :)