Javascript

javascript
?
Informations générales
Extensions courantes	.js
Paradigme	Multiparadigme , programmation fonctionnelle , ​programmation basée sur des prototypes , impératif , interprété ( scripting )
Apparaît dans	4 décembre 1995
Élaboré par	Netscape Communications , Fondation Mozilla
Dernière version stable	ECMAScript 2021 (01 juin 2021 (1 an, 4 mois et 15 jours))
système de typage	faible, dynamique, canard
implémentations	SpiderMonkey , Rhino , KJS , JavaScriptCore , V8 , Chakra .
dialectes	ECMAScript
influencé par	Java , Perl , Soi , Python , C , Schéma
A influencé	ObjectiveJ, JScript .NET, TIScript

JavaScript (couramment abrégé JS ) est un langage de programmation interprété , dialecte du standard ECMAScript . Il est défini comme orienté objet , basé sur des prototypes , impératif , faiblement typé et dynamique .

Il est principalement utilisé côté client , implémenté dans le cadre d'un navigateur Web permettant des améliorations de l'interface utilisateur et des pages Web dynamiques et JavaScript côté serveur ( Server-side JavaScript ou SSJS ). Son utilisation dans des applications extérieures au Web , par exemple dans des documents PDF , des applications de bureau (principalement des widgets ) est également importante.

Depuis 2012, tous les navigateurs modernes prennent entièrement en charge ECMAScript 5.1, une version de JavaScript. Les navigateurs plus anciens prennent en charge au moins ECMAScript 3. La sixième édition a été publiée en juillet 2015. ]

JavaScript a été conçu avec une syntaxe similaire à C++ et Java , ​ bien qu'il adopte des noms et des conventions du langage de programmation Java. Cependant, Java et JavaScript ont une sémantique et des objectifs différents. Leur relation est purement commerciale, après le rachat du créateur de Java (Sun Microsystems) à Nestcape Navigator (créateur de LiveScript) et le changement de nom du langage de programmation.

Tous les navigateurs modernes interprètent le code JavaScript intégré dans les pages Web. Pour interagir avec une page web, le langage JavaScript est fourni avec une implémentation du Document Object Model (DOM). Javascript est le seul langage de programmation que les navigateurs comprennent nativement.

Traditionnellement, il a été utilisé dans les pages Web HTML pour effectuer des opérations et uniquement dans le cadre de l' application cliente , sans accès aux fonctions du serveur . Il est actuellement largement utilisé pour envoyer et recevoir des informations du serveur avec l'aide d'autres technologies telles que AJAX . JavaScript est interprété par l' agent utilisateur lorsque les instructions sont téléchargées avec le code HTML .

Depuis la sortie de juin 1997 de la norme ECMAScript 1, il existe les versions 2, 3 et 5, qui est aujourd'hui la plus utilisée (la version 4 a été abandonnée ). En juin 2015, la version ECMAScript 6 a été fermée et publiée ]

Historique

Naissance de JavaScript

JavaScript a été développé à l'origine par Brendan Eich de Netscape sous le nom de Mocha , qui a ensuite été renommé LiveScript , devenant finalement JavaScript. Le changement de nom a à peu près coïncidé avec le moment où Netscape a ajouté la prise en charge de la technologie Java à son navigateur Web Netscape Navigator dans la version 2002 en décembre 1995. La dénomination a semé la confusion, donnant l'impression que le langage est une extension de Java, et a été considérée par beaucoup comme stratégie marketing pour Netscape afin de gagner en prestige et d'innover dans le domaine des nouveaux langages de programmation web. ]

"JAVASCRIPT" est une marque déposée d' Oracle Corporation . Il est utilisé sous licence par des produits créés par Netscape Communications et des entités actuelles telles que la Fondation Mozilla . ]

Microsoft a nommé son dialecte de JavaScript " JScript ", pour éviter les problèmes de branding. JScript a été adopté dans la version 3.0 d' Internet Explorer , publiée en août 1996, et incluait la prise en charge d' Effect 2000 pour les fonctions de date, une différence par rapport à celles basées à l'époque. Les dialectes peuvent sembler si similaires que les termes "JavaScript" et "JScript" sont souvent utilisés de manière interchangeable, mais la spécification JScript est incompatible avec la spécification ECMA à bien des égards.

