Introduction au JavaScript

Pour commencer l'étude du JavaScript, commençons donc par le début, voici une première introduction à ce langage très intéressant.

Pour débuter en JavaScript, il vous faut un minimum de connaissance en HTML, notamment la notion de balise permettant de se situer dans une page.

Qu'est ce que le JavaScript ?

JavaScript est, comme son nom l'indique, un langage de scripts, il est simple d'apprentissage.

Même si ce langage est rapide d'apprentissage, en quelques cours, il sera possible à un novice de créer une page web fonctionnelle et attrayante. Il reste néanmoins un langage de programmation qui permet la réalisation d'applications complexes dès que l'on a acquis une connaissance suffisante du langage et de ses diverses possibilités.

Savoir rédiger des scripts en JavaScript, c'est avoir des pages HTML plus riches et disposant de nombreuses fonctionnalités supplémentaires. De plus, savoir rédiger du code en JavaScript est devenu une connaissance de base de tout développeur web.

Un peu d'histoire

Au début de l’Internet, les pages étaient constituées uniquement de textes et de liens hypertextes, ce qui restreignait l’usage à des scientifiques et des universitaires, en clair c'était visuellement horrible.

Avec l'augmentation des débits au début des années 1990, le besoin d'avoir des pages web plus attrayantes pour les visiteurs c'est fait sentir. Brendan Eich, alors ingénieur informaticien chez Netscape, est chargé du développement d’un nouveau navigateur web. Il en profite pour développer un langage de Script, à l’origine nommé LiveScript, et qui devait être un complément à Java (ces deux langages sont souvent confondus du fait de leur appellation quasi-identique, bien qu’ils n’aient que peu de choses en commun). En 1995, Netscape implémente Livescript directement dans son navigateur internet (alors baptisé Netscape Navigator),le JavaScript est né.

S'ensuit une guerre avec Microsoft qui réplique avec le Jscript en 1996. Cette guerre empêcha une standardisation du langage. Internet Explorer et Netscape Navigator n'exécutaient pas de la même façon les scripts en JavaScript. De ce fait, certains scripts pouvaient très bien s’exécuter normalement sur un navigateur et paradoxalement, générer une erreur sur un autre.

Ce manque de standardisation est à l'origine de la baisse d’intérêt des programmeurs pour le JavaScript a la fin des années 90. C'est à cette période que d'autres langages comme le PHP ou l'ASP se firent populaire au détriment du JavaScript.

Aujourd'hui, le JavaScript est redevenu un langage à la mode grâce à l’avènement du web 2.0 notamment grâce à son utilisation conjointe avec le XML ou par son utilisation asynchrone (Ajax).

Les limites du JavaScript

Il existe trois limites dans le JavaScript :

  • Le JavaScript ne possèdent pas de fonctionnalité graphique.
  • Le JavaScript ne peut pas lire et encore moins écrire des fichiers sur le disque dur du visiteur (hormis les cookies).
  • Le JavaScript ne s'interface pas avec une base données de type MySQL ou SQL.

Comment écrire du JavaScript ?

Il ne faut pas d'éditeur particulier pour écrire des scripts en JavaScript. On peut insérer du code JavaScript dans une page HTML grâce à un simple éditeur de texte comme bloc-note de Windows ou Vim pour Linux.

Il existe, cependant, des outils de conception de scripts dont l'apport n'est pas négligeable.

L'usage de ces outils vous faciliteront l'écriture de code en vous permettant :

  • De Vérifier la syntaxe du code grâce à la coloration automatique.
  • De connaître la valeur d'une variable lors de l'exécution du script.
  • De disposer de l’auto-complétion.
  • D'avoir un bon outil pour le débogage.

Pour vos premiers essais, vous pouvez utilisez le bloc-note ou Wordpad. Si vous voulez un outil plus performant,vous pouvez utiliser le logiciel Aptana Disponible en anglais. Frontpage ou Dreamweaver sont aussi d'excellents outils qui rendront votre vie de programmeur plus facile.

Le JavaScript dans votre page HTML

Au départ nous avons votre page HTML. Ce fichier contiendra ces lignes ci-dessous.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page modele en Javascript</title>
</head>
<body>
</body>
</html>

L'implantation du JavaScript se fait dans l'entête de la page HTML entre les balises <head> et </head>. Le code ressemblera donc à celui-ci :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Page modele en Javascript</title>
<script language="javascript">
document.write("Mettre le code ici");
</script>
</head>
<body>
 
</body>
</html>

Vous pouvez aussi mettre votre code JavaScript dans le body de votre page (entre la balise <body> et </body>).

L'exécution du script pourra se faire immédiatement (lors du chargement de la page par le navigateur) ou différée (lors d'un clic par exemple).

Comme vous avez pu le remarquer, il suffit que le script en JavaScript soit entre 2 balises. Le début de la balise doit commencer par :

<script language="javascript">

Et doit finir par :

</script>

Il est possible d'ajouter la version de JavaScript utilisée en le précisant dans la balise de début de script.

Exemple :

<script language="javascript 1.5">

Il faut savoir que tous les navigateurs internet n'autorisent pas ou ne supportent pas forcément le JavaScript. Certains navigateurs proposent même à l'utilisateur d'autoriser ou non le JavaScript. Si vous voulez quand même passer des informations aux visiteurs ayant un navigateur ne supportant pas JavaScript, il faudra utiliser la balise <noscript>.

Exemple :

<script language="javascript">
document.write ("bonjour");
</script>
<noscript> votre navigateur ne peut pas lire le code JavaScript</noscript>

Dans cet exemple, le navigateur affichera Bonjour s’il est compatible ou le texte figurant entre les balises <noscript> et </noscript> s’il ne l’est pas.

Vous pouvez aussi insérer le script dans un fichier externe au fichier de votre page web. Ce fichier JavaScript devra être enregistré au format .js. Pour insérer votre script dans votre page HTML, il suffit d’insérer cette ligne de commande :

<script src="fichier_javascript.js"></script>

Bien sûr, le fichier devra être présent dans le même répertoire que votre fichier HTML.

Conclusion

Voici mon premier tuto sur le JavaScript, j'espère qu'il vous sera utile et n'hésitez pas à me laisser des commentaires constructifs. Merci de votre lecture.

Notes de version

  • [18/11/2017] : Harmonisation de la page

Auteurs et sources