HELP Promises and AWAIT for Newbie [SOLVED]

Ask the community
,
1

Hi all,
I’m trying to familiarize with the promise pattern, so I coded the following example.

I was able to understand the construct of the promises and how to get the messages from the promises, by resolve and reject.
I used many functions coded in public, some of these have setTimeout in order to explore the different timings.
OK, all works, but now I ask you an help on the second step.

I would like to get the output of the functions PROM, TIME, TIME2 and FINALE in the correct order waiting the end of each of them . Now it isn’t, obviously 'cause the different timings.

What’s the method, please ?

Thanks in advance
Mauro

The heart is:

Math.floor(Math.random() * 6) + 1

Here the main page, all the results you can see by console.log and outputs are not in order:

import {Random6,PROM,TIME, TIME2, FINALE} from 'public/function.js';

function uno(data) {console.log ('Great, threw '  + data + '.');}        
function due(data) {console.log ('Oh no,  threw ' + data + '.');}

$w.onReady(function () {
console.log('1 / start');

console.log("2 / batteria di funzioni ");
PROM().then(uno).catch(due);
TIME().then(uno).catch(due);
TIME2().then(uno).catch(due);
FINALE();

console.log('3 / end ')
});

and here the functions in public:

export function Random6(data) {                                                  
  data = Math.floor(Math.random() * 6) + 1;
 return data;
  }

// la Promise che calcola una risposta (resolve,reject) in base al valore di Random6()
export function PROM() { return new Promise(                          
  (resolve, reject) => {                                               
 var n=Random6();                                                                
  console.log('funzione PROM: ');
 if (n === 6) { resolve(n); }  else  { reject(n);}
  });
}

// Un secondo modo di impostare una new Promise, introducendo un ritardo 
export function TIME() { return new Promise(
 function(resolve,reject) {
     setTimeout( () => { console.log("Funzione TIME: "); resolve( PROM() ) }  , 6000);
 });
}

// Nuova Promise usa la funzione Random6(), ma non produce nessun reject, solo resolve 
export function TIME2() { return new Promise(
 function(resolve,reject) {
     setTimeout( () => { console.log("Funzione TIME2: "); resolve(Random6()) }  , 2000);
 });
}

export function FINALE() {
console.log("Funzione FINALE");
}
2

UP

3

PROMISES and .THEN( )
I got them works, I publish the code for someone newbie like me.
I hope the following example is correct, but works really good:

import {Random6,PROM,TIME, TIME2,SECONDS, FINALE} from 'public/function.js';


// the functions for resolve and reject
function uno(data) {console.log('Great, it's threw ' + data + '.');}        
function due(data) {console.log('Oh no, it's threw ' + data + '.');}


$w.onReady(function () {

console.log('1 - start');

PROM().then(uno,due)
.then( results => TIME(1000).then( uno,due) )
.then( results => TIME2(500).then( uno,due))
.then( results => SECONDS(2000).then(result => console.log("IT'S BEEN n. " + result/1000 + " secondi")))
.then( results => FINALE())
.then( results => console.log('3 - end '))
.catch(err=>console.log(err));

});
4

Here the solution with ASYNC/AWAIT :

import {Random6,PROM,TIME, TIME2, SECONDS, FINALE} from 'public/function.js';

// the functions for resolve and reject
function uno(data) {console.log('Great, it's threw ' + data + '.');}        
function due(data) {console.log('Oh no, it's threw ' + data + '.');}


async function WAIT() {
 try {
       console.log('1 - start');                 //STEP_1
 await PROM().then(uno, due);                    //STEP_2
       console.log("2 - batteria di funzioni "); //STEP_3
 await TIME(500).then(uno, due);                 //STEP_4
 await TIME2(100).then(uno, due);                //STEP_5
       console.log("Ora aspettiamo");            //STEP_6
 await SECONDS(2000).then(result => console.log("IT'S BEEN n. " + result/1000 + " secondi"))
       FINALE();                                 //STEP_8
       console.log('3 - end \n')                 //STEP_9
      } catch (e) {
      console.log(e);
      }}

$w.onReady(function () {
       WAIT();
});
5

The following links were my references :