Pour éviter ces incompatibilités, le World Wide Web Consortium a conçu la norme Document Object Model (DOM, ou Document Object Model en espagnol), qui intègre Konqueror , les versions 6 d' Internet Explorer et de Netscape Navigator , Opera version 7, Mozilla Application Suite et Mozilla Firefox . dès sa première version. ^{[ citation nécessaire ]}

En 1997, les auteurs ont proposé que JavaScript soit adopté comme standard par l'Association européenne des fabricants d'ordinateurs ECMA , qui malgré son nom n'est pas européenne mais internationale, basée à Genève. En juin 1997, il a été adopté comme norme ECMA, sous le nom ECMAScript . Peu de temps après également en tant que norme ISO .

JavaScript côté serveur

Netscape a introduit une implémentation de script côté serveur avec Netscape Enterprise Server , sorti en décembre 1994 (peu après la sortie de JavaScript pour les navigateurs Web). ​ À partir du milieu des années 2000, il y a eu une prolifération d'implémentations JavaScript côté serveur. Node.js est l'un des exemples notables de JavaScript côté serveur, utilisé dans de grands projets. ]

Développements ultérieurs

JavaScript est devenu l'un des langages de programmation les plus populaires et les plus utilisés sur Internet. Au début, cependant, de nombreux développeurs ont désapprouvé le langage car son public cible était composé d'éditeurs d'articles et d'autres amateurs, entre autres raisons. L'arrivée d' Ajax a ramené JavaScript au premier plan et a attiré l'attention de nombreux autres programmeurs. En conséquence, il y a eu une prolifération d'un ensemble de frameworks et de bibliothèques de portée générale, améliorant les pratiques de programmation JavaScript et une utilisation accrue de JavaScript en dehors des navigateurs Web , comme en témoigne la prolifération des environnements JavaScript côté Web. serveur . En janvier 2009, le projet CommonJS a été lancé dans le but de spécifier une bibliothèque à utiliser par des tâches courantes principalement pour le développement en dehors du navigateur Web. ]

En juin 2015, la norme ECMAScript 6 a été fermée et publiée ​ avec un support irrégulier entre les navigateurs ​ et qui fournit à JavaScript des fonctionnalités avancées qui manquaient et sont couramment utilisées dans d'autres langages, tels que en tant que modules pour l'organisation du code, véritables classes pour la programmation orientée objet , expressions fléchées, itérateurs, générateurs ou promesses pour la programmation asynchrone.

La version 7 d'ECMAScript est connue sous le nom d'ECMAScript 2016, et est la dernière version disponible, sortie en juin 2016. Il s'agit de la première version à utiliser une nouvelle procédure de publication annuelle et un processus de développement ouvert. ]

Fonctionnalités

Les fonctionnalités suivantes sont communes à toutes les implémentations conformes à la norme ECMAScript, sauf si vous spécifiez explicitement le contraire.

Impératif et structuré

JavaScript prend en charge une grande partie de la structure de programmation du C (par exemple, instructions if, boucles for, instructions switch, etc.). Avec une mise en garde, en partie : en C, les variables sont étendues au bloc dans lequel elles ont été définies ; cependant JavaScript ne le supporte pas, car la portée des variables est celle de la fonction dans laquelle elles ont été déclarées. Cela change avec la version ECMAScript 2015, car elle ajoute la prise en charge de la portée des blocs via le mot-clé . Comme en C, JavaScript fait une distinction entre les expressions et les déclarations. Une différence syntaxique par rapport à C est l'insertion automatique de points-virgules, c'est-à-dire qu'en JavaScript, les points-virgules qui terminent une phrase peuvent être omis. ] let

Dynamique

typage dynamique

Comme dans la plupart des langages de script , le type est attaché à la valeur, pas à la variable. Par exemple, une variable xpeut à un moment être liée à un nombre et plus tard liée à une chaîne . JavaScript prend en charge plusieurs façons de vérifier le type d'un objet, y compris le type canard . Une façon de le savoir est d' utiliser le mot - clé typeof.

objectivé

JavaScript est composé presque entièrement d' objets . Les objets en JavaScript sont des tableaux associatifs , améliorés par l'inclusion de prototypes (voir ci-dessous). Les noms de propriété d'objet sont des clés de type string: obj.x = 10et obj['x'] = 10sont équivalents, la notation par points étant syntaxique sugar . Les propriétés et leurs valeurs peuvent être créées, modifiées ou supprimées au moment de l'exécution. La plupart des propriétés d'un objet (et celles qui sont incluses dans la chaîne d'héritage prototypique) peuvent être énumérées via l'instruction loop for... in. JavaScript a un petit nombre d'objets prédéfinis tels que Functionet Date.

