Médiaforma

All posts tagged tableaux

Pour définir un tableau, vous utiliserez la balise <table></table>. Chacune des lignes du tableau sera repérée par la balise <tr> </tr> et chacune des colonnes d’une ligne par la balise <td> </td>.

Voici un exemple élémentaire de tableau contenant deux lignes et trois colonnes :

Pour mieux visualiser les cellules du tableau, nous allons leur ajouter des bordures avec l’attribut border de la balise <table> :

Comme vous pouvez le voir la taille des cellules s’adapte à leur contenu, tout en conservant une cohérence sur les colonnes. Ainsi, la largeur d’une colonne sera définie par la cellule dont le contenu est le plus large. Dans l’exemple précédent, la cellule qui contient le mot “quatrième” fixe la largeur de la première colonne, et la cellule qui contient le mot “troisième” fixe la largeur de la troisième colonne.


Dans cette rubrique, je vais vous présenter quelques pseudo-sélecteurs CSS dédiés aux tableaux.

  • :first-child est le premier élément ;
  • :last-child est le dernier élément ;
  • :empty correspond aux éléments vides.

Nous ferons nos essais dans ce document :

Les lignes 10 à 17 définissent un tableau de 6 lignes sur 3 colonnes et placent des données dans certaines de ses cellules :

Pour colorer en rouge l’arrière-plan de la première ligne du tableau, nous insérons la ligne suivante entre les balises <style> et </style> :

tr:first-child { background-color: red; }

Voici le résultat :

Pour colorer en rouge la dernière colonne du tableau, nous insérons la ligne suivante entre les balises <style> et </style> :

tr:last-child { background-color: red; }

Voici le résultat :

Enfin, pour colorer en rouge toutes les cellules vides, nous insérons la ligne suivante entre les balises <style> et </style> :

td:empty { background-color: red; }

Voici le résultat :


Voici un deuxième exercice un peu plus complexe.
Ecrivez le code nécessaire pour trier par ordre alphabétique sur les clés et sur tous les niveaux ce tableau de tableau :
$chiffres = array("Romain" => array("un"=>"I", "deux"=>"II", "trois"=>"III", "quatre"=>"IV", "cinq"=>"V"),
"Arabe" => array("un"=>"1", "deux"=>"2", "trois"=>"3", "quatre"=>"4", "cinq"=>"5"));

Solution

Faites une pause dans la vidéo pour vous permettre de saisir le code. Poursuivez la vidéo pour voir la solution.
Vous vous en doutez certainement, la solution de ce problème réside dans la définition d’une fonction récursive. Pour bien faire les choses, nous définirons deux fonctions :
Une responsable du tri des données et une responsable de leur affichage.
Commencez par définir le tableau associatif $chiffres.
Cette opération terminée, appelez les fonctions trier et afficher en leur transmettant le tableau $chiffres.
Pour être en mesure de modifier les données de façon durable (c’est-à-dire en dehors de la fonction), la fonction trier travaille avec l’adresse du tableau qui lui est passé et non avec le tableau lui-même.
Un tri croissant est effectué sur les clés. Puis une boucle foreach parcourt tous les éléments du tableau. Un test est effectué sur chaque valeur. S’il s’agit d’un tableau, il est passé de façon récursive à la fonction trier pour effectuer un tri croissant sur ses valeurs.
La fonction affiche est également récursive. Elle utilise une boucle foreach pour parcourir tous les éléments du tableau associatif. Pour chaque couple clé/valeur, la clé est affichée. Si la valeur est un tableau, il est passé de façon récursive à la fonction affiche. Dans le cas contraire, il est affiché, suivi d’un passage à la ligne.
Remarquez les balises blockquote et /blockquote autour de la boucle foreach. C’est grâce à ces instructions que les éléments affichés sont indentés vers la droite.

<?php
function trier(&$a){
ksort($a);
foreach($a as $cle=>&$valeur) {
if (is_array($valeur))
trier($valeur);
}
}

function afficher($a){
echo "<blockquote>";
foreach($a as $cle=>$valeur) {
echo $cle." : ";
if (is_array($valeur))
afficher($valeur);
else
echo $valeur."
";
}
echo "

";
}

$chiffres = array("Romain" => array("un"=>"I", "deux"=>"II", "trois"=>"III", "quatre"=>"IV", "cinq"=>"V"),
"Arabe" => array("un"=>"1", "deux"=>"2", "trois"=>"3", "quatre"=>"4", "cinq"=>"5"));
trier($chiffres);
afficher($chiffres);
?>


Définissez un tableau numéroté qui contient les valeurs suivantes :

Jean, Pierre, Paul, Michel, Hélène, Sandrine, Christel, Isabelle, Evariste

Utilisez une boucle for pour afficher tous les éléments du tableau dans une liste à puces.

Faites une pause dans la vidéo pour vous permettre de saisir le code. Poursuivez la vidéo pour voir la solution.

