Appliquer la notion

On veut afficher le résultat de toutes les multiplications des nombres entre 1 et 10.

Pour obtenir un résultat similaire à :

1
x 	[1]	[2]	[3]	[4]	[5]	[6]	[7]	[8]	[9]	[10]
2
[1] 	1 	2 	3 	4 	5 	6 	7 	8 	9 	10
3
[2] 	2 	4 	6 	8 	10 	12 	14 	16 	18 	20
4
[3] 	3 	6 	9 	12 	15 	18 	21 	24 	27 	30
5
[4] 	4 	8 	12 	16 	20 	24 	28 	32 	36 	40
6
[5] 	5 	10 	15 	20 	25 	30 	35 	40 	45 	50
7
[6] 	6 	12 	18 	24 	30 	36 	42 	48 	54 	60
8
[7] 	7 	14 	21 	28 	35 	42 	49 	56 	63 	70
9
[8] 	8 	16 	24 	32 	40 	48 	56 	64 	72 	80
10
[9] 	9 	18 	27 	36 	45 	54 	63 	72 	81 	90
11
[10] 	10 	20 	30 	40 	50 	60 	70 	80 	90 	100

Pour cela, on a écrit le programme JavaScript suivant :

1
var result = 'x '
2
for (let i = 0; i < 11; i++) {
3
  for (let j = 0; j < 11; j++) {
4
    if (i === 0 || j > 0) {
5
      // Formattage pour l'en-tête
6
      result = result + '[' + j + ']'
7
    }
8
    if (j === 0 && i > 0) {
9
      // Formattage pour la première colonne
10
      result = result + '[' + i + '] '
11
    }
12
    if (i > 0 && j > 0) {
13
      // Intérieur du tableau
14
      result = result + (i * j) + ' '
15
    }
16
    result = result + '\t'
17
  }
18
  result = result + '\n'
19
}
20
21
console.log(result)
Question
Exécuter ce script. Quel est le résultat ?
Solution
On n'obtient pas d'erreur mais on obtient un mauvais résultat :
1
x [0]	[1]	[2]	[3]	[4]	[5]	[6]	[7]	[8]	[9]	[10]	
2
[1] 	[1]1 	[2]2 	[3]3 	[4]4 	[5]5 	[6]6 	[7]7 	[8]8 	[9]9 	[10]10 	
3
[2] 	[1]2 	[2]4 	[3]6 	[4]8 	[5]10 	[6]12 	[7]14 	[8]16 	[9]18 	[10]20 	
4
[3] 	[1]3 	[2]6 	[3]9 	[4]12 	[5]15 	[6]18 	[7]21 	[8]24 	[9]27 	[10]30 	
5
[4] 	[1]4 	[2]8 	[3]12 	[4]16 	[5]20 	[6]24 	[7]28 	[8]32 	[9]36 	[10]40 	
6
[5] 	[1]5 	[2]10 	[3]15 	[4]20 	[5]25 	[6]30 	[7]35 	[8]40 	[9]45 	[10]50 	
7
[6] 	[1]6 	[2]12 	[3]18 	[4]24 	[5]30 	[6]36 	[7]42 	[8]48 	[9]54 	[10]60 	
8
[7] 	[1]7 	[2]14 	[3]21 	[4]28 	[5]35 	[6]42 	[7]49 	[8]56 	[9]63 	[10]70 	
9
[8] 	[1]8 	[2]16 	[3]24 	[4]32 	[5]40 	[6]48 	[7]56 	[8]64 	[9]72 	[10]80 	
10
[9] 	[1]9 	[2]18 	[3]27 	[4]36 	[5]45 	[6]54 	[7]63 	[8]72 	[9]81 	[10]90 	
11
[10] 	[1]10 	[2]20 	[3]30 	[4]40 	[5]50 	[6]60 	[7]70 	[8]80 	[9]90 	[10]100 	
Il y a un problème de logique dans ce programme qui affiche des nombres en trop entre crochets.
Question
Au vu du problème précédent de formatage qui ajoute des crochets, on déduit que ce bug est nécessairement présent dans ce bloc :
1
if (i === 0 || j > 0) {
2
  // Formattage pour l'en-tête
3
  result = result + '[' + j + ']'
4
} 
5
if (j === 0 && i > 0) {
6
  // Formattage pour la première colonne
7
  result = result + '[' + i + '] '
8
}
Afin de déboguer ce morceau de code on met en place cet autre morceau de code, qui supprime les boucles pour se concentrer sur le bug en lui-même.
1
const i = 4
2
const j = 3
3
4
result = ''
5
6
7
if(i == 0 || j > 0) {
8
  // Formattage pour l'en-tête
9
  result = result + '[' + j + ']'
10
} 
11
if(j == 0 && i > 0) {
12
  // Formattage pour la première colonne
13
  result = result + '[' + i + '] '
14
} 
15
16
console.log(result)
Exécuter ce bloc et trouver d'où provient le problème.
Solution
On obtient le résultat suivant :
1
[3]
Or dans la situation suivante, nous devrions être à l'intérieur du tableau et il ne devrait donc ne pas y avoir un tel affichage avec un crochet.
Du fait des valeurs de i et j, on en déduit que c'est la valeur de j qui est affichée et ainsi que le test a un problème. En effet, il faut nécessairement que i soit nul et que j soit positif strictement. Ainsi, on déduit que le premier test est incorrect.
Question
Corriger ce bloc et exécuter l'ensemble du code.
Solution
Il faut corriger le code change le test pour vérifier que i soit nul et que j soit positif :
1
if(i === 0 && j > 0){
2
  // Formattage pour l'en-tête
3
  result = result + '[' + j + ']'
4
} 
L'ensemble du code est :
1
var result = 'x '
2
for (let i = 0; i < 11; i++) {
3
  for (let j = 0; j < 11; j++) {
4
    if (i === 0 && j > 0) {
5
      // Formattage pour l'en-tête
6
      result = result + '[' + j + ']'
7
    } 
8
    if (j === 0 && i > 0) {
9
      // Formattage pour la première colonne
10
      result = result + '[' + i + '] '
11
    } 
12
    if (i > 0 && j > 0) {
13
      // Intérieur du tableau
14
      result = result + (i * j) + ' '
15
    }
16
    result = result + '\t'
17
  }
18
  result = result + '\n'
19
}
20
21
console.log(result)
On obtient bien le résultat souhaité, à savoir :
1
x 	[1]	[2]	[3]	[4]	[5]	[6]	[7]	[8]	[9]	[10]	
2
[1] 	1 	2 	3 	4 	5 	6 	7 	8 	9 	10 	
3
[2] 	2 	4 	6 	8 	10 	12 	14 	16 	18 	20 	
4
[3] 	3 	6 	9 	12 	15 	18 	21 	24 	27 	30 	
5
[4] 	4 	8 	12 	16 	20 	24 	28 	32 	36 	40 	
6
[5] 	5 	10 	15 	20 	25 	30 	35 	40 	45 	50 	
7
[6] 	6 	12 	18 	24 	30 	36 	42 	48 	54 	60 	
8
[7] 	7 	14 	21 	28 	35 	42 	49 	56 	63 	70 	
9
[8] 	8 	16 	24 	32 	40 	48 	56 	64 	72 	80 	
10
[9] 	9 	18 	27 	36 	45 	54 	63 	72 	81 	90 	
11
[10] 	10 	20 	30 	40 	50 	60 	70 	80 	90 	100