Bienvenue à ce nouveau cour 🙂 .Nous avons vu ensemble dans le tuto précédant quelques notions théorique de JavaScript. Dans ce tuto , nous allons voir comment préparer notre environnement de travail JavaScript pour qu’on puisse commencer à coder.

Pour coder en JavaScript, nous avoir besoin seulement d’un éditeur de texte. Il existe de plusieurs éditeurs de texte sur le web et la majorité d’entre eux sont gratuits.

Normalement, si vous suivez ce cours, donc vous avez les bases de développements en HTML CSS et vous avez déjà votre éditeur de texte qui est prêt pour commencer le travail 🙂 🙂

Si jamais ce n’est pas le cas, je vous conseille vivement de suivre nos cours HTML et CSS avant de commencer ce cours.

accès rapide

• la démo
• Qu’est-ce qu’un éditeur de texte ?
• Quelques exemples d’éditeur de texte
• Installer Visual Studio Code

Qu’est-ce qu’un éditeur de texte ?

Un éditeur de texte est un programme qui va nous simplifier l’écriture des lignes de code d’un langage comme HTML,CSS ,JavaScript.

Quelques exemples d’éditeur de texte

Il en a un grand nombre d’éditeur de texte et ci-dessous quelques exemples reconnus d’éditeur :

• NotePad++ : Certainement l’éditeur de texte le plus connu de tous les temps, NotePad++ est également l’un des plus anciens. Il contient pas mal de fonctionnalités intéressante à savoir : le surlignage des erreurs de syntaxe dans le code , l’auto-complétion des balises, etc.
• Brackets : Brackets est un éditeur destiné aux les langages de développement front-end (HTML, CSS et JavaScript).. et il est caractérisé par son interface utilisateur ergonomique.
• Visual Studio Code est un éditeur de code extensible développé par Microsoft pour Windows, Linux et macOS. Cet éditeur incluent plusieurs fonctionnalités comme le débogage, la complétion intelligente du code (IntelliSense), les snippets, la refactorisation du code et Git intégré.

Pour cette série de tuto, je vais utiliser Visual Studio Code et vous avez le choix d’installer n’importe quel éditeur de texte que vous voulez l’essentiel qu’on a un éditeur bien installé dans nos poste afin de commencer à écrire nos premiers ligne de code JavaScript.

Installer Visual Studio Code

Pour installer visual code dans notre poste il suffit juste de suivre les étapes suivantes :

• Étape 1 : aller sur google et saisir le texte suivant : installer visual code

• Étape 2 : cliquer sur le premier lien :

• Étape 3 : Choisir la version compatible avec votre système d’exploitation ( dans mon cas c’est Windows)

• Étape 4 : une fois téléchargé, Ouvrez le fichier d’installation .exe dans votre dossier Téléchargements :

• Étape 5 : Lisez et acceptez le contrat de licence et cliquez sur Next.

• Étape 6 : Vous avez le choix que ce soit modifier l’emplacement du dossier d’installation ou bien conserver les paramètres par défaut. Cliquez sur Next pour continuer.

• Étape 7 : Choisissez de renommer le dossier des raccourcis dans le menu Démarrer ou de ne pas installer de raccourcis du tout. Cliquez sur Next.

• Étape 8 : Sélectionnez les tâches supplémentaires à votre choix , par exemple ‘Create a desktop icon’ (créer une icône sur le bureau) . Cliquez sur Next.

• Étape 9 : Cliquez sur Install pour démarrer l’installation du visual code.

• Étape 10 : Le logiciel est installé et prêt à être utilisé. Cliquez sur Finish

Espérons bien que ce tuto vous a plu. Dans le tuto suivant , Nous allons voir où exactement on peux mettre notre code JavaScript pour qu’il devienne compréhensible par HTML.

Bienvenue à ce nouveau tuto dans le quel nous allons savoir où exactement écrire le code JavaScript.

Il faut mentionné tout d’abord que l’insertion d’un code JavaScript peut s’écrire dans un de ces trois emplacement :

1. Directement dans la balise ouvrante d’un élément HTML
2. Dans une balise « script » dans le fichier HTML
3. Dans un fichier externe qui a l’extension « .js »

