Javascript discret

Le JavaScript discret (unobtrusive JavaScript) est une pratique dans la programmation informatique en JavaScript. Cette pratique n'est pas décrite par une norme. Cette pratique consiste en la séparation du code HTML et du JavaScript.

Origine de la méthode

Le JavaScript a une réputation de langage de script limité et mal fait, inadapté à des développements massifs. Cette réputation est due à une longue accumulation de mauvaises pratiques, mais aussi à une implémentation différente d'un navigateur à l'autre.

La récente émergence de standards appliqués aux navigateurs, de Framework JavaScript (jQuery, Prototype, Archetype…) et les premiers débogueurs de bonne qualité rendent possible la production d'un JavaScript organisé et évolutif.

Le JavaScript discret peut être vu comme une partie du mouvement des standards web.

Séparation du HTML et du JavaScript

Il est courant d'observer un code présenté ainsi :

<input type="text" name="date" onchange="validateDate(this);" />

L'appel JavaScript est inclus au sein du HTML. Cela rend plus difficile la lecture et la maintenance du code (ce qui vaut au JavaScript sa mauvaise réputation de code instable et difficile à maintenir), mais surtout, cela mélange la couche relevant proprement des données du document et la couche relevant du comportement de l'interface.

Il est pourtant possible de faire la même chose de la manière suivante : on réalise du pur HTML d'une part, et on attache un événement depuis un fichier JavaScript d'autre part. Ce qui donne, en HTML :

<input type="text" name="date" id="datefield" />

Et dans le fichier JavaScript :

document.getElementById( "datefield" ).addEventListener( 'change', function(){ do_something(); }, false );

Cette façon est appelée discrète car l'association avec l'action JavaScript n'est plus incluse dans le HTML mais se réalise par l'assignation d'un événement sur un élément du DOM. Le code JavaScript se rattache alors sur le DOM par la sélection de l'attribut id de l'élément HTML.

Bonnes pratiques

L'essence même du concept de JavaScript discret se trouve dans la séparation des couches. Il se voit donc appliquer un certain nombre de principes :

1. Un respect strict du DOM du W3C
2. D'une manière plus générale, l'utilisation de concepts déjà présents dans d'autres langages de programmation comme l'encapsulation, les couches d'abstraction, les conventions de nommage, l'utilisation des design pattern appropriés et des tests systématiques.