La funzione map() in jQuery

La funzione map() in jQuery

La funzione .map() opera sugli array ed applica una funzione ad ogni elemento dell'array e restituisce un array modificato.

indice

Sintassi funzione each in jQuery

// funzione map : mappa (interagisce) secondo le istruzioni che vengono date e lo fa per ogni elemento che viene mappato (analizzato).
//applica una funzione ad ogni elemento dell'array e restituisce un array modificato
$.map(array, function(value, index) {

  //...

});

Esempio di funzione each in jQuery

Codice della Lezione : funzione each in jQuery

$(document).ready(function(){
    // funzione map : mappa (interagisce) secondo le istruzioni che vengono date e lo fa per ogni elemento che viene mappato (analizzato).
//applica una funzione ad ogni elemento dell'array e restituisce un array modificato
    let numeri = [2,3,4,5,6,7,8,9,10];

    // sintassi: let nomevariabile = $.map(arrayScelto, function(item,index){return});
    let mappa = $.map(numeri, function(item,index){
        return('<li>'+(Math.pow(item,2))+'</li>')
    });

    $('#button1').click(function(){
        $('#txtID1').html('<p> l\'Array dei numeri è :' + numeri + '</p><p> Mentre la lista dei numeri mappati è:</p><ul>'+ mappa.join('')+'</ul>').addClass('bordo');
    });

    let animali = ['Airone','Alce','Alligatore','Canocchia','Capinera','Capriolo','Cardinale','Farfalla','Ghiozzo','Giaguaro','Giraffa'];

    let aniMap = $.map(animali, function(item,index){
        return('<li>' + (index+1)+ ' : ' + item + '</li>')
    });
    $('#button2').click(function(){
        $('#txtID2').html('<p> l\'Array degli animali è :'+ animali + '</p><p> Mentre la lista degli animali mappati è:</p><ul>'+ aniMap.join('') +'</ul>');
    });
});     

Scritto da Donato Pirolo

Ciao, sono Donato, frontend developer con una smisurata passione per la SEO. Creo strumenti ad hoc per aiutare aziende e professionisti ad essere cercati sul web e trovare clienti.

Potrebbero interessarti

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Copyright © 2022
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram