1. Programmation orientée Objet :

  1. La notion d’objets :

Le but de cette section n'a pas pour ambition de vous faire connaître la programmation orientée objet (POO) mais de vous donner une idée de ce qu'est un objet, concept nécessaire à la création de scripts Javascript.

Le Javascript traite les éléments qui s'affichent dans votre navigateur comme des objets, c'est-à-dire des éléments


Cette notion semble floue pour l'instant mais voyons voir cela sur un exemple concret:
Imaginez un arbre dans un jardin comportant une branche sur laquelle se trouve un nid. On suppose la hiérarchie d'objets est définie comme ceci:

Le nid sur l'arbre est donc désigné comme suit:
jardin.arbre.branche.nid
Contrairement au nid situé sur la balançoire:
balançoire.nid

Imaginez maintenant que l'on veuille changer la couleur du nid (dans l'arbre) pour le peindre en vert, il suffirait de taper une commande du genre:
jardin.arbre.branche.nid.couleur= vert;

C'est donc ainsi que l'on représente les objets en Javascript, à la seule différence que ce n'est pas un jardin qui est représenté sous forme d'objets mais la fenêtre de votre navigateur...

Javascript divise la page du navigateur en objets, afin de vous permettre d’accéder à n'importe lequel d’entre-deux et de pouvoir les manipuler par l'intermédiaire de leurs propriétés.

On commence généralement par l'objet le plus grand (celui contenant tous les autres) puis on descend dans la hiérarchie jusqu'à arriver à l'objet voulu!

  1. Les nouveaux objets avec une fonction constructeur :

Le constructeur est une fonction servant de modèle pour le nouvel objet.

Il existe 2 façons de procéder : soit en adoptant un constructeur prédéfini, soit en écrivant une fonction personnalisée que nous exploitons comme constructeur.

Le constructeur String nous est familier, et nous savons qu’il dispose de propriétés standard. Cet objet constructeur crée un objet totalement vide :

L’objet MonObjet peut ensuite être doté de propriétés et de méthodes.

La deuxième possibilité pour créer un objet est de programmer soi-même la fonction constructeur :

  1. Les objets ont des propriétés :

L’opérateur . permet d’accéder aux propriétés d’un objet. Le nom de l’objet est complémenté par un point, suivi du nom de la propriété requise.

Pour créer une nouvelle propriété pour un objet, ce n’est pas l’instruction var qui convient, car il ne s’agit pas d’une variable ordinaire.

  1. Le nom de l’objet avec this :
    2.

    Le mot clé this remplace, dans une fonction constructeur, le nom de l’objet à créer.

    Exemples :

    Function Image(Source, Titre, Largeur, Hauteur)

    {

    this.source = source ;

    this.Titre = Titre ;

    this.Largeur = Largeur ;

    this.Hauteur = Hauteur ;

    }

    var photo = new Image(‘photo.jpg’, ‘Ma Photo’ ,80, 120) ;

    document.write(Photo.titre) ;

    L’objet Photo dispose des propriétés Source, Titre, Largeur et Hauteur. Le nouvel objet a pour nom Photo : dans ce cas this.titre signifie photo.Titre

  2. L’objet standard avec with :

Si un objet dispose d’un grand nombre de propriétés, et si ces dernières interviennent fréquemment, il est conseillé d’employer le mot clé with pour diminuer le travail de saisie.

Dans ces 2 lignes, il faut taper cinq fois le mot photo. Avec l’instruction with, la tâche est simplifiée :

La première ligne fait de Photo l’objet standard. Les propriétés(Titre, Source, etc…) sont accessibles dans le bloc suivant sans indication explicite du nom de l’objet.

  1. Les propriétés d’objets avec for/in :

A l’aide de la boucle for/in, il est possible de parcourir toutes les propriétés d’un objet. Si un objet dispose de n priorités, la boucle sera parcourue n fois. Le nom de la propriété actuelle est enregistré dans une variable.

Elle permet d’afficher toutes les propriétés de l’objet Photo.

Les propriétés avec delete :

Depuis JavaScript 1.2, il existe une instruction delete. Elle supprime les répertoires, les méthodes, ou l’objet complet.

L’objet photo a été crée avec les propriétés source, Titre, Largeur et Hauteur. La propriété Titre est affichée . Après l’avoir supprimée, nous essayons à nouveau de l’afficher ; cette fois, le programme livre undefined : la propriété Titre n’existe en effet plus pour l’objet Photo.

  1. Les objets importants intégrés :

JavaScript intègre d’emblée un certain nombre d’objets. Parmi eux, deux nous sont déjà familiers :

String et Function

Les objets intégrés disposent de méthodes prédéfinis. Nous allons vous les présenter.

  1. L’objet string :

L’instruction suivante crée un objet string :

La méthode prédéfini est lenght. La longueur de la chaîne de caractères peut ainsi être définie par l’instruction suivante.

La méthode toUpperCase transforme la chaîne de caractères en capitales, alors que toLowerCase la converti en minuscules.

 

Les méthodes sont trop nombreuses pour être étudiées en détail ici. Nous nous limiterons à un tableau récapitulatif.

Méthode
Description

toLowerCase

Convertit la chaîne de caractères en capitales

toUpperCase
Convertit la chaîne de caractères en minuscules

Substring(début, fin)
Retourne une certaine partie de la chaîne

Substr(début, longueur)

Retourne une certaine partie de la chaîne

Concat (complément)
Ajoute un complément à la chaîne

Indexof (string)
Cherche la première occurrence d’une chaîne dans la chaine de caractères

LastIndexof (string)
Cherche la dernière occurrence d’une chaîne dans la chaîne de caractères

CharAt (position)
Livre le caractère placé à la position spécifiée dans la chaîne de caractères.

 

  1. Les expressions régulières :
    2.

     

     

  2. Les manipulations mathématiques avec math :
    3.

     

  3. Les fonctions de date avec Date :
    4.

     

     

  4. Les objets image :

Retour au sommaire