Nous allons, dans cette tuto , voir comment écrire un code JavaScript dans chacun de ces endroits et dégager les différents avantages et inconvénients de chaque façon de faire.

accès rapide

• la démo
• Définition d’un script
• Comment placer JavaScript dans la balise ouvrante d’un élément HTML ?
• Comment utiliser la balise <script> pour insérer du JavaScript ?
• Comment utiliser un fichier JavaScript externe ?
• Quiz de ce tuto

La démo

mettre ici la vidéo de la démonstration

Définition d’un script

Un script est une portion de code qui vient s’insérer dans une page HTML. Le code du script n’est pas visible dans la fenêtre du navigateur et ce dernier peut le comprendre grâce aux balises spécifiques qui lui signalent qu’il s’agit d’un script écrit en langage JavaScript.
Les balises annonçant un code Javascript sont les suivantes :

<SCRIPT language="Javascript">
Placez ici le code de votre script
</SCRIPT>

en HTML5 , l’attribut type="text/javascript" n’est pas obligatoire.

Comment placer JavaScript dans la balise ouvrante d’un élément HTML ?

Nous pouvons mettre le code JavaScript directement dans la balise ouvrante HTML.

Ce type d’insertion de code a été très fréquent au début surtout lorsqu’on veut faire des événements sur un composant HTML par exemple lors d’un clic sur un bouton on déclenche un message.

Exemple

Nous allons écrire un programme Bienvenue() qui permettra d’afficher une fenêtre contenant le texte: « Bienvenue ! » lorsque l’utilisateur clique sur le bouton.

Pour se faire nous allons poursuivre les étapes suivantes :

1. Créer un nouveau fichier HTML ( extension .html ) qui va contenir un code HTML avec du code JavaScript dedans.
2. mettre dans ce fichier le code suivant :

<html>
    <head>
        <title>Inserer JavaScript</title>
        <meta charset="utf-8">
    </head>
    
    <body>
        <button onclick="alert('Bienvenue !')">Cliquez ici</button>
    </body>
</html>

Vous pouvez télécharger le code source de cet exemple en cliquant sur le bouton ci-dessous :

Ici , nous avons un exemple très simple mais imaginons qu’on va avoir une page qui contient beaucoup d’élément HTML et pour chacun on va ajouter dedans du JavaScript ==> ça sera difficile même de le lire.

C’est pourquoi, il est déconseillé d’écrire du code JavaScript dans des balises ouvrantes d’éléments HTML car la séparation des différents langages permet de conserver le code plus propre, plus compréhensible et surtout plus maintenable.

Comment utiliser la balise <script> pour insérer du JavaScript ?

Nous pouvons mettre notre code JavaScript dans un élément <script> qui est l’élément utilisé en HTML pour indiquer que le code situé dedans est en JavaScript.

Le script va être inséré dans un fichier HTML dans n’importe quel emplacement de la page. Généralement, les fonctions JavaScript utiles sont insérées dans l’élément “head” et le code JS principal juste avant la balise de fermeture </body> de la page HTML.

Exemple

Nous allons écrire un programme Bienvenue() qui permettra d’afficher une fenêtre contenant le texte: « Bienvenue à tous !!! »

Pour se faire nous allons poursuivre les étapes suivantes :

1. Créer un nouveau fichier HTML ( extension .html ) qui va contenir un code HTML avec du code JavaScript dedans.
2. mettre dans ce fichier le code suivant :

<head>
<TITLE>Bienvenue à tous via JavaScript</TITLE>
<meta charset="UTF-8">
<script>
// Dans cette balise , on définit la fonction JavaScript qui permet d'afficher "Bienvenue à tous !!!"
function bienvenue() { alert("Bienvenue à tous !!!") ;}
</script>
</head>
<body>
< !--code HTML de la page -->
<script>
//Le code principal dans le quel on fait appel à la fonction bienvenue() 
bienvenue() ;
</script>
</body>

Résultat

Vous pouvez télécharger le code source de cet exemple en cliquant sur le bouton ci-dessous :

Exercices d’application avec correction

Exercice 1

Créez une fonction nommée « somme » qui prend deux nombres comme arguments et retourne leur somme ( on va utiliser la balise “script” dans la même page HTML)

Exemples :
somme(3, 5) ➞ 8

somme(3, -1) ➞ 2

Correction

