Table des matières

Boites à idées


Retour d'un niveau
Retour à l'accueil

Le langage JavaScript peut être intégré aux pages HTML de différentes façons.

Le JavaScript est un langage de programmation (qui fait de l'interprétation) il est donc interprété au fur et à mesure. Donc il n'est pas compilé comme le Java, C, etc L'inconvénient est que le code peut être interprété différemment en fonction des navigateurs !

une instruction c'est un ordre, une action
lorsque l'on écrit les instructions sur plusieurs lignes le ; n'est pas obligatoire mais il est conseillé.


Les variables


Les variables en js ne sont pas typées (entier, booléen, string) c'est le mot clé var qui permet de déclarer une variable et sa valeur définit sont type.

variable non déclarée (déclaration implicite)

la souplesse du JS permet de ne pas déclarer les variables, on appelle cela la déclaration implicite

cette méthode n'est pas conseillée

test = 10;
test = document.BD.prop.value;

variable déclarée

var test;

variable déclarée et initialisée

var test = 10;

La déclaration des variables peut se faire sur une ou plusieurs lignes

var texte = 'bonjour';
var i = 1, j = 2;

Si vous affectez une valeur à une variable que vous n'avez pas déclaré.

a = 3;
window.console.log(a);

La variable est implicitement déclarée comme une variable globale (nous verrons plus tard le concept de variable globale).
Si vous lisez une variable non déclaré.

window.console.log(a);

Les variables n'existent que le temps du script, ce qui veut dire que les variables définies dans une page ne sont pas visibles dans une autre page.

La valeur undefined est convertie en NaN (pour Not a Number : « n'est pas un nombre ») lorsqu'elle est utilisée dans un contexte numérique.

Une variable valant null sera toujours considérée comme 0 dans un contexte numérique et comme false dans un contexte booléen.

Les portées de variables

Lorsqu'une variable est déclarée avec var en dehors des fonctions, elle est appelée variable globale car elle est disponible pour tout le code contenu dans le document.

Lorsqu'une variable est déclarée dans une fonction, elle est appelée variable locale car elle n'est disponible qu'au sein de cette fonction.

Remontée de variables (hoisting)

Un autre chose peut paraître étrange en JavaScript : il est possible, sans recevoir d'exception, de faire référence à une variable qui est déclarée plus tard.
Ce concept est appelé « remontée » (hoisting en anglais) car, d'une certaine façon, les variables sont remontées en haut de la fonction ou de l'instruction.
En revanche, les variables qui n'ont pas encore été initialisées renverront la valeur undefined.
C'est pourquoi il est conseillé de placer les instructions var dès que possible dans le code.
De plus, cette bonne pratique aide à rendre le code plus lisible.

Les variables globales

Les variables globales sont en réalité des propriétés de l'objet global.
Dans les pages web, l'objet global est window, et on peut donc accéder ou modifier la valeur de variables globales en utilisant la syntaxe suivante : window.variable .
Ainsi, il est possible d'accéder à des variables déclarées dans une fenêtre ou dans un cadre depuis une autre fenêtre ou depuis un autre cadre (frame) en spécifiant son nom.
Si, par exemple, une variable appelée numTéléphone est déclarée dans un document FRAMESET, il est possible d'y faire référence, depuis un cadre fils, avec la syntaxe parent.numTéléphone.

Voir la les indices de d'une chaîne de caractère contenu dans une variable

var monNom = "Vanderbiesen";
console.log(monNom[0]);   // renvoi  "V"
console.log(monNom[8]);   // renvoi "e"

Constantes

Il est possible de créer des constantes en lecture seule en utilisant le mot-clé const.
La syntaxe d'un identifiant pour une constante est la même que pour les variables (il doit débuter avec une lettre, un tiret bas, un symbole dollar et peut contenir des caractères numériques, alphabétiques et des tirets bas voire des caractères Unicode).

const préfixe = '212';

Une constante ne peut pas changer de valeur grâce à une affectation ou être re-déclarée pendant l'exécution du script.
Les règles de portée des constantes sont les mêmes que pour les variables, à l'exception du mot-clé const qui est obligatoire.
S'il est oublié, l'identifiant sera considéré comme celui d'une variable. Il est impossible de déclarer une constante avec le même nom qu'une autre variable ou fonction dans la même portée.


Structures de données et types


Types de données

La dernière version du standard ECMAScript définit sept types de données :

Six types de données primitifs :

  1. booléen : true et false
  2. nul : un mot-clé spécial pour indiquer une valeur nulle
  3. undefined : type pour les valeurs indéfinies
  4. number : pour les nombres. 42 or 3.14159.
  5. string : pour les chaines de caractères
  6. object : pour les objets
  7. Un type pour les symboles, apparus avec ECMAScript 6. Ce type est utilisé pour représenter des données immuables et uniques.

Conversion de types de données

JavaScript est un langage à typage dynamique. Cela signifie qu'il n'est pas nécessaire de spécifier le type de données d'une variable lorsque de sa déclaration. Les types de données sont convertis automatiquement durant l'exécution du script.
Ainsi, il est possible de définir une variable de cette façon :

var réponse = 42;

Et plus tard, d'affecter une chaîne de caractères à cette même variable :

réponse = "Merci pour le dîner...";

JavaScript utilisant un typage dynamique, cette dernière instruction ne renverra pas d'erreur.
Lorsque des expressions impliquent des chaînes de caractères et des valeurs numériques ainsi que l'opérateur +, JavaScript convertit les nombres en chaînes de caractères :

x = "La réponse est " + 42; // "La réponse est 42"
y = 42 + " est la réponse"; // "42 est la réponse"

Avec des instructions impliquant d'autres opérateurs, JavaScript ne convertit pas nécessairement les valeurs numériques en chaînes de caractères.
Ainsi, on aura :

"37" - 7; // 30
"37" + 7; // "377"

Conversion de chaînes de caractères en nombres

Si un nombre est représenté en mémoire par une chaîne de caractères, il y a des méthodes pour effectuer la bonne conversion :

parseInt()

La fonction parseInt() analyse une chaîne de caractère fournie en argument et renvoie un entier exprimé dans une base donnée.
parseInt() renverra uniquement des nombres entiers, étant ainsi inappropriée pour la manipulation de nombre décimaux.
Une bonne pratique pour cette fonction est de toujours inclure l'argument qui indique dans quelle base numérique le résultat doit être renvoyé (base 2, base 10…).

parseFloat()

La fonction parseFloat() permet de transformer une chaîne de caractères analysée en un nombre flottant (parsing).

L'opérateur + unaire

Une autre méthode pour récupérer une nombre à partir d'une chaîne de caractères consiste à utiliser l'opérateur +. “1.1” + “1.1” = “1.11.1”

La fonction isNaN (is not a number)

La fonction isNaN() permet de déterminer si une valeur est NaN.
On notera que cette fonction utilise des règles de conversion différentes de Number.
isNaN(), défini dans ECMAScript 6.
Il est aussi possible d'utiliser typeof() afin de déterminer si une valeur vaut NaN (qui signifie « n'est pas un nombre »).

Littéraux

Les littéraux sont utilisés pour représenter des valeurs en JavaScript.
Ce sont des valeurs fixes, pas des variables, qui sont fournies littéralement au script.

Cette section décrit les différents types de littéraux :




Les chaines de caractères (string)


Faire apparaître des guillemets dans une chaîne de caractères

Pour faire apparaître des guillemets dans une chaîne de caractères il suffit de mettre un backslash \ devant le guillemet pour qu'il soit interprété comme du texte

document.write(Bonjour et bienvenue dans l'univers de \"JavaScript\" et de html);

Chaque élément d'une page HTML est accessible via un chemin hiérarchique logique: dans le document, on trouve un formulaire accueil dans lequel on trouve le champ message. On atteint donc la valeur du champs par le chemin: document.accueil.message.value

Les caractères spéciaux

\b touche de suppression
\f saut de ligne d'impression
\n retour à la ligne
\r appui sur la touche ENTREE (retour chariot)
\t tabulation
\“ guillemets doubles
\' guillemets simples
\\ caractère antislash

Les chaînes de caractères peuvent être placées entre des guillemets simples ou double ( ' ou ” )

"je suis une chaîne"
"c'est une chaîne aussi"                guillemet simple à l'intérieur de guillemets doubles
'c\'est une chaîne aussi'               simple à l'intérieur de simples
"je suis une ""chaîne"" aussi'          double à l'intérieur de simples
"1ère ligne \n 2ième ligne" \n :        saut de ligne
"début \t plus loin"        \t :        tabulation

Concaténation

Pour combiner on doit concaténer avec le signe +

La longueur d'une chaîne

Integer chaine.length L'indice commence à 1 la propriété .length retourne le nombre de caractères d'une chaîne

Récupération du n ième caractère: méthode chartAt(n)

String chaine.charAt(Integer i)
la méthode chartAt(n) récupère le caractère n. var chaine = azerty; chaine.chartAt(1); retourne “z”

Attention, le premier caractère commence à l'indice 0

Extraire une sous-chaîne: méthode substring

String chaine.substring(Integer debut [, Integer fin]) L'indice commence à 0 Il est utile de pouvoir extraire un morceau d'une chaîne.
Par exemple, déclarons la variable date=“15/08/2000”.
La question est de récupérer le jour, le mois et l'année dans 3 variables différentes.

var date = "15/08/2000";
var jour = date.substring(0,2);            vaut 15
var mois = date.substring(3,5);            vaut 08
var annee = date.substring(6,10);          vaut 2000

Après ce script, jour vaut 15, mois vaut 08 et annee vaut 2000.

Cliquez sur ce bouton pour voir le résultat du script : La méthode substring() attend 2 paramètres :

  1. l'indice du premier caractère (inclus)
  2. l'indice du dernier caractère (exclus)

Si les deux paramètres sont inversés, javascript rétablit l'ordre logique :

chaine.substring(6,10) et chaine.substring(10,6) auront le même effet. Si le deuxième paramètre est omis, la chaine retournée commence à l'indice indiqué et se termine à la fin de la chaîne.

window.alert(jour + "/" + mois + "/" + annee);

Retourner l'indice de la première occurrence de sous chaîne: méthode indexOf()

Integer chaine.indexOf(String sous chaine, Integer debut)
Retourne la position d'une sous-chaîne sous-chaine dans une chaîne, à partir de la position début
Si la sous-chaîne n'est pas trouvée, indexOf() retourne -1

var url="http://www.toutjavascript.com/magicmenu/index.html";
var domaine=url.substring(7,url.indexOf("/",7));
document.write("Le domaine de "+url+" est "+domaine);

retourne : Le domaine de http://www.toutjavascript.com/magicmenu/index.html est www.toutjavascript.com

Retourner l'indice de la dernière occurence de sous chaîne: méthode lastIndexOf()

Integer chaine.lastIndexOf(String sous-chaine)\
Si sous-chaine n'est pas trouvée, lastIndexOf() retourne -1

var domaine="www.toutjavascript.com";
var extension=domaine.substring(domaine.lastIndexOf("."));
document.write(extension);

retourne : .com

Retrouver une sous-chaîne dans une chaîne, méthode 1

Deux méthodes permettent de retrouver une sous-chaîne d'une chaîne.
Ces méthodes retrouvent la position d'une chaîne et retourne son indice.
Par exemple, vous avez dans une variable javascript un nom de domaine et vous souhaitez retrouver l'extension :

var domaine="www.toutjavascript.com";
var extension=domaine.substring(domaine.lastIndexOf("."));          vaut .com
Voici un formulaire pour voir le résultat combiné de substring et lastIndexOf
La méthode lastIndexOf(souschaine) retourne l'indice de la dernière occurrence de sous-chaine.
__Si la sous-chaîne n'est pas trouvé, **lastIndexOf()** retourne -1__
window.alert(extension);

retourne : .com

Retrouver une sous-chaîne dans une chaîne, méthode 2

Il existe une autre méthode très proche qui retourne l'indice de la première occurrence de sous-chaine trouvée à partir du caractère début de chaine.
chaine.indexOf(souschaine,debut)
Cette méthode permet par exemple d'extraire le domaine d'une url complète :

var url="http://www.toutjavascript.com/magicmenu/index.html";
var domaine=url.substring(7,url.indexOf("/",7));
 //La variable domaine contient dans cet exemple www.toutjavascript.com qui est une sous-chaine de url qui commence au caractère 7 et qui se termine au premier slash (/) après "http://".
window.alert(domaine); 

retourne: www.toutjavascript.com

Mettre en MAJUSCULES / minuscules

JavaScript offre deux méthodes pour transformer les lettres (et uniquement les lettres) d'un mot en majuscules ou en minuscules.

var chaine="Ceci est un texte";
var maj=chaine.toUpperCase();
var min=chaine.toLowerCase();

Les Objets internes JavaScript commencent par une majuscules

Tout les événements commencent par on

Les pseudoURL

Ils sont insérées dans les balises de liens avec la syntaxes suivantes:

<a href="javascript:alert('Coucou !!')">Mon Lien</a>

Travailler sur du texte

tronquer du texte
.substr(0,6); prend les lettres de 0 à 5

La conversion Implicite


Convertir un nombre en une chaîne de caractères

Voici un exemple de concaténation de chaînes de caractères un peu particulier : vous allez concaténer un nombre et une chaîne de caractères…

  var nombre ; 
  var texte ; 
  var resultat ;
  nombre = 3; // variable de type numérique
  texte = "Nombre de BD gagnées : " ; // variable de type texte
  resultat = texte + nombre ; 

A votre avis, le résultat est de type ?
- Texte

Lorsque le programme effectue l’opération “+”, il convertit lui-même la variable de type numérique en type texte. C’est ce que l’on appelle la conversion implicite.La variable resultat est de type texte et sa valeur est “Nombre de BD gagnées : 3”

[texte] + [texte] = concaténation [nombre] + [nombre] = addition [nombre] + [texte] = concaténation avec conversion implicite du nombre en texte

Convertir une chaîne de caractères en un nombre

Vous avez vu que le JavaScript peut convertir automatiquement un nombre en texte grâce à la conversion implicite.
Voici un exemple provoquant l’effet inverse : une conversion implicite de texte en nombre.

  var nombre;
  var texte; 
  var resultat;
  nombre = 100; // variable de type numérique
  texte = "40.3399" ; // variable de type texte
  resultat = texte * nombre ;
 

A votre avis, le résultat est de type ?
- Numérique
Lorsque le programme effectue l’opération “*”, il convertit lui-même la variable de type texte en type numérique. Il y a là conversion implicite d’un texte en nombre.
La variable resultat est de type numérique et sa valeur est 4033.99.

Pour les opérations mathématiques (sauf addition, “+”):
[nombre] * [nombre] = opération mathématique
[nombre] * [texte] = opération mathématique avec conversion implicite du texte en nombre
Remarque : si le texte ne peut pas être converti, vous obtiendrez la valeur NaN, Not A Number (pas un nombre)



Quelle type de variable ?


Type texte ou type numérique ?
Vous n’êtes plus certain du type d’une variable ?
L’opérateur typeof vous affiche le type d’une variable : typeof

var num ;
num = "3";
alert(typeof num); // la variable num est de type TEXTE
num = parseFloat(num);
alert(typeof num); // la variable num est de type NUMERIQUE 

L’opérateur typeof peut retourner les types suivants :

Condition d'égalité double et triple

une condition est toujours vraie ou fausse!

Égalité Faible

égalité double égale == lorsque l’on veut comparer l’égalité de deux éléments, il ne vérifie que la valeur

Égalité Stricte

égalité triple égale === permet de vérifier la valeur en plus du type

Opérateur non ou n'est pas

Math.random();

objet Math, méthode random
Math.random() est une commande qui prend toujours un nombre décimal au hazard entre 0 et 1 ! ensuite on le multiplie par ce que l'on veut
exemple: entre 0 et 100 et ensuite on l'arrondi

  nombre = Math.round(Math.random()*100);

Math.round();

objet Math, méthode round
Math.round() est une commande qui va arrondir un nombre avec des décimales et faire en sorte de virer les décimales


Les Boucles

Structure Itérative ou Boucle


L'incrémentation peut s'écrire de plusieurs manières

exemple pour i = i + 1;

i++;
i += 1;

exemple pour i = i - 1;

i--;
i -= 1;

Sortir d'une boucle

exemple: un programme qui demande (via un formulaire) un nombre à l’utilisateur.
Le programme se met à afficher tous les nombres de 1 à 100.
S’il rencontre le nombre introduit par l’utilisateur, il s’arrête, sinon il continue jusqu’à 100.

var demande_chiffre;// = parseFloat(document.break.demande_chiffre.value);
function Controle_chiffre(){
  demande_chiffre = parseFloat(document.break.demande_chiffre.value);
  for(i = 1; i < 101; i++){
    if(i == demande_chiffre){
      document.write("Votre chiffre est le " +  demande_chiffre); //on affiche le chiffre
      break; //et on sort de la boucle
    }
    else{
      document.write("<b>i = </b>" + i + "<br>");
    }
  }
}

Boucle For

on utilise souvent les variable i, j, cpt

Boucle while

var test = true;
while(test === true) ou while(test)  c'est identiquement pareil !!

Tant que c'est vrai, tu recommence, sinon tu sors !

Pour rentrer dans la boucle il faut que la condition soit vrai

while(condition){instruction}

Exemple:

var mdp = "";
while(mdp != "Fidelio"){   // tant que mdp est différent de "Fidelio" 
mdp = window.prompt("Entrez votre mot de passe");   //tu redemandes le mdp

Boucle do while

Fait tant que !
do{instruction}while(condition); ! ne pas oublier le point-virgule

Switch

dans une fonction avec des return à chaque cas)

var retour = function (film) {
    switch(film) {
        case ""Toy Story 2"":
            return ("Bon film, j'adore les cowboys !");
            break;
 
        case ""Nemo"":
            return ("Bonne animation, les tortues sont cool.");
            break;
 
        case ""Le Roi Lion"":
            return ("Super musiques.");
            break;
 
        default :
            return ("Je ne sais pas !");
            break;
    }
};
retour(window.prompt("Quelle film ?"));" // appel de la fonction



Les Tableaux


3 Types de tableaux

  1. Hétérogènes: var tableau = [46, “Fabian, true”];
  2. Dimensionnels: var tableau = 46, true, "poire"], [false, "pomme", 58;

Première Synthaxe

- déclaration de la variable

var spirou = new Array();   // déclaration de la variable spirou qui sera de type tableau

- assignation de l'ensemble des valeurs dans le tableau

spirou = ["Dis Bonjour à la dame !","Tu veux mon doigt ?","Mais ! Qu’est-ce que tu fabriques ?",
"C’est pour ton bien !","Merci qui ?","N’oublie pas ta capuche !","Demande à ton père !",
"T’as qu’à t’retenir !","C’est pas de ton âge !","Tu comprendras quand tu seras grand !"] ;

On remarque l'indexation d'un tableau commence à 0.
Un tableau qui contient 10 valeurs à un indice qui va de 0 à 9 !

Spirou
                             
0    "Dis Bonjour à la dame !"                
1    "Tu veux mon doigt ?"
2    "Mais ! Qu’est-ce que tu fabriques ?"
3    "C’est pour ton bien !"
4    "Merci qui ?"
5    "N’oublie pas ta capuche !"
6    "Demande à ton père !"
7    "T’as qu’à t’retenir !"
8    "C’est pas de ton âge !"
9    "Tu comprendras quand tu seras grand !"

Deuxième Synthaxe

var spirou = new Array();   // déclaration de la variable spirou qui sera de type tableau
var spirou = new Array;
    spirou[0]="Dis Bonjour à la dame !";
    spirou[1]="Tu veux mon doigt ?";
    spirou[2]="Mais ! Qu’est-ce que tu fabriques ?";
    spirou[3]="C’est pour ton bien !";
    spirou[4]="Merci qui ?";
    spirou[5]="N’oublie pas ta capuche !";
    spirou[6]="Demande à ton père !";

Atteindre une donnée se trouvant dans un tableau

( on accède toujours à un tableau par son indice )

alert("Le titre correspondant au numéro est :" + spirou[2]) ; 

Afficher le titre correspondant à la valeur insérée par l’utilisateur dans le formulaire

numero = parseFloat(document.BD.numero.value)1 ;
// on diminue le nombre introduit pour connaître l’indice
alert("Le titre correspondant au numéro est :" + spirou[numero]) ;

Compter le nombre d'éléments dans un tableau avec la propriété .length

cela permet de calculer le nombre maximum d'éléments du tableau )

spirou.length; // ceal renverra le nombre 10

Compter l'indice maximum d'un tableau

indiceMax = spirou.length -1;   ce qui renverra l'indice maximum qui est 9

Trier un tableau

( par ordre alphabétique ) avec la méthode sort();

spirou = spirou.sort();

Déclaration d’un tableau

var mois = new Array() ;

Alimentation du tableau

mois = "janvier","février","mars","avril","mai","juin","juillet","août","septembre","octobre","novembre","décembre"] ;

Atteindre la première valeur du tableau

mois[0]

Atteindre la troisième valeur du tableau

mois[2]

Taille d’un tableau

mois.length

Parcourir toutes les données d’un tableau

for( i=0 ; i < mois.length ; i = i + 1 ){
   document.write(mois[i]) ;
}

ou

for( i=0 ; i <= mois.length-1 ; i = i + 1 ){
   document.write(mois[i]) ;
}

Trois manières de créer un tableau

Il existe différentes méthodes de création de tableau.
Voici 3 méthodes équivalentes.

var jour = new Array() ;
jour = ["dimanche","lundi","mardi","mercredi","jeudi","vendredi","samedi"] ;

OU

var jour = new Array("dimanche","lundi","mardi","mercredi","jeudi","vendredi","samedi") ;

OU

var jour = new Array() ;
jour[0] = ""dimanche"" ;
jour[1] = ""lundi"" ;
jour[2] = ""mardi"" ;
jour[3] = ""mercredi"" ;
jour[4] = ""jeudi"" ;
jour[5] = ""vendredi"" ;
jour[6] = ""samedi"" ; "

Afficher la date

Afficher la date :Avec le JavaScript, il est possible d’afficher la date du jour dans le document.var

aujourdhui = new Date() ;
document.write(aujourdhui) ; Voici le résultat obtenu à l’écran :
Thu Apr 24 11:47:14 UTC+0200 2003

Comme vous pouvez le remarquer, le format de la date n’est pas très joli !
On peut néanmoins effectuer des traitements sur la date pour obtenir un format plus adéquat.



Les Fonctions


Synthaxe

function NomDeLaFonction(){
     instructions
}

Généralement, on différencie un nom de fonction d'un nom de variable en le commençant par une majuscule. Ce n’est pas une obligation, c’est une convention de programmeur !

Les parenthèses

Les parenthèses sont obligatoires, elles ont un rôle important dans une fonction, elles sont utilisées pour transmettre un ou plusieurs paramètres ( arguments )

Les différentes variables

si on oublie de déclarer une variable, cette variable sera déclarée automatiquement comme variable globale



Les Objets


En JavaScript l'objet window est l'objet père de document (dans le DOM)

4 façons de créer ou d'initialiser un objet

1. En utilisant un littéral appelé aussi initialisateur


Initialisateur d'objet Un initialisateur d'objet est une liste contenant plusieurs propriétés avec leurs valeurs associées, cette liste étant entourée d'accolade { }

En utilisant un initialisateur ou (la notation LITTERALE, objet littérale (c'est simplement la création d'objet grâce et entre des accollades { } ) On utilise alors la notation JASON (JavaScript Object Notation).
- Un objet JASON est un ensemble d'éléments nom/valeurs
- l'ensemble commence par une accolade ouvrante { et se termine par une accolade fermante }
- chaque élément est sépéré par une virgule.
- le nom de l'élément est suivi par deux points : pour associer la valeur au nom de lélément - il faut un point virgule à l'accolade fermante { };

var BMW = { 
    nom : "BMW",
    cout : "trop cher",
    vitesse : 220,
    pays : "Allemagne"
};

Ajout d'une méthode à un objet (via la notation littérale)

var jules = {
    job: "developpeur",
    fiance: false,
 
    // ajout de la méthode parle
    parle: function(message) {
        if(message === "super"){
            console.log("Salut, je me sens très bien");
        }
        else if(message === "pas mal"){
            console.log("Salut, je me sens pas trop mal");
        }
    }
};
 
jules.parle("super");
jules.parle("pas mal");

ou

var jules = {
    job: "développeur",
    fiance: false,
    disJob: function() {
        // complétez cette méthode
        //console.log("Salut, je travaille comme " + jules.job);
        // ou
        console.log("Salut, je travaille comme " + jules["job"]);
    }
};
 
// premier job de jules
jules.disJob();
 
// changez le job de jules pour mettre "super développeur" ici
jules["job"] = "super développeur";
 
// second job de jules
jules.disJob();

Récupération des propriétés d'un objet dans une variable

var jules = {
    job: "développeur",
    fiance: false
};
 
// donnez pour valeur le premier nom de propriété de "jules"
var unePropriete = "job";
 
// affichez la valeur de la première propriété de "jules" en utilisant la variable "unePropriete"
console.log(jules[unePropriete]);

lister toute les valeurs des propriétés (attributs)

var nyc = {
    nom: "New York City",
    maire: "Bill de Blasio",
    population: 8000000,
    quartiers: 5
};
 
// Écrivez une boucle for pour afficher les valeurs des propriétés de nyc
for(var propriete in nyc){
    console.log(propriete + " : " + nyc[propriete]);
}

2. En utilisant les notations


Les notations - new Object();
- Object.create();

Une propriété peut être vue comme une variable attachée à l'objet.
nomObjet.nomPropriété

On crée l'objet maVoiture en utilisant new Object();

var maVoiture = new Object();

Notation pointée

On définit les propriétés en leurs affectant une valeur avec (la notation pointée)

maVoiture.fabricant = "Ford";
maVoiture.modèle = "Mustang";
maVoiture.année = 1969;

accéder à toutes les propriétés et valeurs de l'objet maVoiture

maVoiture;
Object { fabricant: "Ford", modèle: "Mustang", année: 1969 }
 
===accéder à une seule propriété en affichant sa valeur===
<code javascript>
maVoiture.fabricant;
"Ford"

modifier la valeur d'une propriété

maVoiture.fabricant = "Peugot";
"Peugot"

ajouter une propriété

maVoiture.couleur = "rouge";
"rouge"

ajouter une propriété à l'aide d'une variable

var age;
undefined
maVoiture.age = 40;
40
maVoiture;
Object { fabricant: "Ford", modèle: "Mustang", année: 1969, age: 40 }

savoir quel type c'est

[maVoiture];
Array [ Object ]

Notation entre crochets

On peut aussi définir ou accéder à des propriétés en utilisant (la notation entre les crochets [ ] )

maVoiture["fabricant"] = "Ford";
maVoiture["modèle"] = "Mustang";
maVoiture["année"] = 1969;"

accéder à toutes les propriétés et valeurs de l'objet maVoiture

maVoiture;

accéder à une seule propriété en affichant sa valeur

maVoiture["fabricant"];
"Ford"

accéder à deux propriétés en affichant leur valeur

maVoiture["fabricant""] + " " + maVoiture["modèle"];
"Ford  Mustang"

3. En utilisant un constructeur


  1. on définit une fonction
  2. on crée une instance de l'objet avec new

4. En utilisant la méthode Object.create()




Retour d'un niveau
Retour à l'accueil