Évaluation d'exécution

JavaScript inclut la possibilité evald'évaluer les expressions exprimées sous forme de chaînes au moment de l'exécution. Pour cette raison, il est recommandé evalde l'utiliser avec prudence et de choisir d'utiliser la fonction JSON.parse()autant que possible, car elle peut être beaucoup plus sûre.

Fonctionnel

Caractéristiques de première classe

Les fonctions sont souvent qualifiées de citoyens de première classe ; ce sont des objets en eux-mêmes. En tant que tels, ils ont des propriétés et des méthodes, telles que .call()et .bind(). ​ Une fonction imbriquée est une fonction définie à l'intérieur d'une autre. Ceci est créé chaque fois que la fonction externe est appelée. Aussi, chaque fonction créée forme une fermeture ; est le résultat de l'évaluation d'une portée contenant une ou plusieurs variables dépendantes d'une autre portée externe, y compris des constantes, des variables locales et des arguments de la fonction externe appelante. Le résultat de l'évaluation de cette fermeture fait partie de l'état interne de chaque objet fonction, même après que la fonction externe a terminé son évaluation. ]

Prototypique

prototypes

JavaScript utilise des prototypes au lieu de classes pour l'utilisation de l' héritage . Il est possible d'émuler de nombreuses fonctionnalités fournies par les classes dans les langages traditionnels orientés objet en prototypant en JavaScript. ]

Fonctions comme constructeurs d'objets

Les fonctions se comportent également comme des constructeurs. Préfixez un appel de fonction avec le mot clé newcreate une nouvelle instance d'un prototype, qui hérite des propriétés et des méthodes du constructeur (y compris les propriétés du prototype Object). ECMAScript 5 fournit la méthode Object.create, permettant la création explicite d'une instance sans avoir à hériter automatiquement du prototype d'objet (dans les environnements plus anciens, le prototype de l'objet créé peut apparaître comme null). La prototypepropriété constructeur détermine l'objet utilisé pour le prototype interne des objets nouvellement créés. De nouvelles méthodes peuvent être ajoutées en modifiant le prototype de l'objet utilisé comme constructeur. Les constructeurs prédéfinis en JavaScript, comme Arrayu Object, ont également des prototypes qui peuvent être modifiés. Bien que cela soit possible, il est considéré comme une mauvaise pratique de modifier le prototype de Objectcar la plupart des objets en Javascript héritent des méthodes et des propriétés de l'objet prototype, objets qui peuvent s'attendre à ne pas avoir été modifiés. ]

Autres fonctionnalités

Environnement d'exécution

JavaScript dépend généralement de l'environnement dans lequel il s'exécute (par exemple, dans un navigateur Web ) pour fournir des objets et des méthodes par lesquels les scripts peuvent interagir avec le "monde extérieur". En fait, cela dépend de l'environnement pour pouvoir offrir la possibilité d'inclure ou d'importer des scripts (par exemple, en HTML via la balise <script>). (Ce n'est pas une fonctionnalité de langage, mais c'est commun à la plupart des implémentations JavaScript.)

fonctions variadiques

Un nombre indéfini de paramètres peut être passé à la fonction. La fonction peut y accéder via les paramètres ou également via l'objet local arguments. Les fonctions variadiques peuvent également être créées à l'aide de .apply().

Fonctions comme méthodes

Contrairement à de nombreux langages orientés objet, il n'y a pas de distinction entre la définition de fonction et la définition de méthode . Au contraire, la distinction se produit lors de l'appel de la fonction ; une fonction peut être appelée comme une méthode. Lorsqu'une fonction est appelée en tant que méthode d'un objet, le mot clé this, qui est une variable locale à la fonction, représente l'objet qui a appelé la fonction.

Les tableaux et la définition littérale des objets

Comme de nombreux langages de script, les tableaux et les objets ( tableaux associatifs dans d'autres langages) peuvent être créés avec une syntaxe abrégée. En fait, ces littéraux constituent la base du format de données JSON .

Expressions régulières

JavaScript prend également en charge les expressions régulières de la même manière que Perl , qui fournissent une syntaxe concise et puissante pour la manipulation de texte qui est plus sophistiquée que les fonctions intégrées aux objets chaîne. ]

Extensions spécifiques au fabricant

