"Si un ouvrier veut bien faire son travail, il doit d'abord affûter ses outils." - Confucius, "Les Entretiens de Confucius. Lu Linggong"
Page de garde > La programmation > Les essentiels de JavaScript : partie 1

Les essentiels de JavaScript : partie 1

Publié le 2024-10-31
Parcourir:594

JavaScript Essentials: Part 1

Javascript est comme un pot de miel. Vous pouvez y tremper votre doigt et en glisser une bouchée. C'est doux. C'est génial. C'est dangereux. Cela peut être dangereux, comme le miel chaud, dans une casserole.

JavaScript est-il compliqué ? Eh bien, vous devriez trouver une réponse à cette question à la fin de cet extrait (y compris les autres parties également). Nous pouvons poser une autre question. Quelle connaissance de JavaScript est nécessaire pour développer un programme ? Il serait utile que vous compreniez les données et leur flux. De quelles données ai-je besoin et comment les structurer ? Que dois-je faire avec les données ? Quelque chose comme ça. Lorsque vous réfléchissez à un concept, vous le faites ou devriez être capable de le faire. Et ce sera essentiellement l'objectif de ce document (nous n'avons cependant pas oublié la première question, "Le javascript est-il compliqué ?").

Je préfère généralement les articles courts et détaillés mais cette fois, ce sera long alors attachez votre ceinture.

Nous discuterons des types de données et des variables dans cette partie.

Exécuter Javascript

Précédemment sur Qu'est-ce que Nodejs, nous avons créé un programme hello world. Nous ferons de même ici.

Pour exécuter un programme Javascript, nous avons besoin de nodejs et d'un programme (code) à exécuter. Nous utiliserons un fichier appelé app.js. Créez donc un fichier appelé app.js et suivez. L'extension .js indique qu'il s'agit d'un fichier Javascript. Nous en avons déjà discuté, je vais donc en rester là.

node app.js

console.log

Il existe un moyen simple d'imprimer du texte (données) sur le terminal (écran) et cela se fait avec console.log. Tout comme notre programme Hello World. Saisissez ce code dans votre éditeur de texte.

console.log("Hello, it's me, javascript");

Toutes les données valides que nous mettons entre les ( et ) seront imprimées sur le terminal. Dans notre cas, nous avons imprimé un texte à l'écran disant : Bonjour, c'est moi, javascript. Il y a des guillemets doubles entourant (enfermant) les données que nous voulons imprimer. Cette citation englobante fait de nos données une chaîne.

Essayez d'imprimer (écrire) vos chaînes sur le terminal et ayez une idée.

Pour le bénéfice du doute, lorsque vous créez votre app.js, enregistrez-le lorsque vous saisissez votre code puis exécutez-le.

Chaîne

Une chaîne est une valeur (donnée) entourée d'un guillemet (guillemet double, guillemet simple ou guillemet inversé). Une chaîne est un texte. Votre nom, votre note, etc. sont des chaînes. Une chaîne peut être une expression, une phrase, un paragraphe, un mot, un caractère, etc.

Exemples

  • "Lorem ipsum"
  • 'Lorem ipsum'
  • \Lorem ipsum\\
  • "Oh ! Cette bibliothèque a été développée par Ant Fu, un fanatique de l'open source ?"
  • "La mère de Danny est PDG de la technologie"
  • "Je souhaite utiliser un guillemet simple dans une chaîne. Alors, n'est-il pas préférable d'utiliser un guillemet double comme guillemets ?"
  • 'Je souhaite utiliser un guillemet double dans une chaîne. Une simple citation disait : "Il y avait une chaîne appelée foo bar"'
  • "Je peux mélanger et faire correspondre des guillemets simples et des guillemets doubles dans des backticks", a déclaré le père de John Doe.\

Les exemples ci-dessus visaient à vous montrer comment utiliser les chaînes et à souligner la mise en garde que comporte la gestion des chaînes en JavaScript. Pour commencer, vous pouvez décider d’utiliser des guillemets doubles ou simples. Vous choisissez. Utilisez des backticks lorsque vous effectuez des interpolations de chaînes ou lorsque vous rencontrez le dernier exemple. Sachez simplement que, lorsque vous utilisez un guillemet pour créer une chaîne, le guillemet d'ouverture doit correspondre et être fermé par le même guillemet. Vous ne pouvez donc pas ouvrir avec un guillemet simple et fermer avec un guillemet double.

