1-JavaScript

Cours
Cross-Platform
Ahmed Arous
2 Objectifs
 Savoir les bases fondamentales de JavaScript.
 Savoir les bases fondamentales de GIT.
 Savoir les bases fondamentales de la bibliothèque ReactJs.
 Gérer les données de manière efficace en utilisant Redux ou d'autres
solutions de gestion de l'état.
 Intégrer des API externes et des services dans une application web.
 Création d’une application on utilisant ReactJs.
3 JavaScript
4 Plan
 Définition
 Type de données
 Déclaration des variables
 ES6
5 Définition
 Est un langage de programmation de scripts principalement
employés dans les pages web interactives et à ce titre est une
partie essentielle des applications web.
 Il fonctionne côté client (navigateur) pour manipuler le contenu
HTML/CSS, réagir aux événements de l'utilisateur, et plus
généralement créer des expériences dynamiques.
 peut également être utilisé côté serveur via NodeJs .
 permettant ainsi de créer des applications complètes avec un seul
langage.
6 Type de données
JavaScript supporte plusieurs types de données :
 String : chaînes de caractères
 Number : nombres (entiers et flottants)
 Boolean : vrai ou faux (true ou false)
 null : absence d'une valeur
 undefined : Indique qu'une variable a été déclarée mais n'a pas
encore de valeur assignée.
 Objets: Structures de données complexes qui regroupent des
propriétés et des méthodes
7 Type de données
 Objets: Structures de données complexes qui regroupent des
propriétés et des méthodes
Object : collection de paires clé-valeur
Array : liste ordonnée d'éléments
 Symboles : Des valeurs uniques et immuables, souvent utilisées
pour créer des propriétés d'objet uniques.
 BigInt : permet de représenter des entiers très grands.
8 Type de données - Symbol
 Exemple :
9 Propriétés Symboliques /Non Symboliques
 En JavaScript, les propriétés symboliques et non symboliques diffèrent

principalement par leur type de clé et leur comportement.
 Propriétés Symboliques:
• Type de Clé : Les clés des propriétés symboliques sont des symboles, un type de
données primitif unique et immuable.
• Chaque symbole est unique, même s'ils ont la même description.
• Unicité : Les symboles sont garantis d'être uniques. Même si vous

créez plusieurs symboles avec la même description, ils ne seront pas
égaux entre eux.
• Non Énumérables : Les propriétés symboliques ne sont pas incluses

dans les boucles for...in ou les méthodes comme Object.keys(). Elles
doivent être accessibles via Object.getOwnPropertySymbols().
Utilisation : Les symboles sont souvent utilisés pour définir des

propriétés qui doivent être uniques ou pour ajouter des
fonctionnalités internes à des objets sans risquer de collisions
avec des propriétés définies par d'autres parties du code.
 Propriétés Non Symboliques

• Type de Clé : Les clés des propriétés non symboliques sont des
chaînes de caractères ou des symboles, mais en pratique, les chaînes
sont plus courantes. Les propriétés sont définies en utilisant des
chaînes ou des nombres.

• Enumérable : Les propriétés non symboliques sont incluses dans les
boucles for...in et les méthodes comme Object.keys(), Object.values(),
et Object.entries().

• Collisions de Noms : Les propriétés non symboliques peuvent entrer
en collision avec d'autres propriétés si des clés similaires sont utilisées
ailleurs dans le code.

• Utilisation : Les propriétés non symboliques sont généralement
utilisées pour définir les propriétés d'objet de manière standard et sont
souvent utilisées dans des contextes où l'unicité n'est pas une
préoccupation majeure.
• En résumé, les symboles sont utilisés pour des propriétés d'objet qui
doivent rester uniques et invisibles dans les énumérations classiques,
tandis que les propriétés non symboliques sont plus courantes et
peuvent être énumérées facilement.
17 Type de données
Exercice 1:
Calculer la somme des nombres dans un tableau.
Objectif :
Écrire une fonction sumArray() qui prend un tableau de nombres en entrée et retourne
la somme de ces nombres.
18 Type de données
 Méthode 1