<head>
<TITLE>fonction somme avec JavaScript</TITLE>
<meta charset="UTF-8">
<script>
// Dans cette balise , on définit la fonction somme JavaScript qui permet de calculer et d'affiche la somme x+y
function somme(x,y) { alert("la somme : " + x + " + " + y + " = "+ (x+y)) ;}
</script>
</head>
<body>
<script>
//Le code principal dans le quel on fait appel à la fonction somme() 
somme(3,5) ;
</script>
</body>

Résultat d’affichage

Vous pouvez télécharger le code source de cet exercice en cliquant sur le bouton ci-dessous :

Télécharger code source

Comme vous l’avez remarqué , cette méthode est meilleure que la précédente cependant ce n’est pas pas idéalement celle que nous allons utiliser pour plusieurs raisons :

Tout d’abord, car la séparation des codes n’est pas respecté ici puisqu’on mélange du HTML avec du JavaScript ce qui rendre l’ensemble complexe et difficile à comprendre et à maintenir dans le cadre d’un gros projet.

De plus, imaginons qu’on souhaite utiliser un même code sur plusieurs pages, donc il faudra faire plusieurs copier-coller à chaque fois ce qui entraine une complexité lors de la maintenance de l’ensemble du site.

Comment utiliser un fichier JavaScript externe?

Mettre du code JavaScript dans un fichier séparé contenant du code JavaScript est la méthode recommandée vu que le code sera plus lisible et plus facile à maintenir.

Pour se faire , nous allons passer par la création créer un nouveau fichier d’extension .js. Ensuite, nous allons faire appel à ce fichier JavaScript depuis le fichier HTML grâce à l’attribut src, placé dans la balise <script>.

Exemple

Cas où les deux fichiers sont dans le même emplacement

Dans cet exemple, nous allons créer deux fichiers :

1. Un fichier JavaScript externe qui contient le code JavaScript
2. Un fichier HTML dans le quel nous appellerons les fichiers .js

Pour cet exemple les deux fichiers sont dans le même emplacement ( le même dossier ) comme le montre cette figure :

Nous allons prendre le même exemple que le tuto précédant mais cette fois-ci avec un appel externe du JS.

écrire un programme Bienvenue() qui permettra d’afficher une fenêtre contenant le texte: « Bienvenue à tous !!! »

Nous allons créer tout d’abord un nouveau fichier nommé : bienvenue.js dans lequel nous mettons le code suivant :

function bienvenue() { 
alert("Bienvenue à tous !!!") ;
}

Par la suite , on crée un nouveau fichier HTML nommé par exemple bienvenue.html dans lequel nous ferons appel au fichier bienvenue.js à l’aide de l’attribue src

<head>
<TITLE>Bienvenue à tous via JavaScript</TITLE>
<meta charset="UTF-8">
// Ici on fait appel au fichier bienvenue.js
<script type="text/javascript" src="bienvenue.js"></script>  
</script>
</head>
<body>
< !--code HTML de la page -->
<script>
//appel de la fonction bienvenue() 
bienvenue() ;
</script>
</body>

Résultat

Vous pouvez télécharger le code source de cet exemple en cliquant sur le bouton ci-dessous :

Cas où les deux fichiers ne sont pas dans le même emplacement

Pour faciliter la tâche , on va prendre le même exemple et créer les deux fichiers :

1. Un fichier JavaScript externe qui contient le code JavaScript
2. Un fichier HTML dans le quel nous allons appeler les fichier .js

Pour cet exemple les deux fichiers qui ne sont pas dans le même emplacement ( mettre le fichier .js dans un dossier nommé javascript)

bienvenue.js

function bienvenue() { 
alert("Bienvenue à tous !!!") ;
}

test.html

<head>
<TITLE>Bienvenue à tous via JavaScript</TITLE>
<meta charset="UTF-8">
// Ici on fait appel au fichier bienvenue.js
<script type="text/javascript" src="javascript/bienvenue.js"></script>  
</script>
</head>
<body>
< !--code HTML de la page -->
<script>
//appel de la fonction bienvenue() 
bienvenue() ;
</script>
</body>

Le même résultat

La seule modification à effectuer est de modifier l’attribut en mettant les nom du dossier javascript avant le nom du fichier .js src= »javascript/bienvenue.js »

