Javascript

Initiation !

Sommaire

• Présentation et historique
• Programmer ?
• • La console
  • Les variables et les types
  • Les opérateurs
  • Les conditions et la logique booléenne
  • Les fonctions
  • Les commentaires
  • Les erreurs
• Des ressources ?

Javascript

Langage de script créé en 1995 par Netscape et standardisé par ECMA International.

 

Il permet principalement de créer du dynamisme et de l’interactivité au sein de pages web

Petit rappel

• HTML sert à structurer les données d'une page
• CSS sert à présenter les données au sein d'une page
• Javascript sert à créer du dynamisme au sein d'une page

Les types de données

Attention, ça commence

Numbers

 

• -20
• 0
• 1
• 2.56
• 2500

Booleans

 

• true
• false

Strings

 

• "Jack"
• "Jack Daniels"
• "x"
• ""

Objects

 

{

   "first_name"  : "Lior",

   "last_name"   : "Chamla"

}

Arrays

[ "Lior", "Nicolas", "Johan", "Romain"]

Concrètement, les Arrays font partie de la famille de type "Objects"

Types particuliers

 

• null
• undefined

Les variables

Des cartons et des boites !

var firstName;

var firstName = "Lior";

"Lior"

 

console.log(firstName)

"Lior"

 

Affectation

var age = 30;

Réaffectation

age = age + 30;

Les opérateurs

• Additionner : +
• Soustraire : -
• Multiplier : *
• Diviser : /

Les conditions

if (meteo == "pluvieux") {

   console.log("Prends un parapluie");

}

 

Opérateur d'égalité : ==

Opérateur de différence : !=

Opérateur de supériorité : > ou >=

Opérateur d'infériorité : < ou <=

Les conditions

if (meteo == "pluvieux") {

   console.log("Prends un parapluie");

} else {

   console.log("Prends les lunettes");

}

Les conditions

if (meteo == "pluvieux") {

   console.log("Prends un parapluie");

} else if (meteo == "tempete") {

   console.log("Reste à la maison !");

}

else {

   console.log("Prends les lunettes");

}

L'algèbre booléenne

&&, ||, !

L'opérateur et logique

 

var resultat = a && b;

 

 

L'opérateur ou logique

 

var resultat = a || b;

 

 

L'opérateur ou logique

 

var jour = "Samedi";

 

if ( jour == "Samedi" || jour == "Dimanche" ) {

   console.log("C'est le week end !");

}

 

L'opérateur non logique

 

var resultat = !a;

 

 

L'opérateur non logique

 

var pluvieux = true;

 

if ( !pluvieux ) {

   console.log("On va à la plage !") ;

}

 

 

L'opérateur non logique

 

var meteo = "pluvieux";

 

if ( meteo != "pluvieux" ) {

   console.log("On va à la plage !") ;

}

 

if ( !(meteo == "pluvieux")) {

   console.log("On va à la plage !") ;

}

 

 

Les fonctions

 

function nomDeLaFonction(paramètres) {

   instructions de la fonction ;

   return valeurDeRetour;

}

Les fonctions

 

function fullName(firstName, lastName) {

   var name = firstName + " " + lastName;

   return name;

}

 

console.log( fullName("Lior", "Chamla") );

console.log( fullName("Georges", "McFly") );

Les erreurs : regardez la console !

 

• SyntaxError
• NoReferenceError

 

Les commentaires

• Sur une ligne :
  // mon commentaire
   
• Sur plusieurs lignes :
  /** mon commentaire
         sur plusieurs lignes
  */

 

Quelques ressources

 

• Documentation : MDN
  https://developer.mozilla.org/fr/docs/Web/JavaScript
   
• Apprentissage : Free Code Camp
  https://www.freecodecamp.com/
   
• Apprentissage : CodeCademy
  https://www.codecademy.com/