JavaScript est officiellement sous l' organisation Mozilla Foundation et de nouvelles fonctionnalités de langage sont ajoutées périodiquement. Cependant, seuls certains moteurs JavaScript prennent en charge ces fonctionnalités :

• Les propriétés getet set(également prises en charge par WebKit, Opera, ​ ActionScript et Rhino). ]
• Clauses conditionnelles catch.
• Protocole d'itérateur adopté à partir de Python .
• Les coroutines ont également été adoptées à partir de Python.
• Génération de listes et d'expressions par compréhension également adoptée à partir de Python.
• Définissez la portée à bloquer via le mot-clé let.
• Déstructuration de tableaux et d'objets (forme limitée de correspondance de motifs).
• Expressions concrètes dans les fonctions (function(args) expr).
• ECMAScript pour XML (E4X), une extension qui ajoute le support XML natif à ECMAScript.

Syntaxe et sémantique

la dernière version du langage est ECMAScript 2016 publiée le 17 juin 2016. ]

Exemples simples

Les variables en JavaScript sont définies à l'aide du mot- clé var : ]

var  x ;  // définit la variable x, bien qu'elle n'ait pas de valeur assignée par défaut 
var  y  =  2 ;  // définit la variable y et lui attribue la valeur 2

Considérez les commentaires dans l'exemple ci-dessus, qui sont précédés de 2 barres obliques.

Il n'y a pas de fonctionnalités d' E/S incluses dans le langage ; l'environnement d'exécution le fournit déjà. La spécification ECMAScript dans son édition 5.1 mentionne : ]

... en effet, il n'y a aucune disposition dans cette spécification pour l'entrée ou la sortie de données externes pour les résultats calculés.

Cependant, la plupart des environnements d'exécution ont un objet appelé console​ qui peut être utilisé pour imprimer par le flux de sortie de la console de débogage. Voici un programme simple qui affiche "Hello world!" :

consoler . log ( "Bonjour tout le monde !" );

Une fonction récursive :

fonction  factorielle ( n )  { 
    if  ( n  ===  0 )  { 
        return  1 ; 
    } 
    renvoie  n  *  factoriel ( n  -  1 ); 
}

Exemples de fonction anonyme (ou fonction lambda ) et d'une fermeture :

var  displayClosure  =  fonction ()  { 
    var  count  =  0 ; 
    fonction de retour  () { retour ++ compte ; } ; } var inc = displayClosure (); inc (); // retourne 1 inc (); // retourne 2 inc (); // renvoie 3  
         
    

   
 
 
 

Les expressions auto-invoquantes permettent aux fonctions de lui transmettre des variables par paramètre dans leurs propres fermetures.

var  v ; 
v  =  1 ; 
var  getValue  =  ( fonction ( v )  { 
  fonction de retour  () { retour v ;}; } ( v ));  


v  =  2 ;

obtenirValeur ();  // 1

Exemples plus avancés

Le code suivant montre diverses fonctionnalités de JavaScript.

/* Trouver le plus petit commun multiple (LCM) de deux nombres */ 
function  LCMCalculator ( x ,  y )  {  // fonction constructeur 
    var  checkInt  =  function  ( x )  {  // fonction interne 
        if  ( x  %  1  !==  0 )  { 
            throw  new  TypeError ( x  +  " n'est pas un entier" );  // lance une exception 
        } 
        return  x ; 
    } ; 
    cela . a  =  checkInt ( x )  // les points-virgules sont facultatifs 
    this . b  =  checkInt ( et ); 
} 
// Le prototype des instances d'objet créées par le constructeur est celui de la propriété "prototype" du constructeur. 
Calculatrice LCMC . prototype  =  {  // objet défini comme 
    constructeur littéral :  LCMCalculator ,  // lorsque nous réaffectons un prototype, nous définissons correctement sa propriété de constructeur 
    gcd :  function  ()  {  // méthode qui calcule le plus grand facteur commun 
        // Algorithme d'Euclide : 
        var  a  =  Mathématiques . abs ( this . a ),  b  =  Math . abs ( ce . b ),  t ; 
        if  ( a  <  b )  { 
            // variables d'échange 
            t  =  b ; 
            b  =  un ; 
            un  =  t ; 
        } 
        tandis que  ( b  !==  0 )  { 
            t  =  b ; 
            b  =  un  %  b ; 
            un  =  t ; 
        } 
        // Nous n'avons besoin de calculer le GCF qu'une seule fois, donc nous "redéfinissons" cette méthode. 
        // (Ce n'est pas vraiment un remplacement - il est défini sur l'instance elle-même, donc 
        // this.gcd fait référence à ce « remplacement » plutôt qu'à LCMCalculator.prototype.gcd). 
        // Aussi, 'gcd' === "gcd", this['gcd'] === this.gcd 
        this [ 'gcd' ]  =  function  ()  { 
            return  a ; 
        } ; 
        retourner  à ; 
    }, 
    // Les noms de propriété d'objet peuvent être spécifiés avec des chaînes délimitées par des guillemets simples (') ou des guillemets doubles ("). 
    "lcm"  :  function  ()  { 
        // Les noms de variable n'entrent pas en conflit avec les propriétés de l'objet. Par exemple : |lcm| n'est pas |this.lcm|. 
        // Ne pas utiliser |this.a * this.b| pour éviter les problèmes avec les calculs en virgule flottante. 
        var  lcm  =  this . à  /  ceci . pgcd ()  *  this . b ; 
        // Nous n'avons besoin de calculer LCM qu'une seule fois, nous "redéfinissons" donc cette méthode. 
        cela . lcm  =  fonction  ()  { 
            return  lcm ; 
        } ; 
        retour  lcm ; 
    }, 
    toString :  function  ()  { 
        return  "LCMCalculator : a = "  +  this . a  +  ", b = "  +  ceci . b ; 
    } 
} ;