Vous pouvez télécharger le code source de cet exemple en cliquant sur le bouton ci-dessous :

Exercices d’application avec correction

Exercice 1

Créez une fonction nommée « minuteVersSeconde » qui prend une durée en minute comme arguments et retourne sa conversion vers en secondes ( utiliser un script externe JavaScript)

Exemples :
minuteVersSeconde(3) ➞ 180

minuteVersSeconde(2) ➞ 120

Correction

Tout d’abord, la création d’un nouveau fichier nommé : externe.js par exemple dans lequel on met le code suivant :

function minuteVersSeconde(x) { 
alert("La conversion de " + x +" minutes vers les secondes est " + (x*60)) ;
}

Par la suite , la création un nouveau fichier HTML( nommé :conversion.html) dans lequel nous ferons appel au fichier externe.js à l’aide de l’attribue src

<head>
<TITLE>minute vers secondes via JavaScript</TITLE>
<meta charset="UTF-8">
// Ici on fait appel au fichier externe.js
<script type="text/javascript" src="externe.js"></script>  
</script>
</head>
<body>
< !--code HTML de la page -->
<script>
//appel de la fonction minuteVersSeconde() 
minuteVersSeconde(3) ;
</script>
</body>

Vous pouvez télécharger le code source de cet exercice en cliquant sur le bouton ci-dessous :

Télécharger code source

Exercice 2

Créez une fonction nommée « ResteDivision » qui prend deux entiers X et Y comme arguments et retourne le reste de la division de X par Y ( utiliser un script externe JavaScript et qui ne sont pas dans le même emplacement )

Exemples :
ResteDivision(6,3) ➞ 0

minuteVersSeconde(3,2) ➞ 1

Correction

Tout d’abord, la création d’un nouveau fichier nommé : externe.js dans un dossier nommé js par exemple dans lequel on met le code suivant :

function ResteDivision(x,y) { 
alert("Le reste de la division de " + x +" par " +y+ " égal à "+ (x%y)) ;
}

Par la suite , la création d’un nouveau fichier HTML (nommé resteDivision.html ) dans lequel nous ferons appel au fichier division.js à l’aide de l’attribue src

<head>
<TITLE>Bienvenue à tous via JavaScript</TITLE>
<meta charset="UTF-8">
<script type="text/javascript" src="js/division.js"></script>  
</script>
</head>
<body>
< !--code HTML de la page -->
<script>
//Le code principal dans le quel on fait appel à la fonction bienvenue() 
ResteDivision(3,2) ;
</script>
</body>

Vous pouvez télécharger le code source de cet exercice en cliquant sur le bouton ci-dessous :

Télécharger code source

Dans ce tuto , nous avons vu comment écrire un petit code JavaScript et où nous pouvons le placer.

Espérons bien que ce tuto vous a plu. Dans le tuto suivant , Nous allons voir comment déclarer faire les commentaires dans JavaScript ainsi que quelques mots clé réservé par ce langage.

Quiz de ce tuto

Vous pouvez tester que vous avez bien assimiler tous ce que nous avons appris ensemble via ce quiz 🙂 🙂 amusez vous bien.

/6

0 votes, 0 avg

4

Créé le décembre 18, 2022

Quiz JavaScript : utiliser la balise "Script"

Ce quiz vous aide à améliorer vos connaissances en JavaScript 🙂 🙂 

1 / 6

1. On peut mettre la balise "Script" que entre les deux balises "Head" "/Head" du HTML

Faux

Vrai

Explication de la Réponse :
Le script va être inséré dans un fichier HTML dans n’importe quel emplacement de la page HTML

2 / 6

2. On ne peut pas faire un appel d'un script externe dans un fichier HTML

Faux

Vrai

3 / 6

3. L'appel d'un script externe JavaScript dans un fichier HTML se fait comme suite :

Faux

vrai

4 / 6

4. en HTML5, l’attribut type="text/javascript" est obligatoire

Faux

Vrai

Explication de la Réponse :
en HTML5 , l’attribut type="text/javascript" n’est pas obligatoire.

5 / 6

5. On ne peut pas insérer un code JavaScript dans le même fichier HTML :

Faux

Vrai

Explication de la Réponse :
Le script peut être inséré dans un fichier HTML dans n’importe quel emplacement de la page.

