Remonter

1. Connaître le type d'une donnée

Première étape dans ce chapitre : comment connaître le type d'une donnée ou d'une variable ?

L'air de rien, vous aurez très souvent besoin de vous renseigner sur le type d'une variable, parce que vous n'êtes pas sûr de ce qu'elle contient. Jusqu'à maintenant, nous n'avons fait que des exemples simples mais le futur nous réserve bien des surprises !

Pour résoudre notre problème, nous allons faire appel à une fonction de JavaScript qui est bien utile : typeof().

Comme l'indique son nom ("type de" en français), cette fonction nous renvoi le type de ce que l'on met entre les parenthèses sous forme de chaîne de caractère, et elle s'utilise comme ceci :

Code javascript

var chaine = "Je suis une chaîne de caractère."
var entier = 20;
var flottant = 20.0;
var booleen = true;

document.write(typeof(chaine));
document.write(" ");
document.write(typeof(entier));
document.write(" ");
document.write(typeof(flottant));
document.write(" ");
document.write(typeof(booleen));

Comme vous pourrez le constater, le type des variables est affiché en anglais, et vous aurez compris que "String" signifie "Chaîne de caractère", "Number" signifie "Nombre" et "Boolean" signifie "Booléen".

Une chose à noter, c'est que cette fonction ne permet pas de faire la différence entre les entiers et les flottants, elle renvoi invariablement "Number" dès que vous lui envoyez un nombre. Alors comment faire ?

Et bien malheureusement, il est impossible de différencier les entiers des flottants mais il est toujours possible de convertir un entier en flottant ou l'inverse... c'est ce que nous verrons un peu plus loin dans le chapitre !

Pour l'instant, nous avons un dernier problème à régler ! Testez donc le petit code suivant :

Code javascript

var variable;
var operation_invalide = 5 * "test";

document.write("variable est de type " + typeof(variable));
document.write(" ");
document.write("operation_invalide est de type " + typeof(operation_invalide));

Comme vous pouvez le constater, il existe un autre type de donnée possible : le type undefined ! Nous l'avons déjà rencontré, donc rappelez-vous bien que votre variable peut ne rien contenir !

Une autre chose doit vous intriguer : operation_invalide est de type number alors que l'opération que l'on effectue renvoi tout sauf un nombre ! Etrange...

Il s'agit d'une des bizarreries de la programmation : le mot réservé NaN supposé représenter quelque chose qui n'est pas un nombre fait partie... de la catégorie des nombres ! Etrange mais il faut faire avec !

Pour être véritablement certain que la variable contient un entier ou un flottant, il faut utiliser la fonction isNaN(). Si le contenu des parenthèses n'est ni un entier, ni un flottant, elle renvoi true, sinon elle renvoi false. Voyez un peu :

Code javascript

var chaine = "Bonjour, je suis une chaîne de caractère !";
var entier = 50;
var flottant = 50.0;
var operation_invalide = 5 * "test";

// Operation_invalide et chaine ne sont pas des nombres
document.write(isNaN(operation_invalide));
document.write(" ");
document.write(isNaN(chaine));
document.write(" ");

// entier et flottant sont des nombres
document.write(isNaN(entier));
document.write(" ");
document.write(isNaN(flottant));

Et voilà, tous nos problèmes sont résolus !

Remonter

2. Convertir un type de données

Savoir convertir un type de données en un autre est quelque chose de très important et vous serez souvent confrontés à la nécessité de convertir une chaîne de caractère en nombre ou l'inverse (c'est plus rare...).

Pour chaque conversion, il y a des fonctions particulières à connaître et c'est ce que nous allons voir dans quelques instants !

Convertir un nombre en chaîne :

On commence par la conversion la plus simple qui soit : convertir un nombre en chaîne de caractère !

Comme je vous l'avais expliqué dans un précédent chapitre, lorsque vous additionnez un nombre et une chaîne de caractère, le nombre est automatiquement transformé en chaîne de caractère !

Pour effectuer votre conversion, vous pouvez déjà ruser là-dessus ! Regardez :

Code javascript

var nombre = 52;
var nombre_converti = nombre + "";

document.write("nombre est de type " + typeof(nombre));
document.write(" ");
document.write("nombre_converti est de type " + typeof(nombre_converti));

Magie magie, "nombre_converti" est de type String !

Mais tout ça, c'est pas très conventionnel, il vaut mieux utiliser une fonction déjà faite pour nous, très sobrement nommée String(). Elle transforme le contenu des parenthèses en chaîne de caractère.

Le code du dessus devient :

Code javascript

var nombre = 52;
var nombre_converti = String(nombre);

document.write("nombre est de type " + typeof(nombre));
document.write(" ");
document.write("nombre_converti est de type " + typeof(nombre_converti));

Simple non ? Allez on passe à la suite !

Convertir une chaîne en nombre :

C'est sans doute la conversion la plus utilisée en JavaScript, et elle est presque aussi simple que les autres !

Je vous l'ai dit, et je le répète, lorsque l'on additionne un nombre et une chaîne de caractère, le nombre est automatiquement converti en chaîne de caractère puis le tout est concaténé !

En effet, c'est vrai, mais je ne vous ai pas dit ce qui se passait si on faisait autre chose qu'une addition entre un nombre et une chaîne de caractère. Regardez puis testez ce code, et attendez vous à être surpris :

Code javascript

// Soustraction
var chaine = "4" - 2;
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

// Multiplication
var chaine = "4" * 2;
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

// Division
var chaine = "4" / 2;
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

// Modulo
var chaine = "4" % 2;
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

// Interdit
var chaine = "rien" - 2;
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