// Nous définissons une fonction générique pour imprimer un résultat ; cette implémentation ne fonctionne que dans les navigateurs Web 
function  output ( x )  { 
    document . corps . appendChild ( document . createTextNode ( x )); 
    documenter . corps . appendChild ( document . createElement ( 'br' )); 
}

// Remarque : Les méthodes .map() et .forEach() du prototype Array sont définies dans JavaScript 1.6. 
// Ces méthodes sont utilisées ici pour démontrer la nature fonctionnelle inhérente du langage. 
[[ 25 ,  55 ],  [ 21 ,  56 ],  [ 22 ,  58 ],  [ 28 ,  56 ]]. map ( function  ( pair )  {  // construction littérale d'une fonction Array + mapping. 
    return  new  LCMCalculator ( pair [ 0 ],  pair [ 1 ]); 
}). sort ( function  ( a ,  b )  {  // trie la collection à l'aide de cette fonction 
    return  a . lcm ()  -  b . lcm (); 
}). forEach ( fonction  ( obj )  { 
    sortie ( obj  +  ", gcd = "  +  obj . gcd ()  +  ", lcm = "  +  obj . lcm ()); 
});

L'exemple suivant montre la sortie qui doit être affichée dans une fenêtre de navigateur.

Calculateur LCMC : a = 28, b = 56, pgcd = 28, lcm = 56
Calculateur LCMC : a = 21, b = 56, pgcd = 7, lcm = 168
Calculateur LCMC : a = 25, b = 55, pgcd = 5, lcm = 275
Calculateur LCMC : a = 22, b = 58, pgcd = 2, lcm = 638

Utilisation sur les pages Web

Voir aussi : interpréteur JavaScript et AJAX .

L'utilisation la plus courante de JavaScript consiste à écrire des fonctions qui sont intégrées dans des pages HTML et qui interagissent avec le modèle d'objet de document (DOM) de la page. Voici quelques exemples simples de cette utilisation :

• Téléchargez un nouveau contenu pour la page ou envoyez des données au serveur via AJAX sans recharger la page (par exemple, un réseau social peut permettre à l'utilisateur d'envoyer des mises à jour de statut sans quitter la page).
• Animer des éléments de page, les faire disparaître, les redimensionner, les déplacer, etc.
• Contenu interactif, par exemple, jeux et lecture audio et vidéo.
• Validation des valeurs d'entrée d'un formulaire web pour s'assurer qu'elles sont acceptables avant d'être envoyées au serveur.
• Transmission d'informations sur les habitudes de lecture et les activités de navigation des utilisateurs vers divers sites Web. Les pages Web le font souvent à des fins d'analyse Web, de suivi des publicités, de personnalisation ou à d'autres fins. ]

