Spiegazione script

di il
2 risposte

Spiegazione script

Ciao. Sto rifacendo tutti gli esercizi javascript fatti finora con la console adattandoli al DOM. Chiedo spiegazione, se possibile, su una riga particolare del codice che realizza una tombola:

for (let i = 1; i <= 10; i++) {
    const inputEl = document.createElement('input');
    inputEl.setAttribute('type', 'text');
    inputEl.setAttribute('size', 1);
    inputEl.setAttribute('id', `num${i}`);
    inputEl.setAttribute('value', i);
    nums.appendChild(inputEl);
    if (i === 5) {
        const brEl = document.createElement('br');
        nums.appendChild(brEl);
    }
}

function verifica(){
    const nums = document.getElementById('nums');
    const arrPer=[]; //array personale
    const arr=[];  //array fisso
    let numArr1=0; //visualizzazione array fisso
    let numRnd=0;   //numero casuale
    let numArr2=0; //visualizzazione array personale 
    let numbers=Array.from({length: 90}, (_, i) => i + 1);      // RIGA DI CODICE CHE NON CAPISCO
    for( i=0; i < 10; i++){//ciclo for per popolare array numeri casuali
      numRnd=Math.floor(Math.random()*numbers.length)+1;
      arr.push(numbers[numRnd]); 
      numbers.splice(numRnd,1);
    }    
    vis.innerHTML = arr.sort(function(a, b) {
      if( a === Infinity ) 
        return 1; 
      else if( isNaN(a)) 
        return -1;
      else 
        return a - b;
    });
    nums.childNodes.forEach(num => {
        if((typeof num.value !== 'undefined') && (num.value !== ''))
            arrPer.push(parseInt(num.value));
    })
    vis1.innerHTML = arrPer.sort(function(a, b) {
      if( a === Infinity ) 
        return 1; 
      else if( isNaN(a)) 
        return -1;
      else 
        return a - b;
    });
    var counter=[];
  	for(let a=0; a < arr.length; a++){
          for(let z=0; z < arrPer.length; z++){
            if(arr[a] == arrPer[z]){
              	counter.push(arr[a]);
            }
         }
    }
    if(counter.length>0)
    	vis2.innerHTML = "Hai vinto con "+counter.length+" numeri (" + counter + ")" ;
    else
      vis2.innerHTML = "Non hai vinto";
} 

Chiedo scusa se queste cose non si chiedono e ovviamente sto studiando. Da quello che capisco la riga in questione crea un array di 90 numeri e poi passa dei parametri (che non capisco) a una funzione arrow. Ora so che una funzione arrow a sempre dei valori di ritorno. Ma in questo caso cosa ritorna? Grazie per la pazienza

2 Risposte

  • Re: Spiegazione script

    La riga che che stai cercando di capire in realtà è meglio non capirla, non è considerata una “best practices” ma un vero è proprio “Hack” o trucco per fare in modo di replicare la proprietà “length” che è presente in ogni oggetto javascript tramite la creazione di una nuova istanza con Array.from().

    Se mi posso permettere utilizzerei quelcosa di più leggibile ed intuibile tipo:

    [...Array(90)].map((_, i) => ++i)

    Array(90) crea 90 elementi vuoti che vengono destrutturati all'interno di un nuovo array  (tre puntini) per ottenere l'array con 90 elementi undefined, questi vengono mappati (con il metodo .map) ritornando solo l'indice pre-incrementato.

    quello che avviene è piu o meno questo:

    const x = [undefined,undefined].map((_,i)=>++i) // [0,1] indici

     x // nuovo array restituito da map è [1,2] 

    ps. il segno underscore (_) rappresenta il valore undefined che non viene utilizzato all'interno della callback di map.

  • Re: Spiegazione script

    Grazie per la risposta. Mi vado a studiare di corsa il metodo map :)

Devi accedere o registrarti per scrivere nel forum
2 risposte