La coloration de code en fonction de la portée des variables.

Une alternative à la coloration syntaxique

:salut:

Coloration en fonction de la portée des variables,
une alternative à la coloration syntaxique

On connait tous la coloration syntaxique liée à la syntaxe du langage afin d'améliorer la lisibilité de notre code pour mieux l'appréhender.
Mais parfois, ne serait-il pas mieux de surligner le code en fonction de la portée des variables plutôt que de mettre en valeur la syntaxe ?

C'est une idée proposée à la base par Douglas Crockford (JSON, JSLint) via un post sur Google+. C'est d'ores et déjà intégré à JSLint (plus de détails sur l'utilisation dans le post de D. Crockford) et Daniel Lamb (un ingénieur Front-End) propose une mise en application.

Voici un exemple avec quatre niveaux d'imbrications.

Coloration syntaxique :
var monNameSpace = (function () {
var maVar;
maVar = "scope 1";

var direBonjour = function() {
console.log(maVar);
};

return {
setMaVar: function(valeur){
maVar = valeur;
},

getMaVar: function(){
return maVar;
},

log: function() {
var autreVar = "Hello";
function direBonjourComment(methode) {
console.log(methode);
}
direBonjourComment(autreVar);
direBonjour();
}
};

})();

monNameSpace.log();

Coloration en fonction de la portée :


Si vous utilisez Vim, cela serait actuellement en cours d'intégration.

Sources :
Google+ de Paul Irish
Exemples sur GitHub