19 Type de données
 Méthode 2
20 Type de données - Array
Exercice 2:
Créez une fonction qui convertit deux tableaux de coordonnées x
et y en un tableau de coordonnées (x, y).
Exemple:
convert([0, 2, 5], [8, 6, 9]) ➞ [ [ 0, 8 ], [ 2, 6 ], [ 5, 9 ] ]
convert([2, 2], [4, 8]) ➞ [ [ 2, 4 ], [ 2, 8 ] ]
convert([1], [2]) ➞ [ [ 1, 2 ] ]
 Méthode 1
 Méthode 2
23 Type de données - String
Exercice 3:
Un palindrome est un mot qui s’écrit de la même manière
après l’inversion de ce dernier. ‘ada’ est un palindrome. Écrivez
une méthode qui vérifie si une chaîne est un palindrome.
Exemple:
 isPalindrome("NON") ➞ true
 isPalindrome("TOTO") ➞ false
 isPalindrome("SOS") ➞ true
 isPalindrome("SELLES") ➞ true
 Méthode 1
 Méthode 2
26 Manipulation de Chaînes en JavaScript
 split('') : Cette méthode divise une chaîne de caractères en un tableau de
sous-chaînes en utilisant le séparateur spécifié. Lorsque le séparateur est
une chaîne vide (''), la chaîne est divisée en un tableau de caractères
individuels.
 reverse() : Cette méthode inverse l'ordre des éléments dans un tableau. Il
modifie le tableau original et retourne le tableau inversé.
 join('') : Cette méthode combine tous les éléments d'un tableau en une
seule chaîne de caractères, en utilisant le séparateur spécifié. Lorsque le
séparateur est une chaîne vide (''), les éléments du tableau sont
concaténés sans espace entre eux.
Exemple : Split
Exemple : reverse
Exemple : join
30
Déclaration des variables

31 Déclaration des variables
 Il existe trois types de déclaration de variable

• Var: portée fonctionnelle ou globale .
Avant ES6,var était la seule manière de déclarer des variables.
• let: on déclare une variable dont la portée est celle du bloc
courant, éventuellement en initialisant sa valeur.
• Const: on déclare une constante nommée, dont la portée est
celle du bloc courant, accessible en lecture seule.
Exercice N°1
Déclarez deux variables dans une boucle for, une avec var et une avec
let.
Essayez d'accéder à ces variables en dehors de la boucle et observez le
comportement.
Quelle est la différence dans la sortie lorsque vous accédez à i et j après la
boucle ?
Exercice N°2
Déclarez une variable avec const.
Essayez de changer la valeur de la variable et observez le comportement.
Essayez de réassigner les propriétés d’un objet déclaré avec const.
Pouvez-vous modifier les valeurs dans un objet déclaré avec const ?
Pourquoi ?
Exercice N°3
Utilisez let et const pour déclarer des variables à l'intérieur et à l'extérieur
de blocs « if ».
Essayez de réassigner les valeurs et d'accéder aux variables en dehors
des blocs .
Quelle est la différence entre la portée de let et const à l'intérieur et à
l'extérieur des blocs ?

1-JavaScript

Transféré par

Droits d'auteur :

Formats disponibles

1-JavaScript

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

1-JavaScript

Transféré par

Droits d'auteur :

Formats disponibles

Cours

 En JavaScript, les propriétés symboliques et non symboliques diffèrent

• Unicité : Les symboles sont garantis d'être uniques. Même si vous

• Non Énumérables : Les propriétés symboliques ne sont pas incluses

Utilisation : Les symboles sont souvent utilisés pour définir des

 Propriétés Non Symboliques

 Propriétés Non Symboliques

 Propriétés Non Symboliques

 Propriétés Non Symboliques

Déclaration des variables

 Il existe trois types de déclaration de variable

Vous aimerez peut-être aussi