1. Home
  2. Iterop Design
  3. Utiliser les scripts
  4. Manipuler des tableaux en JavaScript

Manipuler des tableaux en JavaScript

Dans un script, il est parfois nécessaire de manipuler un ou plusieurs tableaux.

Il est existe différentes méthodes JavaScript utiles qui permettent d’exploiter efficacement un tableau.

Liste des fonctions JavaScript

forEach()

Itère sur une liste afin d’utiliser ou appliquer un traitement sur chacune de ses données.

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

categoriesDemandeAchat.forEach(function(categorie) {
  io.set("categorie_" + categorie, categorie);
});

// Résultat : De nouvelles variables ayant pour ID "categorie_Informatique" (valeur : Informatique), "categorie_Bureautique" (valeur : Bureautique) et "categorie_Autre" (valeur : Autre) sont créées.

map()

Itère sur une liste, transforme chaque éléments avec la fonction/le traitement donné et retourne la nouvelle liste transformée.

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

const categoriesDemandeAchatApresModif = categoriesDemandeAchat.map(
function(categorieParcourue){
    return "Catégorie : " + categorieParcourue;
});

// Résultat : Une concaténation de "Catégorie : " et du nom de la catégorie est faite sur chaque élément.
// ['Catégorie : Informatique', 'Catégorie : Bureautique', 'Catégorie : Autre']

filter()

Retourne un nouveau tableau qui ne comporte que les éléments qui correspondent à la condition passée en paramètre.

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

const resultats = categoriesDemandeAchat.filter(function(categorie){
    return categorie.endsWith('tique');
});

// Résultat : Un filtre a été réalisé sur le tableau "resultats". Seules les catégories qui finissent pas "tique" sont gardées.
// ['Informatique', 'Bureautique']

push()

Ajoute un/des élément(s) à la fin du tableau.

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

categoriesDemandeAchat.push('Consommable');

// Résultat : "Consommable" est ajouté au tableau.
// ['Informatique', 'Bureautique', 'Autre', 'Consommable']

shift()

Retire et stocke le premier élément du tableau.

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

var premiereCategorie = categoriesDemandeAchat.shift();

// Résultat : Le premier élément du tableau "categoriesDemandeAchat" est retiré du tableau puis stocké dans la variable JS "premiereCategorie".
// ['Bureautique', 'Autre']
// premiereCategorie = "Informatique"

pop()

Retire et stocke le dernier élément du tableau.

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

var derniereCategorie = categoriesDemandeAchat.pop();

// Résultat : Le dernierélément du tableau "categoriesDemandeAchat" est retiré du tableau puis stocké dans la variable JS "derniereCategorie".
// ['Informatique', 'Bureautique']
// premiereCategorie = "Informatique"

join()

Concatène tous les éléments du tableau avec, comme séparateur, l’élément passé en paramètre (virgule si aucun paramètre).

Exemple :

var categoriesDemandeAchat = ['Informatique', 'Bureautique', 'Autre'];

var listeDesCategorie = categoriesDemandeAchat.join('##');

// Résultat : Une chaîne de caractère est créée avec tout les éléments du tableau "categoriesDemandeAchat" en mettant comme séparateur le paramètre renseigné ("##").
// Informatique##Bureautique##Autre

Bon à savoir : Le script plus ci-dessus permet de créer une liste (si la variable de sortie est déclarée comme étant une liste)

Plus d’informations sur les méthodes

Documentation externe sur les méthodes :

Cas d’utilisation sous Iterop

Exemple de script utilisable sous Iterop :

// Dans les variables du processus on a :
var tache_tableauDesPersonnes = '[{"nom":"Dupont", "prenom" : "Julien", "age":4},{"nom":"Dupond", "prenom" : "Marie", "age":26},{"nom":"Dupont", "prenom" : "Marc", "age":32}]';

//_______________________________________________________
// Le script
var js_Tableau = JSON.parse(tache_tableauDesPersonnes);
var js_nombreDePersonne = js_Tableau.length;

//On remplace les ages par les années de naissance
var js_AnneeEnCours = new Date().getFullYear();
js_Tableau.forEach(function(personne) {
  personne.birthdate=js_AnneeEnCours-personne.age;
  delete personne.age;
});

// On ajoute une personne
var js_NouvellePersonne = {};
js_NouvellePersonne.nom = "Dupont";
js_NouvellePersonne.prenom = "Michèle";
js_NouvellePersonne.birthdate = 2012;
js_Tableau.push(js_NouvellePersonne);

// On récupère uniquement la première personne
var js_premierePersonne = js_Tableau.shift();

// On ne garde que ceux qui sont nés dans les années 2000
var js_TableauDesPersonnesNeesDansLesAnnees2000 = js_Tableau.filter(function(personne){
    return personne.birthdate > 1999;
});

// On ne garde que les ages 
var js_TableauDesannees = js_Tableau.map(function(personne){
    return personne.birthdate;
});
var js_StringDesAnneesDeNaissance = js_TableauDesannees.join("##");

// En oubliant pas de mettrre cette variable en type liste
io.set("script_datesDeNaissance",js_StringDesAnneesDeNaissance); 

io.set("script_nouveauTableauCompletAvecDates", JSON.stringify(js_Tableau));
// La variable script_nouveauTableauCompletAvecDates est une variable composée dont la structure utilise birthdate plutot que age
Updated on 11 février 2021

Was this article helpful?

Related Articles