Solution

Le tableau est défini à l’aide d’une instruction array.

Pour afficher son contenu dans une liste à puces, il suffit de parcourir son contenu avec une boucle for et de faire précéder chaque élément affiché par la balise li.

Remarquez également les balises ul et /ul qui encadrent les balises li.

 

<?php

$prenoms = array("Jean", " Pierre", "Paul", "Michel", "Hélène", "Sandrine", "Christel", "Isabelle", "Evariste");

echo ("<ul>");

for ($i=0; $i<9; $i++)

echo ("<li>".$prenoms[$i]);

echo("</ul>");

?>


Il existe deux types de tableaux en PHP : numérotés et associatifs.

Tableaux numérotés

Les tableaux numérotés consistent en une suite de valeurs. Chacune des valeurs est accessible par son rang dans la liste, en commençant au rang 0.

Pour créer un tableau numéroté, vous utiliserez la fonction array() :

$taille = array("très petit", "petit", "moyen", "grand", "très grand");

Pour accéder à un élément du tableau, utilisez une instruction du type suivant :

$taille[i]

Où i représente l’index de l’élément à accéder dans le tableau.


Les tableaux sont définis avec les balises suivantes :

Balise Signification
<table> </table>
Tableau
<tr></tr>
Ligne
<th></th>
Cellules d’en-tête
<td></td>
Les autres cellules

Java – Tableaux

Categories: java
Comments: No

Pour définir un tableau, vous utiliserez l’une des deux syntaxes suivantes :

type[] nom;
type nom[];

type est un type de données prédéfini (byte, short, int, long, float, double, char, boolean) ou un objet quelconque, et nom le nom de l’objet tableau.

Les tableaux Java sont par définition monodimensionnels. Cependant, il est possible de définir un tableau de tableau, et par là même d’obtenir autant de dimensions que souhaité.

Exemples :

int TableauEntier[];
double[] d1, d2;
byte[][] DeuxDim;
String Chaines[];

La première instruction définit un tableau d’entiers nommé TableauEntier.

La deuxième instruction définit deux tableaux de double nommés d1 et d2.

La troisième instruction définit un tableau de byte à deux dimensions nommé DeuxDim.

Enfin, la quatrième instruction définit un tableau de String nommé Chaines.

Comme vous vous en doutez, les instructions que nous venons de lister ne fixent pas le nombre d’éléments contenus dans le tableau. La taille du tableau est donc adaptée dynamiquement, en fonction des instructions d’affectation rencontrées.

Si vous souhaitez fixer la taille d’un tableau, vous utiliserez indifféremment l’une des trois instructions suivantes :

Nom[] = new type[NbEléments];
type Nom[] = new type[NbEléments];
type Nom[] = {Liste d'éléments};

Nom est le nom du tableau et NbEléments le nombre d’éléments du tableau.

Exemples :

Les trois instructions ci-après sont équivalentes, à ceci près que la troisième initialise le tableau, alors que les deux premières ne font que fixer sa dimension :

TableauEntier = new int[7];
int TableauEntier[] = new int[7];
int TableauEntier[] = {1, 2, 3, 4, 5, 6, 7};

Remarque

Lorsque le nombre d’éléments d’un tableau a été fixé avec une des instructions précédentes, il n’est plus possible de modifier sa dimension. Vous utiliserez la propriété length pour connaître le nombre d’éléments d’un tableau :

int[] Hauteurs = {1, 2, 6, 123, 5545};
System.out.println(Hauteurs.length);

Pour connaître le nombre d’éléments d’un tableau bidimensionnel, vous utiliserez les instructions suivantes :

int[][] Hauteurs = new int[3][5];
System.out.println(Hauteurs.length);
System.out.println(Hauteurs[0].length);

L’expression Hauteurs.length fait référence à la première dimension du tableau. Elle renvoie donc la valeur 3. Quant à l’expression Hauteurs[0].length, elle fait référence à la seconde dimension du tableau. Elle renvoie donc la valeur 5.

Accéder aux éléments d’un tableau

Par définition, le premier élément d’un tableau Java se trouve à l’index 0. Par exemple, si C est un tableau défini par :

int C[] = new int[10];

L’expression C[4] fait référence au cinquième élément du tableau.

Si DeuxDim est un tableau bidimensionnel défini comme suit :

byte DeuxDim[][] = new byte [5][3];

L’élément d’index 1,3 sera accédé par l’instruction suivante :

DeuxDim[1][3] = Valeur;

Exercice

Ecrivez quelques lignes de code pour créer un tableau de 10 éléments, y stocker le carré des 10 premiers entiers et afficher le résultat dans la console.

Solution

public class Carres{
  public static void main (String args[]) {
    int C[] = new int[10];
    int i;
    for (i = 0; i<10; i++)
      C[i]= i*i;
    for (i = 0; i<C.length; i++)
      System.out.println(i + "^2 = " + C[i]);
  }
}