Étant donné que le code JavaScript peut être exécuté localement dans le navigateur de l'utilisateur (plutôt que sur un serveur distant), le navigateur peut répondre rapidement aux actions de l'utilisateur, ce qui rend une application plus réactive. D'autre part, le code JavaScript peut détecter les actions de l'utilisateur que le HTML seul ne peut pas, telles que les frappes au clavier. Des applications comme Gmail en profitent : la majeure partie de la logique de l'interface utilisateur est écrite en JavaScript, en envoyant des requêtes au serveur (par exemple, le contenu d'un message électronique). La tendance croissante à l'utilisation de la programmation Ajax exploite également cette technique.

Un moteur JavaScript (également appelé interpréteur JavaScript ou implémentation JavaScript) est un interpréteur qui interprète le code source JavaScript et exécute le script en conséquence. Le premier moteur JavaScript a été créé par Brendan Eich de Netscape Communications Corporation, pour le navigateur Web Netscape Navigator. Le moteur, appelé SpiderMonkey, est implémenté en C. Il a depuis été mis à jour (en JavaScript 1.5) pour se conformer à l'ECMA-262 édition 3. Le moteur Rhino, créé principalement par Norris Boyd (anciennement de Netscape, maintenant chez Google) est un implémentation de JavaScript en Java . Rhino, comme SpiderMonkey, est conforme à la norme ECMA-262 édition 3.

Un navigateur Web est de loin l'environnement d'hébergement le plus courant pour JavaScript. Les navigateurs Web créent souvent des objets non natifs et dépendants de l'exécution pour représenter le modèle d'objet de document (DOM) en JavaScript. Le serveur Web est un autre environnement de service commun. Un serveur Web JavaScript expose généralement ses propres objets pour représenter des objets de requête et de réponse HTTP, qu'un programme JavaScript pourrait ensuite interroger et manipuler pour générer dynamiquement des pages Web.

Étant donné que JavaScript est le seul langage pour lequel la plupart des navigateurs populaires partagent le support, il est devenu un langage vers lequel de nombreux frameworks dans d'autres langages se compilent, même si JavaScript n'a pas été conçu à de telles fins. Malgré les limitations de performances inhérentes à sa nature dynamique, la vitesse accrue des moteurs JavaScript a fait de ce langage un environnement de compilation étonnamment faisable.

Exemple de script

Voici un bref exemple de page web (conforme aux standards de la norme HTML5 ) qui utilise JavaScript pour la gestion du DOM :

<!DOCTYPE html> 
< html > 
< head > 
    < meta  charset = "utf-8" > 
    < title > Exemple simple </ title > 
</ head > 
< body > 
    < h1  id = "header" > Ceci est JavaScript </ h1 >

    < script > 
        document . corps . appendChild ( document . createTextNode ( 'Hello World!' ));
    
        var  h1  =  document . getElementById ( 'en-tête' );  // contient la référence à la balise <h1> 
        h1  =  document . getElementsByTagName ( 'h1' )[ 0 ];  // accès au même élément <h1> 
    </ script >

    < noscript > Votre navigateur ne supporte pas JavaScript, ou JavaScript est désactivé. </ noscript > 
</ body > 
</ html >

Considérations de compatibilité

Étant donné que JavaScript s'exécute dans de nombreux environnements différents, une partie importante des tests et du débogage consiste à tester et à vérifier que votre code JavaScript fonctionne correctement dans plusieurs navigateurs. L'interface DOM d'accès et de manipulation des pages Web ne fait pas partie de la norme ECMAScript, ni de JavaScript lui-même. Le DOM est défini par les efforts de normalisation du W3C , une organisation indépendante. En pratique, les implémentations de JavaScript des différents navigateurs diffèrent à la fois les unes des autres et des normes de la norme.

Pour remédier à ces différences, les auteurs de JavaScript ont peut-être pu écrire du code conforme aux normes qui fonctionnerait également correctement dans la plupart des navigateurs, ou à défaut, écrire au moins du code capable de vérifier la présence de certaines fonctionnalités du navigateur et qu'il se comporte différemment si dit fonctionnalité n'est pas disponible. Il existe des cas dans lesquels deux navigateurs peuvent implémenter la même fonctionnalité, mais avec un comportement différent, un fait qui peut aider les programmeurs à détecter quel navigateur est en cours d'exécution à ce moment et ainsi modifier le comportement de votre écriture en conséquence. ​ Les programmeurs utilisent aussi souvent des bibliothèques ou des outils qui tiennent compte des différences entre les navigateurs.

De plus, les scripts peuvent ne pas fonctionner pour certains utilisateurs. Par exemple, un utilisateur peut :