Nous pouvons utiliser un guillemet (guillemet double, guillemet simple ou guillemet arrière) dans la chaîne délimitée par des guillemets, mais nous devons ensuite y échapper. Nous utilisons une barre oblique inverse, \.

Exemple

console.log('we can use double quote in a double-quoted string, " by escaping');

Maintenant, utilisez console.log pour enregistrer les chaînes ci-dessus et écrire les vôtres.

Nombre

Exemples de nombres : -3, 5, 10000, 12,5, etc. Ils peuvent être utilisés pour représenter la valeur comptée ou mesurée d'un élément. Je veux dire, c'est ça, un nombre. Ou?

Booléen

Un booléen est un type de valeur (données), tout comme une chaîne et un nombre. Cependant, les valeurs d'un booléen sont vraies ou fausses. Il est vrai qu'une condition est présente ou non.

Objet

Un objet en Javascript est un moyen de présenter des données appariées clé-valeur. Nous pouvons utiliser un objet littéral pour regrouper les données associées sur un élément. Pour créer un objet littéral, nous enfermons ces données entre { et }. Créons un profil utilisateur.

Exemple

Nous allons console.loger le profil utilisateur. Le profil de l'utilisateur nom, date de naissance, profession, nombre d'animaux, poids de protéines en grammes, a un emploi, etc.. Chaque valeur clé est séparée par une virgule. Une clé est suivie de deux points, puis de la valeur, pour former une paire clé-valeur. Habituellement, les clés sont des chaînes (oui, nous mettons les clés d'un objet entre guillemets). Vous pouvez y ajouter plus de clés (propriétés).

name est une chaîne (sa valeur je veux dire). Il existe un objet date en javascript mais pour l'instant, nous pouvons utiliser une chaîne pour date de naissance. profession est aussi une chaîne. nombre d'animaux et poids de protéines en grammes sont des nombres. a un emploi indique si le titulaire du profil a un emploi. C'est donc un booléen.

{
    "name": "John Doe",
    "date of birth": "2000-12-25",
    "profession": "Software Engineer",
    "number of pets": 2,
    "weight of protein in grams": 12.5,
    "has a job": true
}

Il s'agit d'un objet (littéral) qui détaille le contenu du profil de John Doe.

Maintenant, nous pouvons le console.log.

console.log({
  name: "John Doe",
  "date of birth": "2000-12-25",
  profession: "Software Engineer",
  "number of pets": 2,
  "weight of protein in grams": 12.5,
  "has a job": true,
});

Notez qu'il est important de faire des clés une chaîne pour le moment. Soyez curieux et utilisez autre chose qu’une chaîne comme clé. Vous apprendrez beaucoup.

Calculatrice

Les mathématiques font partie du quotidien de la programmation et de la science en général. Nous n’aurons pas besoin de beaucoup de mathématiques. Tout ce que nous devons savoir, c'est l'addition ( ), la soustraction (-), la multiplication (*), la division (/), modulo (%) et exposant (**).

À partir de là, le modulo (%) et l'exposant (**) sont nouveaux pour vous, nous allons donc faire quelques calculs.

// adding numbers with the plus
console.log(3   3); // answer = 6
console.log(1   2   4); // answer = 7

// subtraction with dash
console.log(6 - 3); // answer = 3
console.log(-16 - 3); // answer = -19

// multiplication with asterisk
console.log(5 * 3); // answer = 15
console.log(30 * 15); // answer = 450

// division with forward slash
console.log(30 / 5); // answer = 6
console.log(12.25 / 0.5); // answer = 24.5

// modulo (is the remainder after division is done) with the percentage sign (%)
console.log(5 % 2); // answer = 1
console.log(2 % 5); // answer = 2

// exponent with two asterisks (**)
console.log(5 ** 2); // answer = 5 * 5 = 25

Variables

Dans une seconde, nous parlerons de ce qu'est une variable après avoir examiné pourquoi nous en avons besoin. Je pense que vous sauriez ce qu'est une variable en fonction de la raison pour laquelle vous pourriez en avoir besoin.

Considérons les chaînes, les nombres, les booléens, les objets et les calculs que nous avons effectués jusqu'à présent. Comment pouvons-nous obtenir ces valeurs et effectuer d’autres calculs sur elles ? Nous utilisons une variable.

Nous pouvons donc avoir le résultat de 3 3 qui est 6 stocké ou attribué comme valeur à une variable. Nous pourrons ensuite utiliser cette valeur plus tard. De cette façon, nous gardons une trace de la valeur (état) de la variable. Sachez que chaque fois que vous voyez une variable, il y a une valeur.

Une variable est une balise, une étiquette ou un nom attaché à une valeur. Partout où vous appelez (référencez) ou utilisez cette variable, la valeur est référencée. Quand nous disons, soit x soit 2. Ajoutez 3 à x, c'est-à-dire x 3. Le résultat sera x 3 = 2 3 = 5.

Une variable contient des données qui sont utilisées dans le flux de données.

Const et Let
En Javascript, const et let (en minuscules) sont utilisés lors de la création de variables.

  • utilisez const lorsque vous souhaitez attribuer une valeur qui ne devrait pas ou ne changerait pas
  • utilisez let lorsque vous souhaitez attribuer une valeur qui pourrait changer

Créons et utilisons quelques variables

const name = "John Doe";
const dateOfBirth = "2000-12-25";
const profession = "Software Engineer";
const numberOfPets = 2;
const weightOfProteinInGrams = 12.5;
const hasAJob = true;

Les variables ci-dessus sont des constantes. Si nous voulons qu'ils soient modifiables (réaffectés), nous utiliserions let au lieu de const. De cette façon, nous pouvons attribuer différentes valeurs à ces variables. Essayez de réaffecter des valeurs aux variables const.

C'est ce que nous entendons par réaffecter une valeur à une variable.

const name = "John Doe";
name = "Peter Dow";

Ou

const name = "John Doe";
name = "John Dow";

entraînera ce message d'erreur : Uncaught TypeError : affectation à une variable constante.

Notes sur les variables

  • Pour créer une variable, nous pouvons utiliser const et let.
  • Il prend la forme, let = ;
  • est le nom/balise/phrase. Regardez les variables const ci-dessus.
  • doit commencer par un caractère alphabétique ou un trait de soulignement (_)
  • ne peut pas contenir d'espace. mon nom ne peut pas être un nom de variable à cause de l'espace.
  • peut contenir des nombres. Sur la base des règles précédentes, nous pouvons avoir name1, a1, _pet3_, MAX_LIFE, max_life, maxLife, MaxLife, etc.
  • Il est préférable qu'un nom de variable décrive ou vous informe sur les données qu'elle contient ou sur la raison pour laquelle la variable est/sera utilisée.
  • Ces variables : MAX_LIFE, max_life, maxLife, MaxLife, disent la même chose, max life.
  • Ce format, maxLife, connu sous le nom de camelCasing a été utilisé. Ceci, MaxLife, c'est PascalCasing. Cette max_life est Snake_casing. Ceci, MAX_LIFE, est utilisé pour créer des constantes.

Nous pouvons créer une variable pour l'objet de profil que nous avons créé précédemment.

const profile = {
  name: "John Doe",
  "date of birth": "2000-12-25",
  profession: "Software Engineer",
  "number of pets": 2,
  "weight of protein in grams": 12.5,
  "has a job": true,
};

console.log(profile);

Conclusion

Il y a encore beaucoup à dire sur les données et leur flux. Jusqu'à présent, nous avons examiné la chaîne, le nombre, le booléen et un objet littéral. Comme nous l'avons vu, une variable est un moyen de garder une trace des valeurs. L'instruction const x = 2 assigne la valeur 2 à la variable x.

Le signe égal à, =, est l'opérateur d'affectation. C'est pourquoi nous disons : une variable x se voit attribuer une valeur de 2.

Nous avons d'autres sujets à discuter sur Javascript, tels que :

  • Interpolation de chaînes et aperçu de ses méthodes
  • Tableaux
  • Structures de contrôle (instructions if, boucles)
  • Fonctions
  • Rappels, promesses, asynchrones et attente
  • Prochaine grande nouveauté
Déclaration de sortie Cet article est reproduit à: https://dev.to/otumianimpire/javascript-estentials-part-1-39c1?1 S'il y a une contrefaçon, veuillez contacter [email protected] pour le supprimer.
Dernier tutoriel Plus>

Clause de non-responsabilité: Toutes les ressources fournies proviennent en partie d'Internet. En cas de violation de vos droits d'auteur ou d'autres droits et intérêts, veuillez expliquer les raisons détaillées et fournir une preuve du droit d'auteur ou des droits et intérêts, puis l'envoyer à l'adresse e-mail : [email protected]. Nous nous en occuperons pour vous dans les plus brefs délais.

Copyright© 2022 湘ICP备2022001581号-3