6 / 6

6. Insertion d'un script JavaScript dans un fichier HTML se fait comme suite :

Faux

vrai

Explication de la Réponse :
Il n'y a pas de balise "JavaScript"
La bonne réponse est "Script"

Votre note est de

LinkedIn Facebook Twitter VKontakte

0%

Relancer le quiz

Veuillez évaluer ce quiz

Envoyer les commentaires

Bienvenue 🙂 :). Dans le tuto précédant nous avons appris comment déclarer une variable JavaScript et dans ce tutoriel nous allons découvrir quels sont les différents types de données dans JavaScript.

accès rapide

• La démo
• Les différents types de variables
• Le type Undefined
• Le type Null
• Le type Boolean
• Le type String
• Le type Number
• Le type Symbol
• Le type Object

La démo

mettre ici la vidéo de la démonstration

Les différents types de variables

Actuellement, Javascript dispose de 7 types de données : 

• undefined (pas défini)
• Null (rien)
• Boolean (les booléens)
• String (les chaînes de caractères)
• Number (les nombres)
• Symbol (disponible depuis ES6)
• Object (Objet, peut contenir plusieurs variables de type différents).

let undefinedVariable; //undefined
let nullVariable = null; // null
let booleenVariable = false; //boolean
let StringVariable = 'Ma valeur'; //string
let NumberVariable = 12; //number
let symbolVariable= Symbol();
let ObjectVariable = {}; // object

Dans la suite, nous allons voir en détail chacun de ces types 🙂

Undefined

C’est une variable déclarée pour laquelle aucune valeur n’a été initialisée.

let maVariable; //undefined

Null

Null est une valeur précisant à JavaScript que la variable est vide.

let maVariableNulle = null; // null

Boolean

Le type booléen possède une de ces deux valeurs : true ou false.

let isConnected = false;
let isActive = true;

String

Le type string (chaîne de caractères) est une séquence de caractères, entourée de guillemets simples ou doubles :

let nom= '';
let prenom= 'toto';

Number

Le type Number contient tous les nombres que se soit avec ou sans virgules:

let firstNumber = 111; // number
let secondNumber = 52.6; // 52.6

Symbol

Object

Dans ce tuto , nous avons vu quels sont les différents types de données dans JavaScript.

Espérons bien que ce tuto vous a plu. Dans le tuto suivant , Nous allons voir comment déclarer des variables dans JavaScript.

Bienvenue à ce nouveau tuto dans le quel nous allons apprendre la déclaration des variables dans JavaScript 🙂 🙂

accès rapide

• La démo
• Qu’est ce qu’une variable ?
• Comment déclarer une variable ?
• Différence entre let , var et const
• Comment choisir le nom de ma variable ?
• Quiz de ce tuto

La démo

mettre ici la vidéo de la démonstration

Qu’est ce qu’une variable ?

Pour faire simple, une variable est un conteneur (caractérisé par son nom) qui garde des valeurs durant toute l’exécution de notre programme.

Les variables en JavaScript ne sont pas typés, c’est-à-dire qu’elles peuvent contenir toutes sortes d’informations comme un nombre entier une chaîne de caractères, un tableau…

Autrement dit, nous n’avons pas besoin de mettre le type de la variable pour la déclarer c’est à dire le langage déterminera automatiquement le type d’une variable, donc pas besoin de spécifier le type d’une variable à sa création.

Comment déclarer une variable ?

En Javascript, pour déclarer une variable nous pouvons utiliser trois mots clé : let, const et var.

let et var permettent de déclarer des variables qui peuvent changer durant l’exécution du programme.

const quand à lui permet de déclarer des constantes qui ne changeront pas durant l’exécution du programme.

Exemple de déclaration :

var user = 'John'
let age = 25
const message = 'Hello'

• var sert à définir une variable globale
• let sert à définir une variable locale
• const sert à déclarer une référence constante

Découvrons maintenant quelques exemple en pratique pour mieux voir la différence entre ces trois déclarations :

Se limite à la portée d’un bloc ?

• var : non ❌
• let : oui ✔️
• const : oui ✔️

Explication

Un bloc est l’ensemble des instructions comprises entre deux accolades « {…} »