• Utilisation d'un ancien navigateur sans prise en charge complète de l'API DOM,
• Utilisez un PDA ou un navigateur de téléphone mobile qui ne peut pas exécuter JavaScript
• Désactivez l'exécution de JavaScript, par mesure de sécurité,
• Utilisation d'un navigateur vocal en raison, par exemple, d'une déficience visuelle.

Pour prendre en charge ces utilisateurs, les développeurs Web créent souvent des pages tolérantes aux pannes basées sur un agent utilisateur (type de navigateur) qui ne prend pas en charge JavaScript. En particulier, la page devrait toujours être utile sans les fonctionnalités supplémentaires que JavaScript aurait ajoutées. Une approche alternative que beaucoup trouvent préférable consiste à créer d'abord du contenu à l'aide de technologies qui fonctionnent dans tous les navigateurs, et à améliorer le contenu pour les utilisateurs qui ont activé JavaScript.

Accessibilité

En supposant que l'utilisateur n'a pas désactivé l'exécution du code JavaScript, du côté client, JavaScript doit être écrit à la fois dans le but d'améliorer l'expérience des visiteurs ayant un handicap visuel ou physique et d'éviter de cacher des informations à ces visiteurs. ]

Les lecteurs d' écran , utilisés par les aveugles et malvoyants, peuvent être pris en compte par JavaScript et ainsi pouvoir accéder et lire les éléments DOM de la page. Le code HTML écrit doit être aussi concis, navigable et sémantiquement riche que possible, que JavaScript soit exécuté ou non.

JavaScript ne doit pas être totalement dépendant des événements de la souris du navigateur et doit être accessible aux utilisateurs qui ne souhaitent pas utiliser la souris (ordinateur) pour naviguer ou qui choisissent d'utiliser uniquement le clavier. Il existe des événements indépendants de l'appareil tels que onfocuset onchangequi sont préférables dans la plupart des cas. ]

JavaScript ne doit pas être utilisé pour créer la confusion ou la désorientation de l'internaute. Par exemple, la modification ou la désactivation des fonctionnalités normales du navigateur, telles que la modification du comportement du bouton de retour arrière ou de l'événement d'actualisation, sont des pratiques qu'il est généralement préférable d'éviter. De même, le déclenchement d'événements dont l'utilisateur peut ne pas être conscient réduit le sentiment de contrôle de l'utilisateur et provoque des modifications inattendues du contenu de la page. ]

Souvent, le processus de fourniture d'une page Web complexe avec le plus haut degré d' accessibilité possible devient un problème non trivial où de nombreuses questions finissent par être débattues et exprimées, nécessitant l'engagement de chacun jusqu'au bout. Cependant, les agents utilisateurs et les technologies d'assistance pour les personnes handicapées évoluent constamment, et de nouvelles directives et informations continuent d'être publiées sur le Web. ]

Sécurité

Voir aussi : Sécurité du navigateur

JavaScript et le DOM permettent aux programmeurs de l'utiliser à mauvais escient pour introduire des scripts qui exécutent du code avec un contenu malveillant sans le consentement de l'utilisateur, compromettant ainsi la sécurité de l'utilisateur.

Les développeurs de navigateurs tiennent compte de ce risque en utilisant deux restrictions. Tout d'abord, les scripts s'exécutent dans un bac à sable où seules les actions liées au Web peuvent être effectuées, et non les tâches de programmation à usage général telles que la création de fichiers. Deuxièmement, il est limité par la même politique d'origine : les scripts d'un site Web n'ont pas accès aux informations envoyées à un autre site Web (d'un autre domaine) telles que les noms d'utilisateur, les mots de passe ou les cookies. La plupart des failles de sécurité JavaScript sont liées à des violations de l'une ou l'autre de ces deux restrictions.

Il existe des projets comme AdSafe ou Secure ECMA script (SES) qui offrent des niveaux de sécurité plus élevés, en particulier dans le code créé par des tiers (comme les publicités). ]

La politique de sécurité du contenu (CSP) est la principale méthode envisagée pour garantir que seul un code de confiance peut être exécuté sur une page Web.

Vulnérabilités intersites

Un problème de sécurité courant dans JavaScript est le cross-site scripting , ou XSS, une violation de la politique de même origine. Les vulnérabilités XSS permettent à un attaquant d'injecter du code JavaScript dans les pages Web visitées par l'utilisateur. Un tel site Web pourrait être celui d'une banque, l'attaquant pouvant accéder à l'application bancaire avec les privilèges de la victime, ce qui pourrait révéler des informations secrètes ou transférer de l'argent sans l'autorisation de la victime. Une solution aux vulnérabilités XSS consiste à utiliser l'échappement HTML lors de l'affichage d'informations provenant de sources non fiables.