Comme vous pouvez le constater, lorsque l'on fait n'importe quoi autre qu'une addition, ce n'est pas le nombre qui est converti en chaîne de caractère mais bien l'inverse !

Tout cela n'est vrai, bien sûr, que si la chaîne de caractère peut être convertie en nombre... sinon c'est un joli NaN qui se présente à vous comme l'illustre le dernier exemple.

Du coup, au final, le calcul se passe sans complications et donne évidemment un résultat de type Number !

J'ai encore plus fort pour vous ! Cela fait pareil si l'opération se fait entre deux chaînes de caractères ! Regardez :

Code javascript

// Addition
var chaine = "4" + "2";
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

// Soustraction
var chaine = "4" - "2";
document.write("chaine est de type " + typeof(chaine) + " et contient : " +chaine);
document.write(" ");

Encore une fois, l'addition concatène les deux chaînes, mais la soustraction les transforme en nombres avant de faire une soustraction bête et méchante ! Vous pouvez essayez la multiplication, la division et le modulo et vous verrez que c'est bien un calcul entre nombres qui se fait !

Je le rappelle une dernière fois, tout cela n'est vrai que dans le cas où les chaînes de caractères peuvent êtres converties en nombre !
La vérité étant rétablie, essayons d'exploiter tout ça ! Dans le même esprit que la conversion de nombre en chaîne, on peut essayer de ruser ! Par exemple :

Code javascript

var chaine = "52";
var chaine_convertie = chaine - 0;

document.write("chaine est de type " + typeof(chaine));
document.write(" ");
document.write("chaine_convertie est de type " + typeof(chaine_convertie));

Et voilà, notre variable "chaine" est transformée en nombre par une bête soustraction.

Mais encore une fois, il est préférable d'utiliser une fonction faite pour la conversion ! En fait, il en existe deux : parseInt() et parseFloat() :

- parseInt() cherche un entier et renvoi un entier
- parseFloat() cherche un entier ou un flottant et renvoi un flottant

Ce qui donne :

Code javascript

// Utilisation de parseInt()
var entier = parseInt("50");
document.write("entier est de type " + typeof(entier) + " et contient " + entier);
document.write(" ");

entier = parseInt("50.5");
document.write("entier est de type " + typeof(entier) + " et contient " + entier);
document.write(" ");

// Utilisation de parseFloat()
var flottant = parseFloat("50");
document.write("flottant est de type " + typeof(flottant) + " et contient " + flottant);
document.write(" ");

flottant = parseFloat("50.5");
document.write("flottant est de type " + typeof(flottant) + " et contient " + flottant);
document.write(" ");

Simple comme bonjour mais attention, parseInt() et parseFloat(), c'est encore plus fort !

Même si votre chaîne ne contient pas que des nombres mais qu'elles commencent par un nombre, ces fonctions le récupère ! Si, la chaîne ne contient pas de nombre ou ne commence pas par un nombre, elles renvoient Nan.

Enfin bon, un exemple sera bien plus explicite :

Code javascript

// Quelques conversions
chaine_convertible = parseInt("53px");
chaine_non_convertible = parseInt("J'ai 58 ans");
chaine_non_convertible2 = parseInt("cinquante");

// Affichage des résultats
document.write("chaine_convertible est de type " + typeof(chaine_convertible) + " et contient " + chaine_convertible);
document.write(" ");

document.write("chaine_non_convertible est de type " + typeof(chaine_non_convertible) + " et contient " + chaine_non_convertible);
document.write(" ");

document.write("chaine_non_convertible2 est de type " + typeof(chaine_non_convertible2) + " et contient " + chaine_non_convertible2);

Ces exemples marchent aussi avec parseFloat(). Et voilà vous savez tout ! On passe à la dernière conversion !

Conversions et booléens :

Intéressons-nous rapidement aux différentes conversions possibles en JavaScript, touchant les booléens :

Convertir un booléen en chaîne de caractère

C'est facile avec la fonction String() que nous venons de voir ! Vous devriez savoir le faire !

Convertir un booléen en nombre

Certains d'entre vous sont peut-être en train de se demander comment on peut convertir une "valeur logique" en un nombre... En fait, il a été convenu en programmation que 0 vaudrait "false" et que tous les autres nombres (généralement 1) vaudraient "true". C'est aussi simple que ça !

Concernant la conversion, elle est impossible "manuellement" mais utilisés dans une opération numérique, "true" est remplacé par 1 et "false" par 0. Vous pouvez tester ce code :

Code javascript

document.write(true + true);

Le résultat est un entier !

Convertir une chaîne de caractère en booléen

C'est vraiment très très simple en utilisant la fonction Boolean() ! Exemple :

Code javascript

var booleen = Boolean("FaLsE");
document.write("booleen est de type " + typeof(booleen) + " et contient : " + booleen);

Vous noterez que cette fonction ne fait pas attention à la casse. Elle convertit aussi bien "FaLsE" que "false".

Convertir un nombre en booléen

C'est toujours aussi simple grâce à Boolean(). Un exemple pour conclure ce chapitre :

Code javascript

document.write(Boolean(0));
document.write(" ");
document.write(Boolean(1));
document.write(" ");
document.write(Boolean(-1));

Domptez le web facilement !

Types de données : le retour !

Créé le 06 Juillet 2008, par Anis Safine

1. Connaître le type d'une donnée

Code javascript

Code javascript

Code javascript

2. Convertir un type de données

Convertir un nombre en chaîne :

Code javascript

Code javascript

Convertir une chaîne en nombre :

Code javascript

Code javascript

Code javascript

Code javascript

Code javascript

Conversions et booléens :

Code javascript

Code javascript

Code javascript

Conclusion