Donc si on déclare une var dans une fonction, nous pouvons récupérer le contenu de cette variable en dehors de cette fonction. Cependant, let et const sont reconnues que dans le bloc dans lequel elles sont déclarées.

Cet exemple explique bien cette propriété :

Nous allons faire un test rapide, allez dans la console de votre navigateur en exécutant ce raccourcis (ctrl + shift + i) et suivez étape par étape ce qui est motionné dans cette explication :

1- Déclarer une variable booléenne :

var test = true  // déclarer une variable booléenne

2- Déclarer et afficher les trois types de variable dans un même bloc :

if (test)
{
    var a = 20 
    let b = 30
    const c = 40
    console.log(a) // la console affiche 20 
    console.log(b) // la console affiche 30 
    console.log(c) // la console affiche 40 
}

3- Essayer d’utiliser les trois type en dehors du bloc précédant :

console.log(a) // la console affiche 20 
console.log(b) // la console affiche l'erreur b is not defined 
console.log(c) // la console affiche l'erreur c is not defined

Résultat :

Cet exemple montre que let et const se limitent à la portée d’un bloc donc elles ne sont pas disponibles en dehors de ce bloc

Stocké en global ?

• var : oui ✔️
• let : non ❌
• const : non ❌

C’est à dire var est utilisé pour définir une variable globale donc à n’importe quelle fonction du programme le contenu de cette variable peut être utilisé.

Explication

Donc si on déclare une var dans un bloc , nous pouvons récupérer le contenu de cette variable en dehors de cette fonction. Cependant, let et const sont reconnues que dans le bloc dans lequel elles sont déclarées.

Cet exemple explique bien cette propriété :

Nous allons faire un test rapide, allez dans la console de votre navigateur en exécutant ce raccourcis (ctrl + shift + i) et suivez étape par étape ce qui est motionné dans cette explication :

1- Déclarer les trois types de variables dans un bloc :

{
    var a = 20 
    let b = 30
    const c = 40
}

2- Essayer d’afficher ces trois types de variable après la fin de ce bloc :

console.log(a) // la console affiche 20 
console.log(b) // la console affiche l'erreur b is not defined 
console.log(c) // la console affiche l'erreur c is not defined 

Résultat :

Cet exemple montre que let et const se limitent à la portée d’un bloc tandis que var possède un critère globale donc elle est reconnue tout les long de l’exécution du programme.

Peut être modifiée ?

• var : oui ✔️
• let : oui ✔️
• const : non ❌

C’est à dire nous pouvons modifier les valeurs des variables déclarées comme étant var ou let tandis que le contenue de const reste inchangeable.

Cet exemple explique bien cette propriété :

Nous allons faire un test rapide, allez dans la console de votre navigateur en exécutant ce raccourcis (ctrl + shift + i) et suivez étape par étape ce qui est motionné dans cette explication :

1- Déclarer les trois types de variable :

var a = 20 
let b = 30
const c = 40

2- Essayer de modifier la valeur de ces trois variables :

a = 22  // la valeur a été modifiée à 22  
b = 33  // la valeur a été modifiée à 33   
c = 44  // une erreur s'affiche: on peut pas modifier le contenu

Résultat :

Cet exemple montre qu’on peut modifier les valeurs des variables let et var. Cependant, la valeur de const ne peut pas être modifiée.

Comment choisir le nom de ma variable ?

Le nom d’une variable en JavaScript doit respecter les conditions suivantes :

• commencer par une lettre , un underscore (tiret du bas « _ ») ou le signe $
• Pour le reste du nom,il ne doit contenir que : de lettres, chiffres, underscore et $
• Pas d’espace dans le nom d’une variable, mais vous pouvez utiliser une parmi ces méthodes pour que le nom sera facile à comprendre:

1. utiliser le camelCase () par exemple si vous voulez déclarer la variable qui prendrai comme valeur un nom d’une personne vous pouvez mettre: nomPersonne
2. utiliser les underscores () par exemple si vous voulez déclarer la variable qui prendrai comme valeur un prénom d’une personne vous pouvez mettre: prenom_personne

• ne pas utiliser pas les mots clés réservés par JavaScript : exemple ne pas mettre les noms suivants : var , if , const , for, int, etc..

