Devoir de synthèse n°1 STI : tableaux en JavaScript, calcul de l'IMC, menu de navigation

Exercice 1 : fonctions sur les tableaux (6 pts)

Écrire en JavaScript les trois fonctions suivantes, sans utiliser les méthodes sort, reverse, filter, map ni reduce :

• compterSup(tab, x) renvoie le nombre d'éléments du tableau tab strictement supérieurs à x (1,5 pt).
• inverse(tab) renvoie un nouveau tableau qui contient les éléments de tab dans l'ordre inverse ; tab n'est pas modifié (1,5 pt).
• trier(tab) trie le tableau tab dans l'ordre croissant avec le tri à bulles, et le renvoie (3 pts).

Exemples : compterSup([12, 8, 15, 10], 10) donne 2 ; inverse([1, 2, 3]) donne [3, 2, 1] ; trier([5, 1, 4, 2]) donne [1, 2, 4, 5].

Exercice 2 : calculer l'IMC (8 pts)

L'indice de masse corporelle (IMC) vaut poids / (taille × taille), le poids en kg et la taille en mètres. On veut une page qui le calcule.

• 1) Écrire le formulaire HTML : une zone poids, une zone taille, un bouton « Calculer » et un paragraphe resultat. Le bouton appelle la fonction calculer() (2 pts).
• 2) Écrire la fonction nombreValide(ch, min, max) qui renvoie true si la chaîne ch représente un nombre (entier ou décimal avec un point) compris entre min et max (2 pts).
• 3) Écrire la fonction imc(poids, taille) qui renvoie l'IMC arrondi à un chiffre après la virgule, et la fonction categorie(v) qui renvoie « Maigreur » si v < 18,5, « Normal » si v < 25, « Surpoids » si v < 30, sinon « Obésité » (2 pts).
• 4) Écrire la fonction calculer() : poids valide entre 20 et 300, taille valide entre 0,5 et 2,5, sinon un message d'erreur ; si tout est correct, le paragraphe affiche par exemple « IMC : 22.9 (Normal) » (2 pts).

Exercice 3 : un menu de navigation (6 pts)

Toutes les pages d'un site ont le même menu. On le fabrique en JavaScript à partir de deux tableaux de même taille, les textes des liens et leurs adresses, par exemple : textes = ["Accueil", "Cours"] et urls = ["index.html", "cours.html"].

• 1) Écrire la fonction menu(textes, urls, page) qui renvoie le code HTML <nav> … </nav> contenant un lien <a> par case des tableaux ; le lien dont l'url est égale à page reçoit la classe actif (3 pts).
• 2) Écrire le CSS : les liens du menu sont alignés sur une ligne (flexbox), avec une marge droite de 16 pixels ; le lien actif est en gras et en blanc sur fond bleu ; un lien survolé par la souris devient orange (3 pts).

Exemple : menu(textes, urls, "cours.html") avec les tableaux ci-dessus renvoie <nav><a href="index.html">Accueil</a><a href="cours.html" class="actif">Cours</a></nav>