Certains navigateurs incluent une protection partielle contre les attaques XSS réfléchies (l'attaquant se trouve dans la même requête Web). L'attaquant fournit une URL contenant du code malveillant. Cependant, même les utilisateurs de navigateurs sont vulnérables à d'autres attaques XSS, telles que celles où le code malveillant est stocké dans une base de données. Seule la conception correcte des applications Web côté serveur peut totalement empêcher XSS. Des vulnérabilités XSS peuvent également survenir en raison d'erreurs d'exécution par les développeurs de navigateurs. ]

Une autre vulnérabilité est la falsification de requête intersite ou CSRF. Dans CSRF, le code du site Web attaquant trompe le navigateur de la victime, permettant à l'attaquant de faire des demandes au nom de la victime, ce qui rend impossible pour l'application cible (par exemple, une banque effectuant un transfert d'argent) de savoir si la demande a été faite volontairement par l'utilisateur ou par une attaque CSRF.

L'attaque fonctionne car, si le site cible utilise uniquement des cookies pour authentifier les requêtes des victimes, les requêtes initiées par le code de l'attaquant auront les mêmes identifiants d'accès légitimes que les requêtes initiées par l'utilisateur.

En général, la solution à CSRF est d'introduire un champ de formulaire caché dont la valeur est utilisée pour effectuer une authentification, et pas seulement via des cookies, sur des requêtes qui peuvent avoir des effets durables. Vérifier l'en-tête de référence HTTP peut également aider.

Le "détournement JavaScript" est un type d'attaque CSRF dans lequel une balise <script> sur le site Web de l'attaquant exploite une vulnérabilité sur la page du site de la victime qui l'amène à renvoyer des informations privées, sous la forme de code JSON ou JavaScript. Les solutions possibles sont :

• qu'un jeton d'authentification soit requis dans les paramètres des requêtes POST et GET pour les requêtes qui nécessitent le retour d'informations utilisateur privées.
• utilisez POST et jamais GET pour les requêtes renvoyant des informations privées

Outils de développement

En JavaScript, avoir un débogueur devient nécessaire lors du développement d'applications volumineuses et non triviales. Puisqu'il peut y avoir des différences d'implémentation entre les différents navigateurs (notamment au niveau du DOM), il est utile d'avoir accès à un débogueur pour chacun des navigateurs que notre application web va cibler. ]

Des débogueurs Web sont disponibles pour Internet Explorer, Firefox, Safari, Google Chrome et Opera. ]

Il existe trois débogueurs disponibles pour Internet Explorer : Microsoft Visual Studio est le plus avancé des trois, suivi de près par Microsoft Script Editor (un composant de Microsoft Office ) et enfin Microsoft Script Debugger, qui est bien plus basique que les autres. deux, même si c'est gratuit. L' IDE gratuit Microsoft Visual Web Developer Express offre une version limitée de la fonctionnalité de débogage JavaScript dans Microsoft Visual Studio. Internet Explorer inclut des outils de développement depuis la version 8 (affichés en appuyant sur la touche F12). Les applications Web de Firefox peuvent être déboguées à l'aide du module complémentaire Firebug ou de l'ancien débogueur Venkman. Firefox a également une console d'erreur de base intégrée, qui enregistre et évalue JavaScript. Il enregistre également les erreurs et les avertissements CSS . Opera comprend un ensemble d'outils appelé Dragonfly. L' inspecteur Web de WebKit comprend un débogueur JavaScript utilisé dans Safari , ainsi qu'une version modifiée de Google Chrome .

Il existe des outils d'aide au débogage, également écrits en JavaScript et conçus pour fonctionner sur le Web. Un exemple est le programme JSLint , développé par Douglas Crockford , qui a beaucoup écrit sur le langage. JSLint analyse le code JavaScript afin qu'il soit conforme à un ensemble de normes et de directives pour garantir une fonctionnalité et une maintenabilité appropriées.

Voir aussi

• VBScriptName
• AJAX
• Application Web
• Modèle d'objet de document
• jQuery
• JSON
• HTML
• HTML5

Liens externes

• Centre de développement Mozilla .
• (en anglais) Tutoriel Javascript .
• JavaScript - Regarder dans les coulisses .