Javascript est sensible à la casse, cela veut dire que la variable birthDate est différente de BirthDate qui est aussi différente birthdate .

Exercice d’application :

Parmi les noms des variables ci-dessous , indiquez les noms valides :

• 3_tiers
• NomPersonne
• Prenom Personne
• Age200
• $ligne_Facture
• let_nom
• for
• nom&prenom

Correction

Dans ce tuto , nous avons vu comment déclarer les variables en JavaScript.

Espérons bien que ce tuto vous a plu. Dans le tuto suivant , Nous allons voir quels sont les types de données qu’on peut mettre dans les variables.

Quiz de ce tuto

Vous pouvez tester que vous avez bien assimiler tous ce que nous avons appris ensemble via ce quiz 🙂 🙂 amusez vous bien.

/8

0 votes, 0 avg

18

Créé le janvier 01, 2023

Quiz JavaScript : Déclaration de variables

Ce quiz vous aide à améliorer vos connaissances en JavaScript 🙂 🙂 

1 / 8

1. Quelle sera la sortie de ce code ?

une erreur se déclenche : la variable "note" a été déjà déclarée

aucune erreur se déclenche

la console affiche : 20

la console affiche : 16

Explication de la Réponse :
On peut mettre deux variables avec le même nom à condition ils ne sont pas dans le même bloc ==> d'où pas d'erreur
le contenu de let note a été modifié seulement dans le bloc donc en dehors du bloc il en a une var note
==> console.log(note) va afficher le contenu de var note qui est 16.

2 / 8

2. On peut modifier la valeur d'une variable déclarée comme étant const

Faux

vrai

3 / 8

3. Quelle sera la sortie de ce code ?

la console affiche la valeur 20

la console affiche la valeur 21

la console affiche une erreur : la variable age n'est pas reconnue.

Explication de la Réponse :
Donc si on déclare une var dans un bloc , nous pouvons récupérer le contenu de cette variable en dehors de cette fonction. Cependant, let et const sont reconnues que dans le bloc dans lequel elles sont déclarées.

4 / 8

4. une variable déclarée comme étant var est stockée en global ?

Faux

vrai

5 / 8

5. cette déclaration est valide dans JavaScript

Faux

vrai

Explication de la Réponse :
En Javascript, pour déclarer une variable nous pouvons utiliser que l'une de ces trois mots clé : let, const et var.

6 / 8

6. let sert à définir une référence constante :

Faux

vrai

Explication de la Réponse :
const sert à déclarer une référence constante

7 / 8

7. sélectionner les noms des variables valides

date-debut

nom_2_variable

while

$couleur

Explication de la Réponse :
date-debut : non ❌ : car ça contient un tiret "-" non par un underscore
nom_2_variable : oui ✔️ : car ça contient que des lettres , des chiffres et des undersores.
while : non ❌ : car c'est un mot réservé
$couleur : oui ✔️ : car ça contient que des lettres et le caractère "$" qui est permit dans JavaScript

8 / 8

8. Quelle sera la sortie de ce code ?

une erreur se déclenche : variable test n'est pas reconnue

une erreur se déclenche : variable moyenne n'est pas reconnue

la console affiche : true

la console affiche : 16

Explication de la Réponse :
La variable test est déclarée à l'aide du mot clé var donc elle sera disponible partout ==> d'où l'affichage de true.
La variable moyenne est déclarée à l'aide du mot clé let donc elle sera disponible que dans son bloc et pas en dehors ==> d'où l'affichage d'une erreur dans la ligne console.log(moyenne).

Votre note est de

LinkedIn Facebook Twitter VKontakte

0%

Relancer le quiz

Veuillez évaluer ce quiz

Envoyer les commentaires

Bienvenue à la série de tutoriels JavaScript 🙂 🙂

Tout le long de cette série vous allez voir pas mal de notion de ce langage et vous allez vous amusez à écrire ses lignes de codes 🙂 🙂

accès rapide

• la démo
• Définition de JavaScript
• A quoi sert JavaScript ?
• Quelques caractéristiques
• Différence entre Java et JavaScript
• A quoi ressemble un script?
• Quiz de ce tuto

La démo

mettre ici la vidéo de la démonstration

Définition de JavaScript

JavaScript (souvent abrégé JS) est un langage de programmation qui ajoute de l’interactivité à un site web (par exemple : réponses quand on clique sur un bouton, jeux interactives , ajouter un contrôle aux données entrées dans un formulaire …).

C’est un langage de programmation de scripts utilisé dans les pages web interactives. Le langage a été créé en 1995 par Netscape Communications Corporation.

A quoi sert JavaScript ?

On utilise JS  principalement sur Internet, en complément de HTML et CSS. Il utilise des scripts pour créer du contenu dynamique.

JS permet de réaliser beaucoup de fonctionnalité à savoir :

• créer du contenu mis à jour de façon dynamique
• contrôler le contenu multimédia
• animer des images

Quelques caractéristiques

JS est sensible à la casse, c’est-à-dire qu’il fait une différence entre un nom de variable contenant ou non des majuscules. Par exemple la variable FirstName est différente à firstName qui est aussi différente à firstname.

Chaque instruction se termine par un point-virgule. Cependant , le point-virgule n’est pas obligatoire si l’instruction qui suit se trouve sur la ligne suivante. Mais, de préférence, on utilise les point-virgule pour plus de visibilité de notre code.

Différence entre « Java » et « JavaScript »

Il ne faut pas confondre le JavaScript et le Java. vous pouvez voir la différence entre ces deux langage via le tableau ci-dessous :

A quoi ressemble un script?

Un script est une portion de code qui vient s’insérer dans une page HTML. Le code du script n’est pas visible dans la fenêtre du navigateur et ce dernier peut le comprendre grâce aux balises spécifiques qui lui signalent qu’il s’agit d’un script écrit en langage JavaScript.
Les balises annonçant un code Javascript sont les suivantes :

<SCRIPT language="Javascript">
Placez ici le code de votre script
</SCRIPT>

Dans ce tuto , nous avons défini JavaScript , à quoi sert ce langage , quelques caractéristiques de ce langage ainsi que le différence entre celui-ci et java et finalement nous avons vu à quoi semble un script .

Espérons bien que ce tuto vous a plu. Rattachez vos ceinture pour commencer à coder avec ce langage à partir des tutos suivants 🙂 🙂

Quiz de ce tuto

Vous pouvez tester que vous avez bien assimiler tous ce que nous avons appris ensemble via ce quiz 🙂 🙂 amusez vous bien.

/9

0 votes, 0 avg

37

Créé le décembre 17, 2022

Quiz JavaScript Introduction et historique

Ce quiz vous aide à améliorer vos connaissances en JavaScript 🙂 🙂 

1 / 9

1. Le Javascript n'est pas sensible à la casse

Faux

Vrai

Explication de la Réponse :
JS est sensible à la casse, c’est-à-dire qu’il fait une différence entre un nom de variable contenant ou non des majuscules. Par exemple la variable FirstName est différente à firstName qui est aussi différente à firstname.

2 / 9

2. JavaScript a été créé par ...

Netscape Communications Corporation

Adobe

W3C

Microsoft

3 / 9

3. Insertion d'un script JavaScript dans un fichier HTML se fait comme suite :

Faux

vrai

Explication de la Réponse :
Il n'y a pas de balise "JavaScript"
La bonne réponse est "Script"

4 / 9

4. Dans quelle année JavaScript a été créé ?

2000

1955

1995

2005

5 / 9

5. Quelle est l'abréviation de JavaScript ?

JavaS

script

Java

JS

6 / 9

6. Le code JavaScript est exécuté sur le navigateur uniquement

Faux

Vrai

Explication de la Réponse :
Le code JavaScript est exécuté sur le navigateur uniquement, car JavaScript est développé que pour le navigateur.
Par contre, les applications Java peuvent s’exécuter sur n’importe quelle machine virtuelle (JVM) ou navigateur.

7 / 9

7. JavaScript prend en charge le multithreading 

Faux

Vrai

8 / 9

8. JavaScript sert à ....

structurer et donner du sens au contenu web

créer du contenu mis à jour de façon dynamique

mettre en forme le contenu HTML

9 / 9

9. Quelle est l’extension du fichier JavaScript ?

.js

.java

.script

.javaScript

Votre note est de

LinkedIn Facebook Twitter VKontakte

0%

Relancer le quiz

Veuillez évaluer ce quiz

Envoyer les commentaires