JavaScript pour les débutants : un guide pratique pour maîtriser les bases avec des projets | Faisal Memon | Skillshare

Vitesse de lecture


1.0x


  • 0.5x
  • 0.75x
  • 1 x (normale)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

JavaScript pour les débutants : un guide pratique pour maîtriser les bases avec des projets

teacher avatar Faisal Memon, Product | Engineer | Entrepreneur

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Leçons de ce cours

    • 1.

      Introduction du cours

      2:38

    • 2.

      Javascript en action

      3:00

    • 3.

      Obtenir les outils logiciels

      5:37

    • 4.

      Notre premier programme JavaScript

      6:15

    • 5.

      Structure d'un fichier JavaScript

      3:26

    • 6.

      Améliorer votre environnement de développement

      6:58

    • 7.

      JS dans le même fichier vs un fichier séparé

      2:39

    • 8.

      Commentaires en Javascript

      8:16

    • 9.

      JavaScript avec Nodejs

      5:14

    • 10.

      Manipulation DOM à l'aide de Javascript

      8:21

    • 11.

      Les variables dans Javascript

      5:41

    • 12.

      Noms de variables

      12:24

    • 13.

      var vs let vs const

      4:38

    • 14.

      Types de données

      15:25

    • 15.

      Typographie statique ou dynamique

      5:08

    • 16.

      Expressions et opérateurs

      6:07

    • 17.

      Opérateurs arithmétiques

      8:08

    • 18.

      Opérateurs de mission

      3:38

    • 19.

      Opérateurs de comparaison

      10:21

    • 20.

      Opérateurs logiques

      11:12

    • 21.

      Opérateurs ternaires

      11:28

    • 22.

      Les tableaux dans JavaScript

      18:10

    • 23.

      Objets en JavaScript

      17:30

    • 24.

      Conversion de police

      20:04

    • 25.

      Projet : Créez un générateur de couleurs

      19:35

    • 26.

      Projet : créer un convertisseur de température

      19:01

    • 27.

      Littérature de modèle

      11:54

    • 28.

      En faire plus avec console.log

      10:02

    • 29.

      Conclusion du cours

      1:26

  • --
  • Niveau débutant
  • Niveau intermédiaire
  • Niveau avancé
  • Tous niveaux

Généré par la communauté

Le niveau est déterminé par l'opinion majoritaire des apprenants qui ont évalué ce cours. La recommandation de l'enseignant est affichée jusqu'à ce qu'au moins 5 réponses d'apprenants soient collectées.

73

apprenants

--

projet

À propos de ce cours

Vous êtes novice en programmation ou vous cherchez à vous construire une base solide en Javascript ? Bienvenue dans « JavaScript pour les débutants : un guide pratique pour maîtriser les bases », où vous apprendrez Javascript étape par étape grâce à des leçons interactives et à des projets amusants.

Javascript est le langage le plus utilisé pour le développement web, et dans ce cours adapté aux débutants, vous acquerrez une expérience pratique du codage tout en apprenant les concepts Javascript essentiels.

Ce que vous apprendrez :

Les bases du Javascript - Comprenez ce qu'est Javascript, comment il fonctionne et où il est utilisé.
Configurer votre environnement - Apprenez les bons outils pour écrire, tester et exécuter du code JavaScript.
Concepts JavaScript de base - Explorez les variables, les types de données, les opérateurs, les tableaux, les objets, etc.
Projets pratiques : créer des mini-projets concrets tels qu'un générateur de couleurs et un convertisseur de température.
Manipulation DOM : apprenez comment JavaScript interagit avec les pages web et met à jour le contenu de manière dynamique.
Écrire du code propre : Suivez les meilleures pratiques, utilisez les commentaires et comprenez les conventions Javascript.

Pourquoi ce cours ?

1. Convient aux débutants - Aucune expérience préalable en programmation n'est nécessaire !
2. Approche pratique - Apprenez par la pratique avec des exercices pratiques et de petits projets.
3. Explications claires et simples - Évitez le jargon déroutant et maîtrisez Javascript étape par étape.

À la fin de ce cours, vous aurez acquis de solides bases en JavaScript et serez prêt à créer des applications web dynamiques, à créer des projets et à poursuivre votre parcours d'apprentissage en toute confiance !

Rencontrez votre enseignant·e

Teacher Profile Image

Faisal Memon

Product | Engineer | Entrepreneur

Enseignant·e

Hey - this is Faisal and thanks for being here.

I have over 12 years of experience working as a Product Manager Founder/CEO Engineer in Mobile and App development industry. I have been building global products being used by millions of users across the globe since the beginning of my career.

Currently I am heading Product at one of the fast-paced startup in India and enjoying every moment of it. Prior to his, I built out couple of startups which had over half a million users across the globe, raised funding from Google other investors and was part of Google Launchpad Accelerator. I have experience of building products from scratch and scaling to global users.

I am here on Skillshare to share my knowledge with seekers and help them grow personally and professional... Voir le profil complet

Level: All Levels

Notes attribuées au cours

Les attentes sont-elles satisfaites ?
    Dépassées !
  • 0%
  • Oui
  • 0%
  • En partie
  • 0%
  • Pas vraiment
  • 0%

Pourquoi s'inscrire à Skillshare ?

Suivez des cours Skillshare Original primés

Chaque cours comprend de courtes leçons et des travaux pratiques

Votre abonnement soutient les enseignants Skillshare

Apprenez, où que vous soyez

Suivez des cours où que vous soyez avec l'application Skillshare. Suivez-les en streaming ou téléchargez-les pour les regarder dans l'avion, dans le métro ou tout autre endroit où vous aimez apprendre.

Transcription

1. Introduction du cours: Salut, voilà. Bienvenue sur les partitions JavaScript pour Absolute Bgners Et je suis ravi de vous guider dans le monde de JavaScript, qui est l'un des langages de programmation les plus essentiels et les plus populaires en matière de développement Web. Maintenant, en parlant de JavaScript, JavaScript est partout. Il alimente les sites Web dynamiques, les applications interactives et même le backend actuel Que vous débutiez dans le domaine de la programmation ou que vous cherchiez à améliorer vos compétences, ce cours est conçu pour offrir une expérience d' apprentissage pratique et conviviale qui vous aidera à maîtriser Javascript de fond Qui suis-je ? Je suis un entrepreneur chevronné et un éducateur prêt à partager avec vous les connaissances que j' ai acquises au cours de toutes mes carrières Commençons donc par parler de ce que nous allons couvrir. Nous aborderons donc d'abord les bases de JavaScript, où nous comprendrons ce qu'est Jascript, où il est utilisé, comment pouvez-vous l'utiliser configurer l'environnement et tout le Ensuite, nous découvrirons les principes fondamentaux de JavaScript, où nous parlerons de variables, d' opérateurs, d'expressions, de tableaux, d' objets et de tout C'est donc ici que nous allons en apprendre davantage sur les éléments constitutifs de JavaScript. Ensuite, nous réaliserons des projets pratiques dans le cadre desquels nous renforcerons tous les apprentissages que nous avons acquis jusqu'à présent et nous élaborerons quelques projets pour comprendre comment les choses fonctionnent lorsque vous passez d'apprentissage à un environnement basé sur des projets À la fin de ce cours, vous disposerez d'une base solide en JavaScript, ce qui vous permettra de créer en toute confiance des applications Web et des pages Web interactives et de poursuivre votre parcours de codage Désormais, ce cours est parfait pour les développeurs de tous niveaux. Donc, que vous soyez un débutant, qui cherche simplement à explorer JavaScript et à l'apprendre manière très structurée étape par étape, que vous soyez également un développeur de niveau intermédiaire ou avancé qui souhaite se rafraîchir certains des concepts de base de JavaScript , vous pouvez suivre ce cours car nous n' utilisons pas beaucoup de diapositives dans ce cours. J'adore enseigner sur l'ID lui-même, et je crois que les ingénieurs logiciels adorent travailler sur des IDE et faire ce qu'ils apprennent. Alors, êtes-vous prêt à faire vos premiers pas dans le monde de JavaScript ? Je suis. Plongons dans le vif du sujet et commençons à coder ensemble, et je vous verrai suivre le cours. 2. JavaScript en action: Alors maintenant, ce que nous allons faire, c'est voir JavaScript en action. Je vous recommande donc d'ouvrir le navigateur de votre choix. Je suis ici sur Google Chrome. Vous pouvez même utiliser Firefox si vous le souhaitez. Il suffit de cliquer avec le bouton droit de la souris et de se rendre sur place pour inspecter Et ici, vous aurez la possibilité d'ouvrir la console. OK ? Vous pouvez le redimensionner comme vous le souhaitez Maintenant, cette console est la console du navigateur, qui est intégrée, et c'est ici que nous pouvons exécuter nos instructions JavaScript. Donc, bien sûr, la première instruction que nous allons exécuter ici est le journal des points de la console. Vous pouvez voir la suggestion automatique, et je vais vous dire bonjour à tout le monde. OK. Quelque chose comme ça. OK, je vais mettre des W caps et ici, je vais appuyer sur Endo. Vous pouvez voir que Hello World est imprimé sur la console. OK ? Donc, si vous souhaitez imprimer quelque chose sur la console, vous pouvez utiliser ce journal de points de la console d' instructions, qui fait partie de Ja Script. Nous pouvons même en imprimer d'autres ici. Je peux donc dire Console point Log, et je peux dire que j'adore Jascript OK, quelque chose comme ça. Cela me donnera donc cette sortie, que j'adore. OK. J'aurais dû le fermer avec un seul code, et vous verrez le résultat. J'adore JavaScript, d'accord ? Je l'ai donc ouvert avec un code unique et j'ai essayé de le fermer avec un double code. C'est pourquoi cette erreur, d'accord ? Mais le traitement fonctionne parfaitement bien. J'adore Jar Script. OK ? Vous pouvez même utiliser cette console comme calculatrice. Vous pouvez donc dire deux plus quatre et vous verrez six sorties ST 16 plus 16. Vous verrez une sortie 32 SE. Il peut donc être utilisé comme calculatrice. Vous pouvez même utiliser la console pour afficher des boîtes d'alerte ou des fenêtres contextuelles. Et vous devez avoir vu de nombreuses boîtes contextuelles d'alerte lorsque vous utilisez ces applications Web. Alors laissez-moi vous montrer comment vous pouvez le déclencher. Je vais d'abord effacer la console de mon navigateur à l'aide de cette fonction d'effacement. OK ? Tout est effacé, ou vous pouvez même cliquer avec le bouton droit de la souris et dire « Effacer la console ». D'accord, ça devrait aussi faire l'affaire. Maintenant, je vais apporter une boîte d'alerte. Je peux donc dire « alerte » ici. OK. Et je peux dire que c'est une boîte d'alerte. OK. Maintenant, je dois le fermer et si j'appuie sur Entrée, vous verrez qu'il s'agit d'une boîte d'alerte. Maintenant, quel que soit le message que vous tapez ou le message que vous ajoutez ici. Il s'agit d'une nouvelle boîte d'alerte. Laisse-moi voir. OK, laisse-moi créer de nouveaux embouts. OK. Vous le verrez entrer sous forme de. Ici, dans le Pop. Donc, quel que soit le message que vous transmettez ici, il arrive ici. Donc oui, c'est ainsi que vous pouvez exécuter du code Jascript dans votre navigateur Web, et voici certaines des instructions Jascript que nous avons 3. Obtenir les outils logiciels: Salut, tout le monde. Donc, pour exécuter JavaScript, nous allons effectuer une configuration sur notre machine locale, n'est-ce pas ? Maintenant, bien sûr, vous pouvez exécuter JavaScript en cliquant avec le bouton droit de la souris comme ceci dans le navigateur , en vous dirigeant vers la console et en écrivant des traitements JavaScript ici. Mais cela n'est pas idéal si vous souhaitez écrire des scripts longs et volumineux pour des applications Web destinées à la production. Maintenant, c'est là que vous avez besoin d'une installation sur votre machine locale. Donc, ce que nous allons faire, c'est utiliser un IDE. Si vous ne connaissez pas ce terme IDE, il signifie environnement de développement intégré, qui vous donne l'ensemble des outils nécessaires pour écrire du code et l'exécuter. Je vais donc rechercher du code Visual Studio car c'est ce que nous allons utiliser. Maintenant, si un code Visual Studio est déjà installé sur votre système, ou si vous savez comment l' installer, c'est très bien. Mais je suppose que vous ne l'avez pas installé sur votre système au profit des étudiants qui ne sont pas au courant de ce processus. Je vais donc me rendre sur ce site Web en particulier, code.visualstudio.com OK ? Un peu de zoom. Maintenant, la capture d'écran que vous voyez montre à quoi ressemble le code de Visual Studio, d'accord ? Et vous pouvez voir qu'il y a un surlignage syntaxique que vous pouvez voir. L'interface est donc surlignée dans une couleur différente. Les accessoires des boutons sont surlignés dans une couleur différente. Voici donc tous les avantages de l'IDE, d'accord ? Vous pouvez voir la belle structure de dossiers sur le côté gauche. Il y a un terminal ci-dessous avec tout le code couleur et tout ça. Il offre de nombreux avantages au développeur. Donc, si vous faites défiler la page vers le bas, vous pouvez voir les supports de code de Visual Studio. Au moment où j'enregistre cette vidéo, elle prend en charge de nombreux langages de programmation, d'accord ? Vous pouvez même ajouter des extensions. Maintenant, que sont les extensions ? Les extensions étendent ou étendent essentiellement les capacités du code Visual Studio par défaut. OK ? Donc, si vous souhaitez ajouter un support pour Python, d'accord ? Donc plus de support pour Python. Vous pouvez donc ajouter cette extension. Si vous souhaitez ajouter un support pour GeucPiloto, vous souhaitez utiliser l'IA lors de la programmation, vous pouvez ajouter Get up Copilot Vous pouvez voir qu'il existe des tonnes d'extensions, et qu'il existe un marché d'extensions sur lequel vous pouvez télécharger et installer tout cela, et c'est gratuit. Vous pouvez voir Git up Copilot, un peu. Tout cela met donc en évidence différentes fonctionnalités. Vous pouvez personnaliser les thèmes de couleurs, les paramètres et les profils. Il y a beaucoup de choses, d'accord ? Il a une très bonne intégration avec le système de contrôle des mouvements et tout ça OK ? Vous pouvez donc consulter ce site Web et parcourir ce qu'il a à offrir. Mais si vous faites défiler l'écran vers le haut, vous verrez ici ce bouton de téléchargement pour Windows, d'accord ? Maintenant, si vous êtes sur Mac ou Linux, vous allez voir l'option de téléchargement correspondant à votre système d'exploitation approprié. Ou si vous ne le voyez pas pour une raison ou une autre, vous pouvez accéder à d'autres plateformes et vous pouvez voir quelles sont toutes les plateformes prises en charge ici. OK ? J'ai donc déjà installé le code Visual Studio sur mon système, donc je ne vais pas l'installer, mais l'installation est très simple. C'est comme n'importe quelle application que vous installez sur le système. Il n'y a pas de configuration complexe même pour Mac, c'est plus facile, et vous pouvez le voir ici, il existe plusieurs versions, par exemple si vous utilisez une puce Intel, vous pouvez installer celle-ci vous utilisez une puce Intel, . Apple Silicon, tu as celui-ci ici. Et aussi pour les systèmes basés sur Linux Ubuntu ici, vous avez la possibilité de télécharger et d'installer. OK ? Maintenant, je l' ai définitivement installé sur mon système, d'accord ? Alors voilà, je l'ai installé comme vous pouvez le voir. OK ? Donc, si vous l'installez et que vous l'ouvrez pour la première fois, voici ce que vous allez voir. C'est ainsi qu'il va vous mettre en valeur. Votre point de vue peut être légèrement différent car je suis déjà un utilisateur de Visual Studio Code Je vois donc les projets récents que j'ai utilisés. Donc je vais juste fermer ça, d'accord ? Et voilà qu'il me demande : « Hé, tu n'as encore ouvert aucun dossier. Oui, vous pouvez ouvrir des dossiers ici dans la barre latérale gauche, et cela vous montrera l'arborescence. Vous pouvez créer des fichiers et les gérer à partir d'ici même, ou vous pouvez même cloner un dépôt. Et comme je l'ai dit, il s' intègre très bien aux systèmes de contrôle Git of Ocean. Vous pouvez donc également en faire usage. D'accord ? Maintenant, ce que je vous demanderais à tous de faire, c'est de vous rendre dans votre structure et de créer un dossier, lorsque vous allez pratiquer Jascript OK ? C'est donc mon dossier dans lequel je vais m' entraîner à Ja Script, d'accord ? Et ouvrez simplement ce dossier ici dans le code Visual Studio. Ouvrez le dossier, vous pouvez dire « ouvrir un dossier » et vous pouvez accéder au dossier que vous venez de créer. Ou bien, si vous êtes sous Windows, vous avez le choix. Vous pouvez cliquer avec le bouton droit de la souris. Vous pouvez dire Afficher plus d'options, et vous pouvez dire ouvrir avec le code Visual Studio ici. Ouvrez avec le code ici. Voilà ce que c'est. Il s'agit donc de Visual Studio, qui n'est pas du code Visual Studio, c'est différent. Vous devez donc jeter un œil à ce logo. OK ? Celui-ci. OK ? Et si vous dites « ouvert », vous verrez le dossier s' ouvrir ici. OK. Maximisez-le. OK ? Tu peux voir. Maintenant, j'ai deux instances ou deux fenêtres ou du code Visual Studio ici. OK ? Il s'agit du dossier que j'ai créé et qui s'appelle JavaScript. Et c'est ici que je vais créer tous mes fichiers liés au script Ja et tout ce que je vais apprendre. Donc c'est à peu près tout. J'espère que vous avez également réussi à effectuer cette configuration sur votre système. 4. Notre premier programme JavaScript: Il est donc temps de commencer à écrire du code en JAScript J'espère donc que dans Visual Studio code open, vous avez pu ouvrir ce dossier de votre choix, accord, où vous voulez écrire les programmes Ja Script. J'ai donc ouvert ce dossier, et à côté de ce nom de dossier, vous verrez cette icône appelée Nouveau fichier. Le premier fichier que nous allons créer sera un fichier HTML. D'accord ? Je vais donc appeler cela index point HTML. Maintenant, pourquoi est-ce que je crée un fichier HTML ? C'est parce que nous allons utiliser HTML pour charger Ja Script et l' exécuter dans le navigateur. Oui, nous allons exécuter Ja Script dans le navigateur et voir le résultat. OK. Vous pouvez donc voir ici ce point d'index HTML et noter qu'ici, dans le code de Visual Studio, vous voyez également cette balise apa, cette icône de balise, qui représente le type de fichier que vous créez. D'accord ? Maintenant, ce fichier est créé. Ce que je vais faire, c'est dire exclamation. D'accord ? Donc, au moment où vous dites exclamation, code Visual Studio supporte bien le HTML, n'est-ce pas ? Je le vois constamment. Cela va donc nous aider à générer un code standard, et pour cela, vous devez appuyer sur Exclamation et appuyer sur Entrée et Vous verrez donc du code standard être généré. Tu peux le voir, d'accord. Je vais donc simplement le réduire en cliquant sur cette icône. Et ici, vous pouvez le personnaliser. Je vais donc appeler ce titre Jascript Course, quelque chose comme ça Et ici, je peux écrire du code. Maintenant, ce fichier n'est pas enregistré. Comment le sais-tu ? Vous pouvez donc voir ce point apparaître ici. Si vous avez terminé, une croix apparaîtra, mais vous pouvez voir ce point blanc apparaître à côté de la voie du fichier. Cela signifie que le fichier n'est pas enregistré, assurez-vous d'enregistrer les modifications que vous apportez dans le code de Visual Studio. Si vous voyez cette icône, cela signifie qu'elle n'est pas enregistrée et que vous ne verrez pas les modifications que vous avez apportées au fichier. Vous continuerez à l' actualiser et voir pourquoi vous n' obtenez pas le résultat souhaité. Mais en réalité, vous n'avez pas enregistré le code. D'accord ? Cela se produit donc plusieurs fois, donc vous devez simplement dire Control et vous verrez que je peux m'en aller. Pour l' instant, ce que je ferais, c'est dans le corps, je vais ajouter H un, d'accord ? Et je vais dire JavaScript. Bien sûr, par ici. OK. Je vais également ajouter le journal de la console ici. D'accord ? Désormais, le journal de la console est un traitement JavaScript. Alors, comment est-ce que je vais m'y prendre ? Je ne peux donc pas l'écrire dans une balise HTML, d'accord ? Donc pour cela, je vais devoir utiliser une balise spéciale appelée balise script. D'accord ? Donc ici, après le corps, je vais dire script. OK. Et ici, je dirais console point log. Et ici, je vais dire bonjour à tout le monde, quelque chose comme ça. D'accord ? C'est donc Ja Script, et je l'ai enregistré. Donc, en gros, la façon dont vous écrivez du JavaScript HTML se fait à l'aide de balises de script, n'est-ce pas ? Maintenant, ce que nous devons faire, c'est voir le résultat, si nous sommes capables de l'exécuter correctement. Je vais donc faire un clic droit ici et je vais dire Révéler dans l'explorateur de fichiers. OK, cela va ouvrir l'explorateur de fichiers. Sur Mac, vous verrez Reveal dans le Finder. Cela ouvre donc l'explorateur de fichiers. Vous pouvez voir ce point d'index HTML créé. Ce que vous pouvez faire, c'est l' ouvrir dans le navigateur. Assurez-vous donc d'avoir un navigateur, votre navigateur préféré ou navigateur préféré de votre choix, ouvert ici, et le dossier s'ouvre également. Et ce que vous pouvez faire, c'est que vous pouvez glisser-déposer ce fichier ici dans le navigateur. OK. Donc, ce que cela va faire, c'est ouvrir ce fichier ici. Vous pouvez voir qu'il s'agit d'un chemin du fichier et vous pouvez voir le cours Ja Script affiché ici. Maintenant, pourquoi vient-il ici ? C'est parce que vous l'avez ajouté dans le headrotax. Vous pouvez cliquer avec le bouton droit, dire inspecter, et vous pouvez accéder à la console et vous verrez Hello world en haut, n'est-ce pas ? Voici donc le journal de la console que nous avons montré ici, d'accord ? Je vais juste minimiser cela ici, et ce que je ferais, c'est avoir cette vue côte à côte, d' accord, que je préfère chaque fois que je code ou que je fais du développement Web, d'accord ? est donc cette vue côte à côte que je vais utiliser, et vous aurez également une bonne idée résultat que vous obtenez modifications que nous apportons et pourquoi voyez-vous ce résultat ? OK. Ainsi, quelle que soit la modification que vous apportez, si vous ajoutez quelques exclamations supplémentaires, si vous cliquez sur Enregistrer et si vous actualisez ici, vous verrez le résultat se refléter D'accord ? Mais veillez à enregistrer le fichier. D'accord ? Cela ne devrait pas être comme si vous ne l'aviez pas enregistré et que vous ne voyiez pas le résultat, vous continuerez simplement à l' actualiser et vous vous demanderez pourquoi je ne reçois pas le résultat ? D'accord ? Assurez-vous également d'utiliser la syntaxe exacte que j' écris ici. Vous pouvez voir la console. Tout est petit. Log aussi, tout est petit. Si vous essayez d'écrire en majuscules ici, si je l'enregistre et si vous actualisez, vous verrez que ce n'est pas défini. Cela n'est pas défini. Ça ne marchera pas. Cela vous indique également où se trouve l'erreur, d'accord ? Je vais donc également vous montrer comment vous pouvez lire les erreurs ici. Vous pouvez voir une erreur de référence, la console n'est pas définie et l'erreur se situe sur 12. D'accord ? Donc c'est la ligne numéro 12, ici, non ? Et c'est la cinquième position c'est ce que cela vous indique. La cinquième position. Si je change cela en petit C, et si je dis rafraîchissement, cela devrait me montrer le résultat OK. Nous ajoutons également un point-virgule à la fin, car cela marque la fin de l'instruction de script Ja. C'est bon. Donc oui, c'est votre premier programme Jascript que vous avez écrit et vous l'avez chargé à l'aide du HTML J'espère donc que cela vous a été utile. 5. Structure d'un fichier JavaScript: Permettez-moi donc de vous parler un peu plus de Ja Script ici. Donc, si vous regardez ce fichier en particulier, il s' agit d'un fichier TREML contenant le script Ja, n'est-ce pas ? Maintenant, ces éléments sont connus sous le nom de balises et pour JavaScript, c'est ce qu'on appelle une déclaration. Jascript ne possède pas ce que l'on appelle des balises. Les balises sont présentes en HTML, mais Jascript contient ce que l'on appelle des instructions, et Statement n'est qu'une seule ligne de code qui peut être exécutée Maintenant, vous remarquerez également que code Jascript est écrit dans la balise script Nous l'avons ajouté à la fin du fichier. Maintenant, je voudrais souligner une chose ici. Vous pouvez vous en débarrasser à partir d'ici et vous pouvez également l'ajouter en haut dans la tête. C'est également possible si vous l'enregistrez et si vous l'exécutez ici. OK. Si vous le voyez fonctionner, vous verrez que le résultat est le même. OK ? Si j'essaie d'apporter une quelconque modification, d'accord, comme ça et si je rafraîchis, vous verrez le résultat arriver comme ça. OK ? Il n'y a donc aucun problème en tant que tel, mais c'est toujours une bonne pratique d' avoir cette balise de script à la fin, ce qui signifie que vous devez charger Jascript à la fin une fois que tous les éléments HTML ont été chargés Maintenant, il y a des raisons à cela. La raison numéro un est d'éviter toute sorte d'erreur inconnue. Le script Ja, comme nous le savons, ajoute du comportement à nos pages Web, ce qui signifie qu'il fonctionne avec les éléments définis sur la page HTML. Maintenant, il est possible que le script Ja essaie même de modifier les éléments en fonction de l'état, n'est-ce pas ? Si vous cliquez sur un bouton, il peut vouloir afficher des informations ou faire quelque chose avec les éléments de la page. Maintenant, si vous ajoutez ce script dans l'en-tête, ici, dans les balises d'en-tête. Le problème est que ce script peut être exécuté avant même que toutes les balises du code HTML ne soient chargées. Il est donc possible que Ja Script ne trouve pas les balises qu'il souhaite, et ce par erreur. Cela peut donc entraîner une erreur, et c'est pourquoi il est toujours recommandé de placer la balise de script à la fin du fichier HTML. Et la raison en est assez claire : toutes les balises HTML ont été chargées. OK ? La seule raison. Une autre raison est d' accélérer le site Web. Donc, si la balise script est ajoutée en haut de la section d'en-tête, que se passerait-il s' il y avait beaucoup de script, pour le moment, nous n'avons qu' une seule ligne de code, n'est-ce pas ? Donc c'est bon. Mais si un grand nombre de scripts sont écrits, leur exécution ou leur chargement peuvent prendre un certain temps. OK ? Et les éléments HTML situés sous le script ou après la balise head ne se chargent qu'une fois le script complètement chargé, ce qui peut ralentir le temps de réponse de la page Web. Et ce n'est pas bon du point de vue de l'expérience utilisateur, et c'est pourquoi il est toujours recommandé de charger le script Ja en fin de page afin d'éviter ces problèmes. les programmes Ja Script peuvent également avoir Bien entendu, les programmes Ja Script peuvent également avoir plusieurs instructions. Je peux ajouter une autre ligne de code ici et je peux dire « rafraîchir », et vous verrez le résultat ici. C'est bon. Donc oui, c'est plus d'informations sur le programme Jascript 6. Améliorer votre environnement de développement: Voyons maintenant comment améliorer votre environnement de développement. accord ? Maintenant, ce qui se passe actuellement, c'est que nous avons ce fichier HTML. Dans ce cadre, nous chargeons Jascript et ce code Jascript est disponible dans le navigateur Maintenant, ce que nous avons fait, c'est que nous avons ouvert ce fichier HTML pour voir le résultat ici dans la console du navigateur, n'est-ce pas ? Maintenant, il existe de meilleurs moyens. Maintenant, ce qui se passe, c'est si vous apportez un quelconque changement ici. Par exemple, j'ajoute un autre point complet ici. D'accord ? Si j'enregistre le fichier, cette modification ne sera pas reflétée ici. Je dois faire une mise à jour pour voir le changement, d'accord ? Si vous apportez constamment des modifications et que vous les testez constamment, cela peut être un peu fastidieux, et si vous travaillez sur de grands projets, cela peut être irritant, vous savez choses peuvent donc être beaucoup plus simples, et il existe de bons outils que vous pouvez configurer dans code de Visual Studio et qui peuvent vous faciliter la vie en tant que développeur ou programmeur. Maintenant, laissez-moi vous expliquer quelques étapes que vous pouvez suivre pour améliorer votre environnement de développement. Donc, dans la barre latérale gauche, vous verrez cette option appelée extensions. Désormais, dans le code Visual Studio, vous pouvez ajouter ou installer des extensions qui peuvent étendre les capacités par défaut du code Visual Studio. D'accord ? J'ai donc déjà beaucoup d'extensions installées. D'accord ? Je vais parler de ceux que je recommande pour Ja Script HTML ou le développement Web, d'accord ? Maintenant, vous pouvez voir ici que j'ai cette extension pour les conteneurs de développement, d'accord ? Je travaille donc beaucoup avec Docker également. D'accord ? J'ai donc installé cette extension, mais elle n'est pas nécessaire pour le développement Web, d'accord ? Je vais donc juste parler de ceux qui le sont. Donc, cette première extension que vous voyez est une balise de renommage automatique ici D'accord ? Maintenant, si vous voyez ce fichier TML, il se compose d'une balise, d'accord ? L'une est l'étiquette d'ouverture, l' autre est la balise de fermeture. Donc, si vous souhaitez renommer le tag. Donc disons que si c'est H un, je veux que ce soit H deux. Donc, si je fais H deux ici, vous pouvez voir que le tag de fermeture a également été renommé automatiquement. Comment est-ce géré ? Cela est géré en raison de cette extension. Donc, si je le désactive ici, d'accord ? Et si je viens ici, maintenant si je le renomme, laisse-moi juste le réduire un peu Si je le renomme en H un ici maintenant, cela fonctionne toujours, je crois que les modifications n'ont pas été prises en compte. OK. Mais permettez-moi de renommer ce H deux. OK. Maintenant, après avoir redémarré les extensions, si vous voyez, si je le renomme en H deux, cela ne sera pas D'accord ? Donc, si vous travaillez sur un gros fichier HTML, et disons que vous avez renommé cette balise, vous devez également renommer la balise correspondante, sinon vous allez obtenir une erreur Donc, si je l'actualise, d'accord. Aucune erreur n' est générée, d'accord, mais le résultat n'est pas ce que vous souhaiteriez. OK. Cela pourrait donc probablement être indiqué dans H deux ou H un. D'accord ? Ce n'est donc pas ce que vous souhaiteriez. Idéalement, une étiquette d'ouverture devrait également avoir une étiquette de fermeture. C'est donc ce que cette balise de renommage automatique vous aide. OK, j'ai réalisé que je n'avais pas enregistré le fichier, donc je vais juste enregistrer le fichier et le rafraîchir. OK. C'est donc ce que cette balise de renommage automatique vous permet de faire Je l'ai donc installé ici pour des raisons de commodité. OK, donc je l'ai activé en ce moment, et si je le renomme en H one, je l'enregistrerai simplement D'accord ? C'est ce à quoi ce tag autor nim vous aide D'accord ? Il y a une description ici que vous pouvez parcourir. D'accord ? Il s'agit donc d'une étiquette, d'une colorisation par paire de crochets Alors, à quoi sert cette extension ? Donc, si vous travaillez sur un gros fichier, d'accord, vous pourriez avoir ces accolades pour séparer un bloc de Maintenant, vous voudrez peut-être voir le code couleur. Cela vous permet donc de vous donner le code couleur de la paire d'ouverture et de fermeture. Vous pouvez le voir ici dans l'icône elle-même. C'est donc ce que cela fait. D'accord ? J'ai d'autres extensions comme DV container, jango, talker, certaines liées à Python, les blocs-notes Jupiter, blocs-notes Jupiter Ensuite, il y a cette autre extension, appelée Live Server. Ceci est également installé sur mon système. Vous pouvez donc rechercher une extension ici. J'ai donc oublié de mentionner toutes ces extensions . S'il vous en manque une, vous pouvez effectuer une recherche ici sur le marché. Vous pouvez les sélectionner et dire « installer ». C'est ça. C'est assez simple. D'accord ? Live Server est donc une extension qui permet d'intégrer un serveur petit ou léger à votre environnement de développement. OK. Donc, en installant cette extension, vous obtenez ce truc ici. Vous pouvez le voir en bas, activez ce bouton. Si je le désactive et si je redémarre, ce bouton disparaît. OK, si je l'active, vous verrez ce bouton ici. Donc, si je dis « passer en ligne », cela me donnera un serveur en direct. Vous pouvez voir le port 50 50. Cela m'a donc donné un serveur léger sur 5500. Ce n'est pas 50 50. C'est 5500. OK, c'est un port. Et si vous pouvez l'exécuter sur votre machine locale, si vous essayez d'y accéder, le fichier que vous avez sera exécuté sur le serveur local. Vous pouvez le voir. Cela fonctionne maintenant sur le serveur local. Et maintenant, si j'essaie d'apporter des modifications ici, d'accord ? Donc, si j'ajoute, disons, deux ou quatre points d'interrogation. OK. Et je vais ouvrir la console avant d'enregistrer le fichier afin que vous puissiez tous voir ce qui se passe. OK, ça ne grossit pas le tissu. Si je l'enregistre, vous verrez que juste après avoir enregistré les modifications, vous les verrez se refléter en direct. C'est donc très utile. C'est vraiment pratique. Vous n'avez donc pas besoin d'appuyer encore et encore sur le bouton d'actualisation. Il se chargera de vous montrer le résultat sans que vous ayez à le rafraîchir. Il recharge donc automatiquement les modifications que vous apportez. D'accord ? Cette extension de serveur live est donc très utile, oui, je l'utilise tout le temps. Plus jolie. Il s'agit donc d'un format de code qui vous aidera à formater votre code. C'est donc ce qu'il fait. Je l'ai installé ici. Alors c'est tout. C'est tout pour le code HTML et JAScript. Ce sont les extensions. J'ai beaucoup d'autres extensions comme Tailwind, Python OK, donc je fais toutes sortes de programmes. Vous trouverez donc de nombreuses extensions dans mon code Visual Studio, et je continue de les supprimer, de les réinstaller ou d' installer les nouvelles, d'en essayer de nouvelles, tout ce que je fais. C'est bon. Donc oui, il s'agit des extensions qui peuvent vous aider à améliorer votre environnement de développement. Je vous recommande donc de passer à un serveur live si vous utilisez un fichier HTML pour voir votre code Jascript car il peut vous aider à voir vos modifications en temps réel 7. JS dans le même fichier ou dans un fichier séparé: Il est donc temps que nous comprenions comment écrire du JavaScript de manière évolutive ? Maintenant, ce que je veux dire par méthode évolutive, c'est que nous sommes en train d'écrire du JavaScript dans les balises du script, n'est-ce pas ? Désormais, chaque fois que vous travaillez dans un scénario réel ou dans des applications de production , vous n'aurez pas accès à du JavaScript de deux lignes, n'est-ce pas ? Il se peut que les fichiers soient très longs, car il y a beaucoup de Javascript impliqué dans certains projets. Dans ce cas, il n'est donc pas bon d'écrire votre JavaScript de cette façon. Il est préférable de séparer le code JavaScript du code HTML. C'est donc ce que je vais vous montrer. Donc, ce que vous pouvez faire, c'est ce que nous allons faire ici, c' créer un nouveau fichier Ja Script, et je vais l'appeler point d'index Gs. Vous pouvez donc voir qu'au moment où j'ai tapé le point JS, vous pouvez voir l' icône du fichier ici Il s'agit d'un fichier JS et d'un fichier HTML. Il s'agit donc d'une représentation par code Visual Studio qui vous aide à identifier le type de fichier. D'accord ? Donc, ce que je vais faire, c'est couper ces deux lignes de code. Je vais le déplacer ici. OK. Et pour le moment, si je sauvegarde ceci, vous ne verrez aucune sortie. D'accord, parce qu'il n'y a aucun script Ja écrit ici dans le fichier eSTIML ou qui écrit ici dans le fichier eSTIML ne soit même pas lié ici Donc, si vous n'écrivez pas de JavaScript dans le fichier eSTIML, vous pouvez le lier et l' écrire dans un fichier externe, qui est le fichier E tot JS, qui signifie Ja script Donc, ce que je peux faire, c'est que je peux essentiellement prendre cela sur la même ligne et ajouter ici un attribut. Il existe donc un attribut appelé SRC pour la balise de script, qui vous permet de spécifier le nom du fichier D'accord ? Je peux donc dire index, et vous pouvez voir la suggestion automatique ici, point d'index Q. Il s'agit donc d'une suggestion automatique à partir du code Visual Studio. Et je peux dire « Save ». dès que vous dites Enregistrer, vous pouvez voir ici, bonjour Old, et ça vient de l'index JS Et vous pouvez réellement apporter des modifications ici si vous le souhaitez et voir les modifications se refléter ici. D'accord ? Donc oui, c'est à peu près tout. Maintenant, une chose que je veux mentionner ici concerne le serveur en direct. Donc, si vous souhaitez fermer le serveur, vous devez cliquer sur ce bouton. Cela va donc détruire ce serveur. Et si vous l'actualisez , alors d'accord, il ne se rechargera tout simplement pas. Tu peux voir. Et si vous voulez le remettre en ligne, vous pouvez le démarrer et il l'ouvrira. Hein ? Donc, oui, c'est ainsi que vous pouvez séparer le code JS du code HTML. 8. Commentaires dans JavaScript: Parlons maintenant des biens communs. Que sont les biens communs ? Les commentaires sont donc comme des nœuds dans votre code Maintenant, il s'agit d'un ensemble d'instructions qui ne sont pas exécutées et qui sont ignorées, et elles ne sont que des références pour vous. Donc, si vous utilisez un autre langage de programmation comme Java ou Python, il est probable que vous connaissiez ce concept de communs et que vous sachiez ce qu'il est. Désormais, en JavaScript, deux types de commentaires sont pris en charge. L'un est un commentaire d'une seule ligne et l'autre un commentaire de plusieurs lignes. Je peux donc avoir deux barres obliques ici et je peux dire qu' il s'agit d'un commentaire d'une seule ligne, quelque chose comme ça OK ? Maintenant, si je sauvegarde ceci, il n'y a littéralement aucun impact sur la sortie car cela n' est jamais exécuté. Je peux même commenter cette ligne de code. Et si je sauvegarde ceci, cette ligne est commentée et elle n'est pas exécutée. Donc oui, voici comment vous pouvez utiliser un commentaire sur une seule ligne. Vous pouvez également venir ici dans le code Visual Studio sous Modifier ici. Vous verrez un commentaire sur la ligne à bascule. C'est donc un raccourci ici. Le raccourci pour moi est donc Control plus forward slash. OK. Comme je suis sous Windows, je peux garder mon curseur sur cette ligne, et je peux dire Ctrl et barre oblique, et vous pouvez voir que je suis capable de basculer entre les commentaires d' une seule ligne OK, je peux même sélectionner l'intégralité de ce bloc de code et je peux voir Control et Forward Slash Maintenant, si vous êtes sur Mac ou Linux, ce raccourci peut être différent, mais je vous montre simplement comment vous pouvez l'obtenir vous-même. C'est bon. Il existe également ce que l'on appelle bloquer les commentaires, comme vous pouvez le voir ici. Maintenant, je vous ai dit qu'il s'agit commentaire d' une seule ligne ou qu'il est également connu sous le nom de commentaire de ligne. Maintenant, il existe ce qu' on appelle un commentaire bloqué ou également un commentaire multiligne. OK ? Vous pouvez donc commenter plusieurs lignes de code de cette façon, en ayant ces deux barres obliques sur chaque ligne Mais il y aurait des situations où vous voudriez suivre cette voie. C'est à ce moment-là que vous pouvez utiliser le commentaire multiligne. Donc, pour faire un commentaire sur plusieurs lignes, nous allons regarder la capture d'écran ou, désolé, pas la capture d'écran, le raccourci Vous pouvez donc voir shift lt et A, ou vous pouvez même sélectionner cette option ici. Vous pouvez donc voir que les deux lignes de code que j' avais sélectionnées sont maintenant conformes à cette syntaxe, qui est destinée aux commentaires multilignes, et elles ne seront pas exécutées Donc, si je sauvegarde ce fichier, vous ne verrez littéralement aucune sortie sur la console. OK ? Il s'agit donc d'un commentaire multiligne OK, et je peux changer ça. Il y avait donc Control Shift et E ici. Oups, j'ai fait une erreur. Qu'est-ce qu'un raccourci ? C'était donc Shift Old et E. Je suis désolée. OK, donc je peux sélectionner ceci et je peux dire de déplacer l'ancien et le E sur mon système. Oups. OK, ça ne marche pas pour moi. Passez de l'âge à un A. Je devrais travailler idéalement. Mais oui, je ne sais pas. Le raccourci ne fonctionne pas pour une raison quelconque. Laisse-moi essayer encore une fois, passer à l' ancienne et A. OK, ça a marché. Je ne le faisais probablement pas correctement sur le clavier. OK ? Cela a fonctionné. Et je vais enregistrer ça pour que tu puisses voir que les files d'attente sont bondées. OK ? Donc c'est un commentaire d'une seule ligne, et si je passe à une nouvelle ligne et si je vois quelque chose comme ça ici, d'accord ? Il s'agit de commentaires multilignes. Je vais donc ajouter cette ligne ici. OK ? Il s'agit donc d'un commentaire sur plusieurs lignes. OK. Maintenant, il existe une autre façon d'améliorer la façon dont vous commentez, connue sous le nom de commentaires sur les documents, d'accord ? Il est donc également appelé documentation ou commentaires de document, et il se compose d'annotations. OK ? Maintenant, ce qui se passe normalement, c'est que vous aurez beaucoup de code, comme des fonctions , des classes, des objets créés dans le code, et vous voudriez avoir une description du type de paramètres que toute personne utilisant cette fonction particulière est censée transmettre et pourquoi ces paramètres sont nécessaires et tout ça. OK ? Donc, en gros, à l'aide des commentaires du document, vous pouvez utiliser des annotations et spécifier toutes ces informations Je vais donc simplement ajouter un exemple simple de commentaires de discussion ici, d'accord ? Donc ici, vous pouvez voir que nous avons une fonction, d'accord ? Si vous n'êtes pas au courant de ce concept de fonction ou méthode, ne vous inquiétez pas. Mais si vous venez d'un autre langage de programmation, vous devez être conscient de choses comme les fonctions, les méthodes, etc., n'est-ce pas ? Je l'utilise donc simplement pour montrer cet exemple. Maintenant, vous pouvez voir ici que c'est faire un commentaire. C'est la syntaxe, d'accord ? Et vous pouvez voir ici que cette fonction ajoute essentiellement deux nombres, et j'ai également spécifié le paramètre. J'utilise donc at the rate para annotation ici. L'annotation commence par un débat publicitaire. OK ? C'est donc ce qu'est l'annotation. Et je précise qu'il s'agit d'un nombre et que le nom est A, et que c'est le premier chiffre. Et encore une fois, je décrit le deuxième paramètre , puis quel est le type de retour de cette fonction. Maintenant, si vous passez la souris dessus, si vous survolez cette fonction, vous verrez que cette documentation est réellement affichée, comme vous pouvez le voir dans cette fenêtre contextuelle Ainsi, si vous essayez d'utiliser cette fonction dans un autre fichier, vous pouvez voir ce que vous avez écrit ou bien plus d'informations sur cette fonction particulière. C'est ce que cela signifie, d'accord ? Maintenant, la question est la suivante : si vous regardez la syntaxe, vous serez un peu inquiet Vous allez dire : « Hé, je dois ajouter ces astérisques sur chaque ligne. La réponse est donc non. C'est généré automatiquement pour vous. Donc, ce que vous pouvez faire, c'est avoir une barre oblique, et vous pouvez avoir deux fois astérix ici. Donc, si vous ajoutez deux fois un astérix, l'IDE sait que vous souhaitez ajouter les commentaires de style doc et vous pouvez réellement ajouter les éléments dont vous avez besoin. OK ? Et vous pouvez utiliser l' annotation ici. Tu peux voir. OK ? Désormais, chaque fois que vous appuyez sur Entrée, un nouvel astérisque est ajouté D'accord, vous n'avez donc pas à vous soucier de l'ajouter à chaque ligne. OK. C'est donc la raison pour laquelle les gens utilisent l'identification. C'est une autre raison. OK. Vous pouvez également faire tout ce que nous faisons dans le Bloc-notes, mais vous n'aurez pas accès à toutes ces fonctionnalités, vous savez, à ces suggestions et à la génération automatique d' astérisques. Tout cela n' arrivera pas dans le bloc-notes, et c'est pourquoi les gens utilisent des identifiants, d'accord Un autre cas d'utilisation de cette façon de documenter le code aura donc lieu demain si vous souhaitez générer une documentation EPA Supposons donc que vous ayez écrit un EPI en JavaScript ou une bibliothèque en JavaScript, et que vous souhaitiez générer une documentation pour celui-ci Vous pouvez donc utiliser les outils disponibles. Il existe des outils externes, comme un outil, c'est Jstok, trois. OK ? Et vous pouvez vous en servir et générer la documentation. Et la documentation est générée à partir de cela. Donc, si vous l'avez ajouté comme toutes les fonctions et tous les EPI, peu importe ce que vous aurez trouvé, cela vous donnera la documentation que vous pourrez partager avec vos développeurs frontaux ou avec qui vous voulez la partager, d'accord ? Maintenant, je voudrais également vous demander si vous souhaitez en savoir plus sur ce style de documentation. Je vous demande de vous référer à ce site web jsto dot app OK. Et c'est essentiellement un style standard, je dirais, pour documenter votre code Jascrit Et ici, si vous voyez, vous verrez une liste de plusieurs annotations ou de plusieurs balises ici Vous pouvez voir que nous utilisions Param, que vous devriez voir quelque part ici OK ? Vous pouvez voir le paramètre. C'est bon. Et il y a plein de choses que vous pouvez utiliser. Si vous cliquez dessus, vous aurez accès à plus de détails sur la façon dont ils peuvent être utilisés. OK ? Et oui, c'est ce que c'est. Vous pouvez cliquer ici sur le côté droit, en haut, et vous pouvez également vous rendre sur leur référentiel Github pour en savoir plus OK ? Donc oui, il s'agit action GS que vous pouvez explorer davantage si cela vous intéresse, d'accord ? Mais oui, c'est une question de commentaires, et je vais m' en débarrasser ici pour le moment. C'est bon. J'espère donc que vous avez pu me suivre, et j'espère que cela vous a été utile. 9. JavaScript dans Nodejs: Salut, quoi de neuf, tout le monde. Permettez-moi donc de vous montrer comment vous pouvez utiliser nœud Gus pour exécuter votre code Jar Script. Jusqu'à présent, nous avons exécuté notre script Jar directement depuis le navigateur lui-même, et ici j'utilise du code VS avec une extension de serveur live, et je n'ai pas besoin d'extension sauf pour les rechargements en direct, mais oui, les rechargements en direct me facilitent la vie , vous savez, en tant que développeur, vous pouvez même ouvrir ce fichier d'estimation directement dans le navigateur et consultez la sortie dans la console. Mais vous devrez actualiser chaque fois que vous apporterez des modifications, ce qui n'est pas pratique à mon avis. Alors, qu'est-ce que NodeJS ? NodeJS fournit un environnement d'exécution Donc, si vous recherchez simplement NodeJS sur Google, vous allez venir, ou vous verrez ce lien nogs.org, qui est le lien du Maintenant, comment NodeJS est entré en scène. Ce qui s'est passé, c'est qu'un ingénieur du nom de Ryan Dahl a pris le moteur V 8 De Google qui permet à Ja Script de s'exécuter dans Google Chrome. Donc, dans Google Chrome, vous voyez que Ja Script est exécuté, comment il est exécuté à l'aide de huit moteurs. Ryan a donc pris ce moteur Vet et a créé NodeJS. NodeJS est donc essentiellement ce huitième moteur qui vous permet d' exécuter Ja Script n'importe où. D'accord ? Maintenant, pour l'obtenir ou pour exécuter NodeJS sans l'aide de Oh, sorry, Nod Donc, si vous souhaitez exécuter Ja Script sans l'aide de navigateurs, vous devez installer Nojs sur votre système C'est vrai. Et vous pouvez simplement accéder à ce site Web. Vous pouvez accéder à Télécharger ou vous verrez ce lien de téléchargement ici sur la page d'accueil. OK ? Cliquez simplement sur ce bouton de téléchargement et il sera téléchargé sur votre système. Ou bien, vous pouvez accéder à Télécharger et sélectionner la version. Assurez-vous de sélectionner le plus récent. Quel système d'exploitation vous utilisez, accord, et installez-le simplement sur votre système. Vous pouvez donc même l' installer en utilisant ces utilitaires en ligne de commande, d'accord ? Ou vous pouvez également avoir un programme d'installation prédéfini. D'accord, il existe donc différentes options d'installation. Je recommande l'installateur. Vous devez utiliser le programme d'installation, il suffit donc de le télécharger et de l'exécuter. C'est donc assez simple à installer. C'est comme n'importe quel autre logiciel que vous installeriez normalement sur votre système. accord ? Maintenant, une fois l'installation terminée, je ne vais pas vous montrer les étapes d'installation. C'est assez standard. suffit donc de vous rendre sur le terminal ou tout autre terminal en dehors du code Visual Studio si vous souhaitez préférer le terminal de votre système d'exploitation natif. Tu peux le faire aussi. Mais comme j'utilise le code Visual Studio, il possède une fonctionnalité de terminal intégrée, qui m'aidera à ouvrir ce terminal ici. OK ? Maintenant, dans le terminal, vous pouvez exécuter ce trait d'union du nœud de commande, qui imprimera la version du nœud que vous avez sur votre système Il est donc très probable que vous voyiez un numéro de fils différent imprimé ici selon le moment où vous regardez cette vidéo. Mais si vous avez un numéro de fils en cours d'impression, c'est très bien, tant qu'il est imprimé. OK, il devrait être imprimé. Sinon, il y a un problème avec l' installation de nodejs sur votre système Soit il n'a pas été installé correctement, soit il ne l'est pas du tout. OK ? Donc, avant l'installation ou avant de le télécharger, je vous recommande également d'exécuter cette commande et de vérifier si le nœud existe sur votre système, n'est-ce pas ? Il existe donc sur mon système. Je sais que je l'ai installé très tôt. Maintenant, une fois que le nœud existe, je vais effacer cela en disant NP ou en disant nœud ici. Il s'agit donc d'une commande, et je transmettrais le nom du fichier Ja Script. Cet indice point chg. Mais avant d'exécuter cette commande, assurez-vous que vous êtes dans le bon répertoire. Je vais donc consulter mon répertoire ici. Donc, en ce moment, je suis dans ce répertoire, et c'est un répertoire où réside également mon fichier Ja Script. OK ? Je vais donc dire nœud ici. Et je vais dire le point d'index Gs. Et si je dis Entrée, vous verrez le résultat arriver ici, d'accord ? Donc, avec cette approche, vous pouvez utiliser le terminal et vous n'avez pas besoin de la console du navigateur ici, d'accord ? Et vous n'avez même pas besoin du serveur live, n'est-ce pas ? Donc, en gros, vous écrivez du code ici, qui est du JavaScript ordinaire et vous le voyez s'exécuter sur la console comme ceci. OK ? Aucun fichier TML, aucun serveur en direct ou aucun des deux n'est nécessaire serveur en direct ou aucun Le navigateur aussi, d'accord ? Parce que vous exécutez maintenant Ja Script en dehors du navigateur. J'ai expliqué ce qu'est le nœud JS et comment il est apparu. OK ? Vous utilisez donc NodeJS ici. Mais je souhaite juste vous montrer cette méthodologie à tous, d'accord ? Je ne l'utiliserai pas personnellement, d'accord, car je veux vous montrer comment Ja Script fonctionne avec le HTML. Nous allons donc nous en tenir à cette méthode. Mais oui, j'aurais aimé que vous connaissiez également les autres méthodes. C'est pourquoi j'ai décidé de vous le montrer. Bien, j'espère que vous avez pu me suivre, et j'espère que cela vous a été utile 10. Manipulation de DOM en utilisant JavaScript: Parlons de la manipulation de Dom. Maintenant, qu'entendez-vous par manipulation du destin ? Maintenant, si vous parlez de JavaScript, vous devez avoir entendu parler de ce terme appelé Dom. Maintenant, Dom est l'abréviation de document object model. Désormais, chaque fois que vous affichez une page Web dans le navigateur, elle est convertie en une structure, droite, que la page Web affiche. Et cette structure est ce que l'on appelle le d'objet de document ou de modèle, n'est-ce pas ? Maintenant, JavaScript peut interagir avec ce Dom et peut même le modifier. C'est la puissance de JavaScript. Lorsque nous disons que Ja Script ajoute des comportements aux pages Web, c'est la capacité que cela apporte. Il peut donc interagir avec le Dom et il peut même le modifier. Maintenant, je vais juste vous montrer quelques fonctionnalités sur façon dont il peut modifier les choses à partir de Ja Script lui-même, d'accord ? Nous avons donc ici le titre du cours JAScript, d'accord ? Ici, vous voyez H one Jascript Cure. Donc, ce que je vais faire, c'est ajouter probablement un PTAC ici. OK, disons que c'est un tag P. Je n'ajouterai rien. Je vais ajouter un identifiant, d'accord ? Et je dirais que c'est le nom ici, d'accord ? donc ajouté une balise P, et je lui ai donné un attribut appelé ID, qui a une valeur de nom. OK ? Maintenant, pourquoi lui ai-je donné un identifiant ? Comme nous voulons accéder à cette balise P depuis Ja Script et accéder à n'importe quelle balise depuis HTML, Jascript doit la récupérer à l'aide d'un identifiant Et l'identifiant est cet identifiant unique. Donc, si vous passez la souris dessus, vous verrez qu'il définit un identifiant unique, qui doit être unique dans l'ensemble du document Il s'agit donc du document complet, et celui-ci devrait être unique pour que Ja Script puisse le récupérer correctement. OK ? Maintenant, ce que je vais faire c'est tout d'abord, si vous actualisez ceci, vous verrez qu'il n'y a aucune sortie ici parce que nous n'avons littéralement rien ajouté, n'est-ce pas ? Il s'agit d'une balise MTP. Donc ici, je peux dire « document point get element by ID ». OK ? Nous voyons donc dans le document qu'il faut obtenir cet élément par identifiant. Maintenant, quel élément demandons-nous ? OK ? Nous demandons donc un nom. C'est le nom de notre élément ici. OK ? Maintenant, en utilisant d'ici, je peux accéder à sa propriété. Je peux donc dire que le texte intérieur est égal à, je peux ajouter bonjour ici, quelque chose comme ça. OK. Et je vais ajouter un point-virgule et je vais Maintenant, vous allez voir bonjour ici. OK ? Donc, ce hello est ajouté dans le document HTML ou dans le code HTML à l' aide de CHAVscript, vous pouvez voir que c' est la ligne de code qui fait cela OK ? Et c'est assez simple également. Nous disons que document, ou à partir du document, obtenez cet élément par son identifiant, qui est l'élément. Vous devez donc saisir le nom ici. OK, vous pouvez voir ici. Cet élément get by ID renvoie ou fait référence au premier objet avec la valeur spécifiée de l'attribut ID. C'est ce que ça passe. Et puis nous voyons un texte intérieur, d'accord ? Nous modifions donc le texte intérieur ici et nous ajoutons bonjour là-bas. OK ? C'est donc ce que nous faisons, d'accord. Maintenant, je vais vous montrer quelques autres exemples. Donc, ce que je vais faire, c'est ici, donc dans ce code HTML, ce que je peux faire, c'est venir ici. J'ai ce tag P. Je peux changer cette balise P en H un, afin qu'elle soit mieux visible. OK ? La taille est plus grande. Maintenant, ce que je vais faire c' est afficher le bonjour ici. OK. Je peux à nouveau dire « document point get element by ID », d'accord ? Je vais chercher cet élément, dont le nom est ici, d'accord ? Et puis je peux dire «   On click » ou « Tout le texte intérieur », d'accord ? Ou 1 seconde. Permettez-moi également d'ajouter un bouton ici. OK ? J'ai raté l'ajout d'un bouton, je vais donc en ajouter un ici. Donc ce que nous allons faire, c'est ce que j'essaie de montrer, c'est qu'en cliquant sur ce bouton, je vais changer le texte, changer le texte. Bouton. OK. Et c'est juste un bouton avec le changement de texte ici. Tu peux voir. Je vais juste le minimiser un peu. OK. Donc, au lieu du nom, je vais me faire changer. Alors quel était l'identifiant, c'est le bouton de changement de texte. Je vais juste le donner ici. OK ? Et puis ici, je vais dire point sur clic sur ce bouton. OK. Vous pouvez le voir en cliquant ici. En cliquant sur ce bouton, je dois avoir une fonction. OK ? Il s'agit d'une fonction et de l'état de la fonction. Oups. OK, donc j'ai clarifié cela et ici, quelques éloges, OK, je vais vous dire ce qui devrait se passer en cliquant sur ce OK ? Donc, en cliquant sur ce bouton, ce texte devrait changer. Je vais donc copier cette ligne ici parce que c'est la ligne qui nous aide à changer le texte, et je peux dire bonjour, je peux dire bonjour encore une fois ici, quelque chose comme ça. OK. J'espère donc que cela a du sens. Ce que nous essayons de faire ici. C'est bon. Nous disons en fait que le document ne reçoit pas l'élément par identifiant. Nous obtenons cet élément. Il s'agit d'un bouton. Et en cliquant sur ce bouton, nous disons d'exécuter cette fonction. Que sont les fonctions, au cas où vous ne le sauriez pas, les fonctions ne sont rien d'autre qu'un bloc de code conçu pour effectuer une tâche particulière. Et la tâche que nous essayons de faire ici est simplement de changer le texte de cet élément en particulier ici, et cet élément en particulier est une balise H one, d'accord ? Nous obtenons donc cette balise H one, et nous changeons à nouveau le texte intérieur en bonjour. Alignez-le avec un point-virgule. Je vais enregistrer ça. Et maintenant, si vous dites « changement », vous verrez à nouveau bonjour. OK ? C'est donc une puissance de JavaScript, d'accord ? Vous pouvez voir à quel point il est puissant. Nous venons d'ajouter un écouteur onclick, et à l'aide de la fonction, nous sommes en mesure de mettre à jour le nom Ou plutôt, je dois dire que nous ne mettons tout simplement pas à jour le nom. Nous sommes en train de modifier un élément ou un tag préexistant sur la page. OK ? C'est donc là une puissance de JavaScript que vous pouvez sentir. Il ne s'agit donc pas simplement de modifier le texte, mais vous pouvez même mettre à jour les styles à la volée. OK ? Et pour démontrer cela, disons que si je clique sur modifier, je clique sur modifier, je souhaite changer la couleur de fond d'un élément pour autre chose, je peux même le faire avec JavaScript. Je vais donc simplement dupliquer cette ligne ici. Et ici, disons que je veux changer le style de cet élément en particulier rouge, par exemple. Je peux donc dire qu'après avoir obtenu cet élément en particulier, au lieu du texte intérieur, je peux voir le style, tout, je peux voir l'arrière-plan. Vous pouvez voir qu'il y a tellement de propriétés auxquelles vous avez accès, d'accord ? Vous avez également accès à la couleur du texte ici. OK. Aucune couleur de texte. Désolée pour ça. C'est juste la couleur. OK ? Nous parlons donc de couleur d'arrière-plan, donc je vais juste vous donner la couleur d' arrière-plan ici, et ici je peux dire rouge. Et je vais voir si c'est le cas. Maintenant, en cliquant sur le bouton de modification, vous verrez que le texte a également été modifié et que la couleur de fond est désormais rouge. Si vous le souhaitez, vous pouvez même changer la couleur du texte en blanc. Je peux simplement dupliquer cette ligne et je peux dire que la couleur peut être le blanc. OK. Et vous pouvez dire, par ici, non ? Donc blanc parce que sur le rouge, le noir ne me semblait pas très beau. OK, c'est ma préférence. Mais c' est possible avec JavaScript. Vous pouvez voir comment cela peut ajouter beaucoup de comportement aux éléments HTML, et une page HTML statique possède désormais des comportements et des éléments qui se mettent à jour dynamiquement en fonction des événements que vous effectuez sur la page Web, d'accord ? J'espère donc que vous avez pu me suivre, et j'espère que cela vous a été utile. 11. Variables dans JavaScript: Commençons par parler de ce qu'est une variable. Maintenant, si vous venez d' un autre langage de programmation, il est fort probable que vous connaissiez les variables en tant que concept. Une variable est comme une boîte de rangement dans laquelle vous pouvez conserver une information pour utilisation ultérieure. Maintenant, qu' est-ce que cela signifie ? Maintenant, si vous créez gros programmes dans n' importe quel langage de programmation, il est très probable que vous souhaitiez stocker des informations. Par exemple, si vous créez une calculatrice, vous souhaiterez peut-être stocker des chiffres et le résultat afin de pouvoir les afficher à l'utilisateur. Vous souhaiterez peut-être également enregistrer des numéros. La raison en est que vous voulez faire des calculs sur ces chiffres, n'est-ce pas ? Vous voudrez peut-être le stocker quelque part, et ces numéros doivent être accessibles, n'est-ce pas ? C'est donc là qu'intervient le concept de variable. Il permet de stocker les informations pendant l' exécution du programme. C'est donc ce que dit la définition. Une variable est comme une boîte de rangement. Une boîte de rangement parce qu'elle permet de stocker des informations, non ? Donc, la partie suivante indique où vous pouvez conserver l' information pour qu'ils puissent l'utiliser plus tard, n'est-ce pas ? Vous pouvez le considérer comme une étiquette que vous collez sur quelque chose dont vous voulez vous souvenir. Imaginez donc cette boîte ici et disons que vous avez une boîte nommée ou étiquetée avec un nom ici. Au lieu d'une étiquette, vous voyez un nom ici. Et à l'intérieur de la boîte, tu as mis le nom Alice. Désormais, chaque fois que vous souhaitez utiliser le nom Alice, vous pouvez simplement vous référer à la zone de nom et vous pouvez l'utiliser au lieu de taper Alice à chaque fois. Maintenant, il s'agit d'un exemple très simple. Bien sûr, les variables peuvent également stocker beaucoup de choses complexes, comme des phrases et tout le reste, que vous pouvez utiliser au cours de l' exécution du programme, n'est-ce pas ? Maintenant, la création d'une variable en JavaScript est assez simple. Nous allons donc créer notre première variable, d'accord, et nous verrons comment nous pouvons l'utiliser maintenant, commençons à créer une première variable. Je vais dire comment vous créez des variables en JavaScript et vous ajoutez le nom de variable que vous souhaitez avoir. Supposons que je veuille enregistrer le nombre pour compter quelque chose. J'ai créé cette variable nommée count. Maintenant, après cette instruction, si je sauvegarde le programme, j' ai effectivement créé une variable, mais je ne l'utilise pas réellement. C'est pourquoi je ne vois rien dans la sortie, n'est-ce pas ? Maintenant, je peux dire point de console, me connecter ici, et je peux immédiatement imprimer ou utiliser la variable Donc, je l'utilise, cela signifie que je suis simplement en train de l'imprimer en ce moment. OK, je n' effectue aucune opération sur les variables. Je vais donc enregistrer ceci et vous verrez que undefined est imprimé ici Cette variable ne contient donc rien. Vous pouvez donc penser que la boîte que vous avez avec l'étiquette ne contient aucune information. Pourquoi ? Parce que vous ne lui avez attribué aucune information. Vous pouvez donc attribuer des informations de cette façon, sorte que vous puissiez dire que le nombre est égal à zéro ici. Et si vous l'enregistrez, vous verrez zéro s'imprimer sur la console, n'est-ce pas ? Vous pouvez rendre ce code beaucoup plus concis en combinant ces deux instructions. Il s'agit donc de la déclaration et de la partie initialisation de la création de variables Donc, ce que je peux faire, c' est combiner les deux, d'accord ? Alors laissez-moi appuyer sur Backspace et laissez-moi combiner ça, d'accord, quelque chose comme ça Maintenant, si je sauvegarde ceci, le résultat sera le même. Je ne changerai pas. Mais pour le moment, au lieu de trois lignes de code, j'en ai deux. Voici donc comment vous pouvez créer et utiliser une variable. Bien sûr, l'utilisation que j'ai montrée ici est assez basique. J'imprime juste la variable. OK ? Et vous pouvez l'utiliser autant de fois que vous souhaitez au cours de l'exécution du programme. Cela dépend entièrement de vous. Vous pouvez donc voir ici, non ? Et vous pouvez même l' utiliser dans des opérations arithmétiques. Je peux donc dire « console point log » ici, et je peux dire « compte plus dix » ici. Vous pouvez voir dix sorties de base. OK. Maintenant, si le nombre est de dix, vous verrez 1010, puis en cours d' impression et vous pouvez voir une sortie de 20 bases Vous pouvez même modifier la valeur de la variable. Donc, quelque part au milieu des énoncés, je peux dire que le nombre est égal à 40, par exemple OK. Et je peux enregistrer ceci et vous pouvez voir trois fois que le décompte est de dix ici, puis le nombre est de 40, 40, 50, non ? 50 parce que j'en ajoute dix. C'est donc l' explication la plus simple pour les variables. Donc, pour retenir quelques points, une variable est comme une boîte de rangement dans laquelle vous pouvez conserver ou stocker l'information que vous souhaitez utiliser ultérieurement. Vous pouvez le considérer comme une étiquette que vous collez sur quelque chose vous voulez vous souvenir, n'est-ce pas ? Je me souviens donc du comte. Je stocke la valeur de count, et je l'utilise en fait au cours de l'exécution du programme. La création de variables comporte deux étapes. Il y a d'abord la partie déclaration, puis la partie initialisation, n'est-ce pas ? Maintenant, je combine l' initialisation et la déclaration en une seule, d'accord ? Et vous pouvez utiliser, euh, des variables autant de fois que vous souhaitez pendant l'exécution du programme, vous pouvez même réaffecter la valeur à une variable autant de fois que vous le souhaitez Je peux donc même le réattribuer à nouveau. Au lieu de 40, je peux en faire, disons, 80 et je peux le sauvegarder. Vous verrez le changement dans le résultat. OK ? Ce sont donc des variables pour vous, et j'espère que c'était une explication assez claire et la plus simple possible. 12. Noms de variables: Maintenant, ce n'est pas comme si vous ne pouviez créer qu'une seule variable dans un programme. Vous pouvez créer autant de variables que vous le souhaitez dans un programme. Donc, si je veux, disons, stocker un compteur ici, compteur est cinq, je peux le faire et je peux m'en servir n' importe où dans le programme. À la fin du programme, je peux dire journal des points de la console, et je peux imprimer la valeur. Oups. Je suis désolée Vous pouvez imprimer la valeur du compteur ici. OK. Et vous en verrez cinq être imprimés. Maintenant, s'il y a quelque chose qui est autorisé à créer beaucoup de choses à cause des variables, vous pouvez en créer autant que vous le souhaitez dans les programmes, d'accord ? Donc, s'il y a quelque chose comme ça, il est essentiel que la création de ces objets soit régie par des règles, n'est-ce pas ? De même, pour les variables, vous devez suivre un ensemble de règles lorsque vous créez et nommez des variables. Il existe donc maintenant un certain nombre de règles, pas beaucoup, mais quelques règles que vous devez garder à l'esprit lorsque vous utilisez des variables. Maintenant, vous n'êtes pas censé suivre ces règles par cœur, mais en général, avec de la pratique, vous les maîtriserez, n'est-ce pas ? Et les identifiants, si vous utilisez un identifiant moderne, tel que le code Visual Studio, ils garantissent également qu'ils signalent toute sorte d'erreur que vous commettez ou que vous vous écartez de la règle D'accord ? Donc, si vous essayez de nommer une variable qui n'est pas autorisée, je vous aiderai également à mettre en évidence le problème. D'accord ? Nous allons donc parler des règles une par une. Donc, la règle numéro un que j'ai ici à l'écran est que les noms de variables doivent commencer par une lettre, un dollar ou un trait de soulignement OK. Vous pouvez donc avoir un nom de variable. Alors laissez-moi clarifier un peu les choses, d'accord. Donc je vais juste me débarrasser de tout ça, d'accord ? Je vais juste garder les choses propres. Donc ici, cette variable commence en fait par une lettre, d'accord ? Vous pouvez avoir une variable commençant par quelque chose comme ceci. D'accord ? Il s'agit d'un nom de variable valide. D'accord ? Vous pouvez avoir une variable appelée trait de soulignement Ici, le nom est égal à, vous pouvez dire élevé OK. Cela est également valable. Ce sont donc tous des noms de variables valides. Désormais, vous ne pouvez pas utiliser de nom de variable commençant par une lettre. Vous pouvez donc prononcer un nom ici. Ce n'est pas valide, d'accord ? Si vous essayez de le faire, un message d'erreur s'affichera. Vous pouvez voir, comme je l'ai souligné, que les identifiants vous aident. Vous pouvez voir que c'est comme si vous disiez «  identifier », vous n'arrivez pas à obtenir ce que vous essayez de faire. D'accord ? Maintenant, pourquoi voudriez-vous nommer une variable de cette façon ? Un seul nom n'a aucun sens, n'est-ce pas ? Ce n'est donc pas autorisé. Je vais juste commenter, d'accord ? C'est donc l'une des règles que vous êtes censé garder à l'esprit. Et, bien sûr, si vous ne vous en souvenez pas, ne vous inquiétez pas, car les identifiants modernes, comme je l' ai dit, si vous utilisez un identifiant moderne, vous aideront à identifier tout écart par rapport aux règles, n'est-ce pas ? C'est donc la règle numéro un. Maintenant, la règle numéro deux dit qu'elle peut contenir des lettres, des chiffres, un dollar et un trait de soulignement après le premier caractère. D'accord ? Vous pouvez donc avoir une variable. Vous ne pouvez donc pas avoir de variable appelée user. Cela n'est pas autorisé. Oups. Il a donc détecté l'activation de l'utilisateur. OK. Vous ne pouvez pas avoir variable appelée user, quelque chose comme ça, non ? Cela n'est pas autorisé car cela commence par un chiffre. Mais vous pouvez avoir une variable appelée user one. Ceci est autorisé car ici, le numéro vient à la fin ou après le premier caractère. Vous pouvez également avoir un numéro après le premier caractère. D'accord ? Cela est également autorisé. Maintenant, vous pouvez même avoir un dollar, donc vous pouvez avoir un dollar ici ou vous pouvez également avoir un trait de soulignement Maintenant, le soulignement est utile si vous souhaitez séparer deux mots Donc, si je veux avoir le premier nom de soulignement, c'est ici que le trait de soulignement peut être utilisé D'accord ? Donc oui, c'est la deuxième règle qui mentionne que les noms des variables, non vous, peuvent contenir des lettres, des chiffres, des dollars et un trait de soulignement après le premier caractère Maintenant, la troisième règle dit que les noms de variables sont sensibles à la clé, d'accord ? Donc, cela signifie que si vous avez deux noms de variables, laissez-moi vous dire que si c'est le nom ici, accord, le nom est, disons, Alice ici. Oups. Si c'est Alice ici, et disons que vous avez un autre nom de variable qui est name ici. OK et c'est Tom, disons. Ce sont donc deux noms de variables différents, et je peux vous les montrer. Vous pouvez donc dire Console point log, et vous pouvez imprimer le nom ici. OK. Et vous pouvez dire Console, point log, et vous pouvez dire nom ici, quelque chose comme ça. OK. Si vous voyez la sortie, vous verrez Alice et Tom comme sortie. OK, c'est donc la règle numéro trois selon laquelle les noms de variables distinguent les majuscules et minuscules. La règle suivante indique que les noms de variables ne peuvent pas utiliser un mot clé réservé. Maintenant, que sont les mots clés réservés ? Or, dans les langages de programmation , il existe généralement des mots ayant une signification prédéfinie. Par exemple, let est un mot clé. Il a une signification prédéfinie, et il est utilisé pour créer des variables, n'est-ce pas ? Donc, si vous essayez de créer une variable avec le nom laissé ici, accord, ce n'est pas autorisé. Tu peux voir. Donc, si vous passez la souris dessus, cela indiquera que let n'est pas autorisé à être utilisé dans un nom dans les déclarations let ou contre OK, donc ce n'est pas autorisé, d'accord, donc je vais juste faire un commentaire. Vous ne pouvez donc pas utiliser de mots clés réservés. D'accord ? Maintenant, vous allez dire : « Oh, je dois mémoriser tous les mots clés réservés, pas du tout, car avec de l'entraînement, au fur et à mesure que vous commencerez à créer des programmes, vous saurez ce que sont les mots clés réservés. OK, try est un mot clé réservé, catch est un mot clé réservé. Vous saurez tout cela au fur et à mesure que vous apprendrez de nouveaux concepts, et cela s'acquiert avec la pratique. Même moi, je n'ai pas par cœur la liste des mots clés réservés. D'accord ? Au fur et à mesure que vous vous entraînez, vous apprendrez que ce sont tous des mots clés réservés, et aux endroits où vous les oubliez ou que vous ne vous en souvenez pas, les identifiants vous aideront, n'est-ce pas ? Mais c'est une règle à garder à l'esprit. La règle suivante indique que les noms de variables ne doivent pas avoir d'espèces. Si vous essayez d'ajouter un espace entre le nom de la variable, cela n'est pas autorisé. Si j'essaie d'ajouter un nom de variable car prénom est égal à dix, vous pouvez voir que ce n' est pas autorisé. Cela n'est pas autorisé. Il faut les combiner. C'est un seul mot. Vous devez le combiner de cette façon. Cette convention, où vous avez deux mots dans un seul nom de variable et le deuxième mot majuscule, est connue sous le nom de camel case OK. Nous transformons donc N en capital, mettant N en majuscule ici pour que ce soit lisible. Il y a deux mots. C'est ce que nous soulignons. Le premier est un mot et le nom est un mot. C'est une bonne pratique de dénomination ici. Le nom d'une variable ne doit pas comporter d'espace . Aucun espace n'est donc autorisé. La dernière chose à faire ici est d'utiliser des noms descriptifs. Ce n'est en fait pas une règle, mais plutôt une bonne pratique d' avoir des noms de variables descriptifs. Par exemple, disons que si j'ai un nom de variable, si je veux l'enregistrer, disons H ici. Et si je crée un nom de variable A ici et que je stocke H comme disons 22. Je n'ai pas 22 ans, mais je ne fais que donner un exemple D'accord ? Supposons donc que j'essaie de stocker H et que j'ai créé ce nom de variable. Maintenant, quiconque lit ce code ne sait pas A, quelle est la valeur que contient A. Bien sûr, il en contient 22, mais qu'est-ce que c'est ? C'est en fait un H, non ? est donc préférable d' avoir un nom de variable approprié où le nom de la variable lui-même indique le type de valeur que contient la variable. Donc, ici, il est assez clair que cette variable est créée pour stocker l'âge d'un utilisateur. Hein ? Donc, si vous élaborez un projet de gestion des employés ou quelque chose comme ça, d'accord ? Et si quelqu'un qui lit votre code tombe sur cette variable d'âge, il sait que cela représente l'âge de l'employé, d'accord ? Il est donc toujours préférable d'avoir noms de variables, des noms de variables descriptifs, je dirais, contrairement à et c'est une meilleure pratique d'avoir descriptifs, car avoir des noms de variables tels que X, A, B, C, X un, X deux, ce n'est pas du tout une bonne pratique, d'accord ? Je suis totalement contre . Donc oui, c'est la règle ici ou ce n'est pas vraiment une règle. Vous n'obtiendrez aucune erreur si vous la déclarez sous la forme A ou X, mais il s'agit d'une bonne pratique à suivre. C'est bon. autre chose que je voulais souligner à propos la création de variables ici est que vous pouvez également déclarer plusieurs variables sur une seule ligne. Donc je peux en avoir un. OK. Un deux, et je peux en avoir un trois. Ce sont donc trois variables créées sur une seule ligne, d'accord ? Et vous les avez séparés par des virgules. Vous pouvez même les initialiser ici. Je peux donc leur initialiser différentes valeurs, cinq, dix, et je n'ai pas initialisé A trois ici Je peux même initialiser A 3 à 15, d'accord ? Et je peux ajouter le journal de la console ici. Permettez-moi donc d'ajouter rapidement le journal de la console et de vous montrer le résultat. D'accord ? C'est un. OK. C'est un deux, et c'est pour un trois. OK. Et si je sauvegarde ceci, vous en verrez cinq, dix et 15. Maintenant, si je me débarrasse de A deux par ici. D'accord ? Et si je sauvegarde ceci, un deux n'est pas défini, d'accord ? Je ramène donc la valeur A deux, qui est dix ici. Vous pouvez donc absolument créer, déclarer et initialiser plusieurs variables sur une seule ligne Mais normalement, ce n'est pas comme ça que les gens font, d'accord ? Avec JavaScript, la convention générale est de procéder de cette façon. Vous voudriez donc en avoir un, quelque chose comme ça. D'accord ? Et puis mettez A deux sur une ligne séparée , puis A trois sur une ligne séparée, quelque chose comme ça. C'est donc ce qui est préféré à ce type de syntaxe car elle est beaucoup plus claire et facile à lire, d'accord ? Maintenant, vous voyez toutes les marques rouges ici. Pourquoi ? Parce que les noms de variables d'un seul programme doivent être uniques, ou du moins dans une portée. OK. Ainsi, dans une portée, le nom de la variable doit être unique. Vous pouvez donc voir ici que j' essaie de créer une variable nommée A un, et vous pouvez voir ici qu'une variable existe déjà, n'est-ce pas ? Donc, si j'ajoute A 11 ou e22e3, je suis autorisé à créer. OK. Donc oui, assurez-vous d' avoir des noms de variables uniques. Et c'est aussi une convention ou une chose, une règle, je dois dire que vous devez connaître à propos des variables. Vous pouvez même enchaîner les assignations, afin que je puisse créer des variables comme X, Y et Zt ici. D'accord et je peux avoir X égal à Y égal à Z égal à 30, par exemple. OK. Et ils auront tous une valeur de 30. Donc, si tu veux, je peux te le montrer. D'accord ? Donc c'est X. D'accord. Et puis ici c'est Y, et là c'est s. D'accord, si je garde ceci, vous verrez 30, 30, 30. D'accord ? Ils ont tous la même valeur. D'accord ? Donc oui, il s' agit de variables façon dont vous pouvez les nommer et des règles que vous êtes censé garder à l'esprit. Gardez donc à l'esprit ces règles générales en tant que telles, vous n'avez pas besoin de les durcir. C'est tout à fait normal. Ne vous inquiétez pas à ce sujet. Mais une fois que vous aurez commencé à programmer, d'accord, je ne veux pas être surpris que cela ne me permette pas de créer des variables portant ce nom. Bien sûr, ce ne sera pas le cas, car c'est une règle que vous devez connaître. D'accord ? Et les identifiants modernes, comme je l'ai dit, vous aident toujours et sont là pour vous envoyer des messages d'erreur détaillés J'espère donc que cela a été utile. 13. var vs let vs const: Il est donc temps de parler différentes manières de créer des variables en JavaScript. En JavaScript, vous pouvez donc créer des variables à l'aide de ces mots clés. Tu as appelé Const et nous sommes là, d'accord ? Ou cela se prononce également comme guerre. Donc War over here est une ancienne façon de créer des variables, d'accord ? Vous pouvez donc utiliser War et dire que le compteur est égal à 100 et vous pouvez dire Console ou Log ici et vous pouvez voir le compteur ici. OK, je vais ajouter un point-virgule. Vous pouvez maintenant le voir s'imprimer. Mais il s'agit d'une ancienne méthode de création de variables. D'habitude, à partir d' aujourd'hui, nous n'utilisons plus que la location ici. Donc, si vous voulez utiliser si vous voulez stocker le compteur ici, vous pouvez dire 100 et vous pouvez dire Console, point log et un nouveau compteur. D'accord ? C'est ainsi que vous créez des variables aujourd'hui. Maintenant, qu'est-ce que const ? Donc, si vous venez d'un langage de programmation différent, vous connaîtrez les constantes. Const est donc le mot clé qui permet de déclarer ou de créer des constantes Maintenant, une constante est quelque chose dont la valeur ne change jamais. Par exemple, ici, pour un nouveau compteur, je peux réattribuer une valeur, non ? Je peux dire que le compteur est égal à 200. D'accord ? Et si j'imprime à nouveau le compteur, je verrai 200 en sortie. Vous pouvez le voir ici. D'accord. Mais il y aura des moments ou des scénarios auxquels vous serez confronté lorsque vous ne voudrez pas que la valeur d'une variable change. D'accord ? Et dans ce cas particulier, vous pouvez utiliser const. Vous pouvez donc dire const ici et disons une valeur de Pi Vous pouvez donc dire 3,14. C'est la valeur de Pi, n'est-ce pas ? Maintenant, je vais juste le copier. Et vous pouvez imprimer la valeur de Pi. Vous pouvez voir 3.14. Maintenant, si j'essaie de changer cette valeur ici, si je dis que Pi est égal à 400. D'accord. Et si j'essaie de le sauvegarder, vous verrez un message d'erreur indiquant que l'affectation à une variable constante n' est pas autorisée, d'accord ? Et vous ne voyez pas le résultat. Et vous voyez également. Donc, ici, vous pouvez également voir comment vous pouvez déboguer votre erreur. Vous voyez donc que le point d'index porte le numéro de ligne 17. Et il s'agit de la ligne 17, comme vous pouvez le voir dans le code de Visual Studio, elle met en évidence votre numéro de ligne. Alternativement, vous pouvez même cliquer dessus, afin de cliquer sur Ceci est un lien. Si vous cliquez dessus, vous serez redirigé vers le code ici. Vous pouvez voir que c'est la ligne où se trouve l'erreur. Et si vous passez la souris dessus, vous verrez que c'est une ligne qui est à l'origine de l'erreur Affectation d'une erreur de type non détectée à une variable constante. C'est bon. Revenons donc à la console ici. Donc, si tu te débarrasses de cette ligne, oui. Et si vous sauvegardez, vous obtenez le résultat comme prévu. C'est bon. Donc, constante est l'endroit où vous ne voulez pas que la valeur de la variable soit modifiée. Et il existe de nombreux scénarios dans lesquels vous devrez créer des constantes. Par exemple, si vous travaillez sur une application bancaire, vous souhaiterez peut-être créer une variable ou stocker une valeur de taux d'intérêt. Maintenant, le taux d'intérêt ne change pas, n'est-ce pas ? C'est réparé. Donc, à condition que ce soit réglé pour votre banque, l' ensemble ou pour le projet sur lequel vous travaillez. S'il est fixe, vous voudrez peut-être avoir une constante parce que vous ne voulez pas que vous-même ou vous-même modifiez accidentellement la valeur du taux d'intérêt dans le programme ultérieurement. De plus, si vous travaillez en équipe, vous ne voulez pas que quelqu'un d'autre modifie cette valeur. C'est pourquoi vous mentionnez explicitement const là-bas, d'accord ? Et cela indique à tous les autres que, hé, c'est constant et ne doit pas être modifié. De plus, une convention ici est que chaque fois que vous déclarez une constante, vous verrez normalement des constantes être déclarées en majuscules. D'accord. Ainsi, par exemple, Pi ici est en majuscules. D'accord ? Donc oui, il s' agit de let const and where D'accord ? N'oubliez donc pas que vous pouvez créer des variables à l'aide de ces trois mots clés. Vous devez utiliser let lorsque vous souhaitez créer une variable normale dont vous pouvez modifier la valeur. R est une ancienne méthode de création de variables. Il n'est pas utilisé aujourd'hui. D'accord ? Je n'ai pas vu de développeurs les utiliser autour de moi, n'est-ce pas ? C'est une méthode plus ancienne. Alors oublie ça. Mais c'est bon à savoir, car si vous travaillez sur ancienne base de code, si vous rejoignez une entreprise, si vous travaillez sur un bit de code existant, il vaut mieux le savoir, d'accord, afin de pouvoir effectuer une mise à niveau, n'est-ce pas ? Const, bien sûr, si tu ne veux pas que la valeur change pour rester la même, je veux dire, d'accord, tu devrais utiliser ce gardien J'espère donc que cela vous a été utile. 14. Types de données: Bonjour, bienvenue, et maintenant il est temps de commencer à parler des types de données en JavaScript Le type de données n'est donc rien, mais les types de données définissent le type de valeur que contient une variable particulière. Maintenant, si vous venez d' une autre formation en programmation comme Java, Python ou quelque chose comme ça, vous devez savoir quels sont les types de données, n'est-ce pas ? Et pour ceux qui ne le savent pas, il s'agit d'une définition. Il définit simplement le type de valeur qu'une variable contient. Désormais, les types de données en JavaScript sont généralement classés en deux types. L'un concerne les types primitifs, puis nous avons les types de référence. Commençons donc par parler des types primitifs. Il s'agit maintenant des types de données primitifs en JavaScript. Vous avez donc un nombre, vous avez une chaîne, booléenne, indéfinie. Oui, undefined est également un type de données, et vous avez une valeur nulle. Donc, comme on dit, Number représente à la fois des nombres entiers et des nombres à virgule flottante D'accord ? Donc, si vous voulez des nombres, nous sommes tous, un, deux, trois et même des nombres à virgule flottante, les nombres avec des décimales comme 1,1, 1,2, ils entrent tous dans la catégorie des nombres Ensuite, vous avez des ficelles. Maintenant, la chaîne n' est rien d'autre qu'une séquence de caractères comme votre nom et tout le nom de la ville, le nom du pays, tout cela est inclus dans une chaîne. Booléen, qui n'a que deux valeurs, vrai ou faux, puis nous avons undefined, ce qui signifie qu'aucune valeur n'est assignée, et puis vous avez null Désormais, null indique que la valeur est absente intentionnellement. Maintenant, permettez-moi de vous montrer le chiffre ici. Donc ici, ce que je peux faire, c'est créer une variable appelée H. Je peux lui attribuer un numéro. D'accord ? Disons que H est ou disons que H est 70 ici, n'importe quel nombre. Et vous pouvez vous connecter à la console ici, non , et vous pouvez imprimer dans chacune d'elles. D'accord. Et vous verrez le résultat ici. Vous pouvez voir que 70 est le résultat. D'accord ? Maintenant, si vous souhaitez imprimer de quel type de variable il s'agit, vous pouvez utiliser type off. Je peux donc dire « tape off ». Vous pouvez voir le à suggérer. Ajoutez un espace, puis cliquez sur Enregistrer. Vous pouvez donc voir que le type de cette variable est un nombre. D'accord ? Maintenant, si je change cela en décimal, donc si je dis 70,5 ici, bien sûr, H ne peut pas être exprimé en décimal, mais je vais quand même le faire à des fins de démonstration, vous verrez que le type de H est toujours un nombre Ainsi, contrairement à d'autres langages de programmation tels que Java, en Java, vous disposez de types de données distincts pour les valeurs à virgule flottante et pour les valeurs entières. Mais en JavaScript, cela n'existe pas, d'accord ? Selon le type de valeur qu'il contient, d' accord, il peut s'agir d'un nombre, non d'une valeur décimale ou même d'un nombre entier Donc, ici, ce nombre entier, ce sera aussi un nombre comme nous l'avons vu. D'accord ? Voici donc ce qu'est le nombre. Et puis nous avons les ficelles. Donc ici, si vous faites défiler , je vais vous montrer ce que sont les chaînes. Vous pouvez donc dire « laisser le nom  » ici et ajouter, disons, John ou Alice, peu importe, puis vous pouvez dire « Console », Tot og » ici, et je peux dire « nom » ici. D'accord. Maintenant, bien sûr, cela va être imprimé dans John, mais vous pouvez dire type de, vous pouvez l'enregistrer et vous verrez une chaîne s'imprimer. Et c'est parce que le type de John n'est rien d'autre qu'une chaîne. D'accord ? Maintenant, je vais créer une autre variable ici. D'accord. Je peux créer une ville ici et vous pouvez également attribuer ou même créer une chaîne en utilisant un code unique. Donc, ici, j'utilise le double de, vous allez voir. Vous pouvez même utiliser un seul code ici. Maintenant, la ville dit que Jose est ici, d'accord. Et je vais juste copier ceci ici, cette partie. Et au lieu d'un nom, vous pouvez avoir une ville et vous pouvez l'enregistrer, vous verrez quand même que vous êtes en train de créer une chaîne. D'accord ? La chaîne peut donc être créée de plusieurs manières, d'accord ? Vous pouvez voir utiliser des codes doubles et également utiliser un code unique. Maintenant, vous pouvez même concaténer une chaîne, d'accord ? Vous pouvez donc dire Console. Désolé, c'est le journal des points de confirmation de la console ici, et vous pouvez dire que vous pouvez dire le nom, d'accord. Et je dirais « plus », et vous pouvez voir beaucoup d'espace entre les deux, et vous pouvez dire « ville » comme ça. Tu vas voir John San Jose. D'accord ? John Sin Jose n'a aucun sens, mais si vous avez des variables distinctes pour le prénom et le nom de famille, vous pouvez bien sûr les concaténer de cette façon pour obtenir un Maintenant, je vois que de nombreux développeurs préfèrent les codes uniques pour créer des chaînes lorsqu'ils travaillent avec JavaScript. Le type de données suivant est booléen. D'accord ? Désormais, Boolean représente simplement deux valeurs, vrai ou faux Je peux donc créer un booléen ici est ou je peux dire a obtenu son diplôme ici, et cela peut être vrai ici et je peux dire Console, point, log, et je peux dire tapez off et je peux dire a Maintenant, vous verrez Boolean comme résultat ici, d'accord ? Vous pouvez également simplement taper en tant que gradué, et vous verrez une véritable sortie AE. D'accord ? Maintenant, les types de données booléens sont en fait beaucoup utilisés lorsque vous prenez des décisions, d'accord ? prise de décision signifie que si un étudiant a obtenu son diplôme, vous pouvez probablement lui délivrer un certificat, n'est-ce pas ? Ou vous pouvez arrêter de calculer les présences. Si l'utilisateur est admin, vous pouvez donc avoir un booléen appelé I Si un utilisateur est administrateur, accordez-lui l'accès à certaines fonctionnalités de l'application. S'il n'est pas administrateur, empêchez-le d'accéder à toutes ces choses. Ainsi, en fonction de la valeur de la variable, l' administrateur est diplômé, les décisions sont prises, et cela est beaucoup utilisé dans la prise de décision. D'accord ? C'est donc un cas d'utilisation du booléen. Il représente simplement le vrai ou le faux. Vous avez alors indéfini. Donc, indéfinie signifie que la variable a été déclarée mais qu'aucune valeur n'a encore été attribuée, d'accord ? Vous pouvez donc dire « console point log » ici. Et laissez-moi d'abord créer une variable. D'accord. Je vais donc avoir une variable, soit la zone. Et disons que cela ne me convient pas. D'accord ? Je vais ajouter une zone ici, d' accord, et vous verrez l' indéfini être imprimé D'accord ? Maintenant, si je dis type de, vous verrez alors undefined être imprimé D'accord ? Cela n'est donc pas défini et aucune valeur n'est réellement affectée à la variable créée Maintenant, le suivant est nul, ce qui représente l'absence intentionnelle d'une valeur. Supposons donc que vous ayez créé une variable et que vous ne souhaitiez pas encore lui attribuer de valeur. Je peux donc créer une variable appelée valeur vide. Appelons-la valeur vide elle-même. D'accord. Et je vais lui assigner une valeur nulle. Maintenant, si je dis journal des points de la console, et si je dis valeur vide, je vais voir une valeur nulle être imprimée sur la console. D'accord ? Maintenant, je peux dire type de objet et enregistrer ceci et vous verrez le type de cet objet. Donc, null est en fait de type objet, d'accord ? Mais il s'agit en fait d'un type de données en JavaScript. D'accord ? Donc oui, il s' agit de Null ici. D'accord ? Je vais juste m' en débarrasser et nous le ferons imprimer. Maintenant, avant de passer au type de référence, je veux juste souligner une petite chose ici. Lorsque nous avons indiqué le type de valeur vide ici, qui est nulle, nous avons vu un objet être imprimé. Mais en fait, ce truc contient un zéro, non ? Il devrait donc idéalement imprimer null si null est un type de données. D'accord. Maintenant, je voudrais simplement mettre en évidence un article sur le débordement de pile ici, qui dit : « Pourquoi un type d'objet nul, n'est-ce pas Maintenant, ici, cela a été proposé idéalement. Donc, si vous allez sur ce lien ici, cela a été proposé pour le changer, cela a pris 1 seconde , pas celui-ci, mais c'est celui-ci. D'accord. Il a donc été proposé de le changer en null ici. D'accord ? Voici donc l'article complet ici, et c'est le truc avec Stack Overflow D'accord. Il a donc été proposé de le modifier, mais il a en fait été rejeté. Donc, si vous exécutez ce code ici, vous verrez toujours l'objet o en sortie. Mais peu importe, d'accord ? N'oubliez pas que vous pouvez avoir des valeurs nulles en JavaScript. Vous pouvez avoir des variables avec des valeurs nulles. C'est ce qui compte. Passons maintenant aux types de référence. Nous allons donc en parler de deux. L'un est l'objet, puis nous avons ce qu'on appelle Rs. Maintenant, qu'est-ce qu'un objet ? Désormais, l'objet est en fait utilisé pour stocker des données complexes sous forme de paires clé-valeur. D'accord ? Maintenant, pourquoi avons-nous besoin de stocker des données complexes ? Disons que je suis en train de créer une application et que, dans mon application, je souhaite suivre un utilisateur. C'est bon. Maintenant, je vais dire « laisser l'utilisateur ». Supposons donc que je souhaite suivre les utilisateurs H. Supposons que les utilisateurs H aient 22 ans, et je souhaite également suivre le nom d'utilisateur ici. D'accord ? Et disons que le nom est John, disons, par exemple, d'accord. Maintenant, j'ai deux variables qui représentent un seul utilisateur. Maintenant, disons que si mon application évolue et que j'ai des centaines et des milliers d'utilisateurs, que feriez-vous dans ce cas ? Est-ce que vous créeriez ces nombreuses variables ? Absolument pas D'accord ? Alors une bonne chose est de les regrouper. Ces deux propriétés ou ces deux variables appartiennent donc à un seul utilisateur, n'est-ce pas ? Alors pourquoi ne pas les regrouper et les stocker sous forme d'objet ? Donc, ce que vous pouvez faire ici, c'est une meilleure approche, c'est d'avoir une personne, parce qu'au lieu d'une personne, je vais avoir un utilisateur parce que nous parlons d'utilisateur ici, d'accord ? Je vais avoir la même chose ici, ce que je vais faire, c'est avoir deux endroits bouclés, quelque chose comme ça Et dans ce cadre, je vais avoir des paires clé-valeur, qui seront les attributs de cet utilisateur en particulier. D'accord ? Donc je peux dire le prénom, d'accord. Il s'appelle John ici. D'accord. Et puis je peux avoir H et H vaut 22. C'est bon. Maintenant, ce que je peux faire, c'est que si vous faites défiler la page vers le bas, je peux dire que je peux accéder à des propriétés individuelles. D'accord ? Je peux dire point utilisateur, et vous pouvez voir le nom et H. J'ai accès au nom et à H, donc je peux y accéder de cette façon. D'accord ? Une erreur que j'ai commise ici, j'ai dit que c'était une paire clé-valeur, mais j'ai en fait l'équivalent d' être utilisée là-bas. Ce n'est pas correct. Donc je vais juste le remplacer par Colin et vous verrez par ici, OK, Console. DotLog m'a également manqué. Qu'est-ce que je fais ? Alors maintenant, vous pouvez en voir 22 imprimés sur la console, n'est-ce pas ? Point utilisateur H. Vous pouvez également imprimer le nom et y accéder ici. C'est un nom, non ? Si vous souhaitez changer le nom, vous pouvez le remplacer par le point d'utilisateur et vous pouvez le remplacer par Alice, par exemple. D'accord. Ensuite, si vous essayez d'y accéder à nouveau, vous verrez Alice sous un nouveau nom. Vous pouvez le voir ici, non ? Voici maintenant ce que vous pouvez faire avec l'objet. Vous pouvez regrouper les attributs associés. Maintenant, c'est légèrement différent des langages de programmation tels que Java. En Java, il n'est pas possible de créer un objet directement. Vous devez d'abord avoir un cours, non ? Vous définissez donc d'abord une classe qui agit comme un modèle, puis vous instanciez la classe et vous créez un objet, puis vous pouvez avoir des variables ou membres de classe au sein de cette classe particulière Mais ce n'est pas ainsi que cela fonctionne dans Ja Script. En Javascript, vous pouvez créer directement des objets comme ceux-ci, et ils peuvent avoir des paires clé-valeur, ce qui est très pratique. Hein ? Maintenant, voyons ce qui se passe si vous essayez d'imprimer , donc je vais prendre le contrôle. Et je vais juste essayer d'imprimer en utilisateur ici. D'accord. Maintenant, si vous essayez d'imprimer en mode utilisateur, vous verrez que l' objet est imprimé dans son intégralité. Elle s'appelle Alice, elle a 22 ans. D'accord ? Et vous pouvez même accéder aux propriétés individuelles. Maintenant, une autre chose que je voudrais souligner ici, c'est que, comme je l'ai dit, vous pouvez accéder à des propriétés individuelles comme celle-ci, n'est-ce pas ? C'est ce que nous avons vu. Maintenant, cette façon d'accéder aux propriétés individuelles est connue sous le nom de notation par points parce que vous utilisez un point ici, un point ici, le symbole, d'accord ? Et vous l'utilisez avec l'objet, et vous essayez d' accéder à son attribut. C'est donc ce que vous essayez de faire, n'est-ce pas ? Et cette syntaxe est simplement connue sous le nom de notation par points. C'est bon. Il y a donc quelque chose que vous pouvez garder à l'esprit, n'est-ce pas ? Mais oui, l'essentiel reste que vous pouvez créer des objets comme celui-ci dans Ja Script Vous pouvez également avoir plus d'attributs, comme je peux avoir des attributs comme une ville ici, je peux dire San Francisco. OK, quelque chose comme ça. D'accord. Et vous pouvez le voir ici, en cours d'impression. Et je peux également accéder à la ville en utilisant la notation par points. D'accord ? Il s'agit donc d' objets en JavaScript. Passons à la discussion sur les tableaux. Maintenant, des tableaux Wata. Désormais, les tableaux sont un type de référence en JavaScript utilisé pour contenir plusieurs valeurs Supposons que vous créez un programme et que vous souhaitiez stocker une liste de valeurs, ou plusieurs valeurs, par exemple. Maintenant, si vous êtes prêt à stocker une liste de fruits, par exemple, je prends juste un exemple. Alors, comment le faites-vous avec les variables ? Vous aurez une variable, celle des fruits. Et vous allez lui attribuer une valeur ici, n'est-ce pas ? Si vous souhaitez stocker dix fruits, vous allez créer dix variables. Mais ce n'est pas censé être comme ça. Ce n'est pas pratique, non ? Gérer dix variables. Au lieu de cela, si vous souhaitez stocker dix valeurs ou plusieurs valeurs, plus d'une, vous pouvez créer une seule variable. Vous pouvez appeler cela un tableau. Vous pouvez l'appeler comme vous voulez, fruit, et il sera de type array. Donc, ici, je vais utiliser des crochets ici. Et entre crochets, j'aurai la liste des valeurs une par une. Donc tout d'abord, disons Apple, je peux avoir oups Je peux manger une banane ici. OK, et je peux avoir, disons, de la fraise OK, quelque chose comme ça. Donc c'est un tableau ici, d'accord ? Et je peux dire « console point log » ici. Je peux dire « fruit ». Et si je l'imprime, vous verrez des pommes, des bananes, des fraises. D'accord. Et jetons un coup d' œil au type de fruit. D'accord. Vous verrez qu'il s' agit d'un objet ici. D'accord ? Alors oui, voici comment créer et utiliser des tableaux en JavaScript 15. Typographie statique ou dynamique: Parlons maintenant du langage de programmation à typage statique et à typage dynamique. Maintenant, nous allons d'abord parler de typage statique. Alors, qu'est-ce qu'un langage de programmation à typage statique ? Ainsi, dans ce type de langage de programmation, vous devez déclarer explicitement le type de chaque variable. Et une fois que vous avez déclaré le type de la variable, le type de variable ne peut pas être modifié au cours de l'exécution du programme. Java en est un très bon exemple . Donc, si vous avez programmé en Java, vous le saurez ou même si vous n'avez pas programmé, je vais juste vous donner un exemple très simple. Imaginons que vous souhaitiez enregistrer chacun des utilisateurs. OK ? Donc, à 30 ans, c'est un code Java que j'essaie d'écrire, d'accord ? Maintenant, ici, vous ne pouvez pas simplement déclarer des variables de cette façon. Vous devez spécifier le type ici. OK ? Vous allez donc dire entier, chacun étant égal à 30. Maintenant, vous ne pouvez pas assigner de chaîne à cette variable particulière. C'est bon. Ce n'est tout simplement pas acceptable en Java. OK ? Cela vous donnera immédiatement une erreur indiquant que « Hey, H a été déclaré comme entier et qu'il attend un Ainsi, au cours de l'exécution du programme, vous ne pouvez pas modifier le type. Cela n'est pas autorisé. Même s'il s'agit d'une chaîne quelconque, d'accord, si vous ajoutez Java ici comme ça, ce n'est pas autorisé car il s'agit toujours d'une chaîne. Voici donc un exemple du comportement des langages de programmation typés statiquement Si vous essayez de faire quelque chose comme ça, ils vous donneront une erreur de compilation. D'accord ? Maintenant, lorsque vous parlez de JavaScript, JavaScript est un langage de programmation typé dynamiquement Maintenant, qu'est-ce que cela signifie ? Ainsi, en JavaScript, les variables peuvent changer de type pendant l' exécution du programme. D'accord ? Maintenant, tout d'abord, reconnaissons qu'en JavaScript, vous n'avez pas besoin de déclarer le type de la variable que vous créez. Donc disons que si j' ai une variable nommée ma variable et laissez-moi dire, d' accord, je dirais pour le moment que je ne lui ai attribué aucune sorte de valeur, d'accord ? Je vais donc dire console point log ici. Je vais dire ma variable, on peut la voir imprimée. Ce n'est pas défini, non ? Maintenant, si j'utilise le type d'opérateur, et si j'essaie d'imprimer le type de cette variable, vous verrez que le type n'est pas défini. D'accord ? Maintenant, permettez-moi d'attribuer cette variable particulière. Alors attends une minute. Je vais simplement le dupliquer, o. Maintenant, permettez-moi d'attribuer à cette variable particulière un entier. OK ? Je vais donc faire défiler la page vers le bas pour une meilleure visibilité, et disons lui en attribuer une. Maintenant, le type de cette variable est un nombre parce qu'elle contient un nombre, n'est-ce pas ? Le type est donc devenu un nombre. Maintenant, laissez-moi vous montrer une autre magie. Si je le change ici, o, et si je le modifie pour en faire une chaîne, vous verrez que le type est désormais une chaîne, ce qui signifie qu'il contient maintenant une séquence de caractères. Et la ficelle peut être n'importe quoi. Il peut s'agir d'une chaîne comme Jascript ici. OK. Et tu vas voir ça. Et si je duplique cette ligne, permettez-moi de la dupliquer également. OK. Donc, si je m'en débarrasse, d'accord. Et si je le sauvegarde, vous verrez Ja Script s'imprimer. OK. Et il imprimera également le numéro, comme une chose normale. OK ? Vous pouvez donc voir comment le type de ma variable, qui est une variable que nous avons créée, change dynamiquement au cours de l' exécution du programme, n'est-ce pas ? Et c'est une fonctionnalité du langage dactylographié dynamiquement, n'est-ce pas ? Et le JavaScript est classé comme un langage à typage dynamique Et ceci est un exemple ou une preuve de son comportement. Maintenant, laissez-moi vous donner un autre exemple au lieu d'une chaîne et d'un nombre, si j'essaie de lui attribuer un booléen, disons, Si je l'enregistre, vous verrez que c'est booléen et que c'est vrai. Maintenant, un point à noter ici est que je ne crée pas de nouvelles variables. C'est la même variable, qui a été créée une fois, et elle est réutilisée et lui attribue différents types de valeurs, n'est-ce pas ? Cela change donc à la volée au cours de l'exécution. C'est donc du Javascript. Vous devez donc vous rappeler qu'en JavaScript, les variables peuvent changer de type pendant l'exécution du programme, d'accord ? Et lorsque vous déclarez une variable en JavaScript, il n'est pas nécessaire d'en spécifier le type. Il s'agit donc d'un langage dactylographié dynamiquement. Maintenant, nous avons utilisé ce type d'opérateur. C'est avant tout un opérateur. D'accord, nous avons utilisé ce type de mot-clé, je dirais, plusieurs fois. Et l'utilisation du type de mot-clé, vous savez, comme on l'utilise pour obtenir le type d'une variable ici. C'est pour cela que nous l'utilisons, non ? Une chose que je voudrais souligner ici, s'agit d'un opérateur. Dans le script Ja, d'accord ? C'est donc un opérateur. J'ai utilisé ce terme comme si nous utiliserions le type d'opérateur et tout. Je ne veux pas que les étudiants soient confus. C'est pourquoi je mentionne explicitement qu'il s'agit d'un opérateur en JavaScript, n'est-ce pas ? Et j'espère que cet exemple montre assez clairement en quoi Ja Script est un langage de programmation à typage dynamique, et j'espère qu'il est utile 16. Expressions et opérateurs: Il est donc temps de parler de quelques autres concepts tels que les expressions, les littéraux et les opérateurs en JavaScript Maintenant, que sont les expressions ? Désormais, une expression est une unité de code valide qui produit une valeur unique. Par exemple, ici, si j'écris sur la console, si je dis trois plus trois, j'obtiens un résultat de six. Maintenant, c'est une expression, cause de cette déclaration, elle a produit une valeur unique, n'est-ce pas ? Il s'agit donc d'une expression. Qu'est-ce qu'un littéral ? Un littéral est une valeur fixe que vous écrivez directement dans le code Donc, ici, trois est un littéral. D'accord ? Donc, quand je dis que A est égal à 30, par exemple, 30 ici est un littéral, et tout cela est une expression, n'est-ce pas ? Parce que c'est une question de mission ici. D'accord ? Donc, ce qui se passe ici, c'est que la valeur sur le côté droit est assignée à la variable sur le côté gauche. D'accord ? Voilà ce qu'est un littéral Maintenant, il existe plusieurs types de littéraux. Par exemple, il y a quelque chose qui s'appelle comme je peux le dire, il y a quelque chose qui s'appelle comme si je zoomais ici. Il existe un littéral numérique, s'agit donc d'un littéral numérique Il existe un littéral basé sur une chaîne, donc je peux dire JavaScript ici C'est une ficelle ici, non ? Vous pouvez même avoir des littéraux booléens. D'accord ? Je peux donc dire que c'est vrai ici. Il s' agit d'un littéral booléen D'accord. Les littéraux peuvent donc être de plusieurs types, littéral numérique, littéral, littéral booléen, et cela dépend du type de valeur que vous ajoutez dans le code, d' accord ? Maintenant, je l'ajoute dans la console, mais en fait, vous l'utiliseriez dans le code. Donc, si vous dites que A est égal à vrai, alors vrai ici est un littéral booléen A. J'espère que cela a du sens, non ? C'est donc ce qu'est un littéral. Maintenant, nous sommes clairs sur l'expression, l'expression est tout ce qui est évalué à une valeur unique Ainsi, par exemple, si vous effectuez une sorte de calcul arithmétique ou si vous initialisez quelque chose, toute sorte de calcul ou d' initialisation qui vous donne une valeur, c' est ce qu'est une expression Maintenant, que sont les opérateurs ? Désormais, les opérateurs en JavaScript sont des symboles qui effectueraient des opérations sur les opérations. D'accord. Donc, quelques terminologies ici. En plus, il y a un opérateur ici, d'accord ? La division est un opérateur, moins un opérateur. La multiplication, qui est représentée de cette façon par un astérisque, est également un opérateur Ce sont donc tous des opérateurs que nous utilisons également dans la vie réelle pour effectuer des additions, des abstractions, des divisions et des multiplications, n'est-ce pas ? Ce sont donc également des opérateurs dans des langages de programmation tels que JavaScript. Maintenant, chaque fois que vous voulez utiliser ces opérateurs, vous devez dire trois plus trois, n' est-ce pas ? Ou vous pourriez utiliser une variable, n'est-ce pas ? Vous pouvez donc dire A plus B, où A et B ont respectivement des valeurs. D'accord. Donc, ici, ce qui se passe c'est que vous utilisez cet opérateur, donc votre avantage est l'opérateur. Mais ces deux valeurs sur lesquelles l'opération est effectuée sont appelées Opernt. OK, je répète ici. Voici donc un opérateur. C'est un symbole. Il s' agit du type d' opération que vous souhaitez effectuer. Vous voulez ajouter deux choses, n'est-ce pas ? Maintenant, les deux éléments que vous ajoutez trois ici, trois, et ici, A et B, sont des impressions car l'opération d'addition est effectuée sur ces deux valeurs J'espère que cela a du sens. C'est bon. Donc ici, si vous voyez que trois plus trois en produisent six. Trois et trois sont donc des impressions et le plus un opérateur. Hein ? C'est donc ce que cela dit. Les opérateurs en JavaScript sont des symboles qui exécutent des opérations. Quelle est l'opération en cours ? Ajout. Il effectue l'opération sur les opérnes. Quels sont les opérnes ? Trois ici dans ce cas, et A et B dans ce cas, non ? Et ce sont des symboles, dit-on. C'est donc un symbole plus une division moins une multiplication. Ce sont tous des symboles, non ? Maintenant, c'est ce que sont les opérateurs, n'est-ce pas ? Et selon le langage de programmation que vous apprenez, les opérateurs seront classifiés. Il existe donc différents types d' opérateurs en JavaScript. D'accord ? Le premier type est celui des opérateurs arithmétiques Maintenant, bien sûr, opérateur, les opérateurs sont essentiellement utilisés pour effectuer des calculs arithmétiques, n'est-ce pas ? Comme l'addition, la soustraction, la multiplication, la division, vous avez un module, vous avez un incrément, une Ce sont tous des opérateurs arithmétiques, d'accord ? Opérateurs d'assignation, d'accord ? Les opérateurs d'assignation sont donc égaux à. Si vous assignez quelque chose, vous effectuez une assignation d' addition, une assignation soustraction, une assignation multiplication ou une assignation basée sur des divisions Maintenant, après les opérateurs d'assignation, viennent les opérateurs de comparaison, n'est-ce pas ? Maintenant, que sont les opérateurs de comparaison ? Les opérateurs de comparaison, comme leur nom l'indique, sont utilisés pour comparer deux choses, n'est-ce pas ? Ou comparez les opérnes. Vous avez donc l'égalité, l'égalité stricte, inégalité, puis l'inégalité stricte, supérieure à inférieure , supérieure à égale, inférieure à égale. D'accord ? Ce sont les quelques opérateurs de comparaison qui existent, n'est-ce pas ? Opérateurs logiques. Maintenant, ils sont utilisés pour effectuer des opérations logiques, et/ou des nœuds, n'est-ce pas Vous avez des opérateurs uniaires, à savoir l'incrémentation, le type de décrémentation d'un nœud logique, etc. Et puis vous avez les opérateurs ternaires, o, qui ont ce type de syntaxe D'accord ? Donc, si vous venez d' un autre langage de programmation comme Java, vous savez ce qu'est un opérateur ternaire, et vous en avez un similaire dans Ja Script Mais si vous ne connaissez aucun autre langage de programmation, c'est tout à fait normal. Nous allons couvrir tout cela. C'est bon. Maintenant, il s'agit de la classification, c'est vrai, et c'est ce qu'était le concept d'expression, de littéral et d'opérateurs J'espère donc que vous avez pu me suivre jusqu'ici, et j'espère que cela vous a été utile. 17. Opérateurs arithmétiques: Il est donc temps de passer en revue les opérateurs arithmétiques en JavaScript Il s'agit donc d'une liste d' opérateurs classés en tant qu'opérateurs arithmétiques Bien sûr, vous devez connaître bon nombre d' entre eux : gradation, soustraction, multiplication, division Comme si nous l'avions également utilisé dans notre vie réelle. Je vais donc coller un exemple ici , d'accord, qui nous donnera une idée de la façon dont l'addition, soustraction, la multiplication et la division peuvent donner le résultat Donc, si je garde ça, tu verras ici. OK, permettez-moi de faire un petit zoom arrière. D'accord, vous pouvez donc voir le résultat correctement. Vous pouvez donc voir que le résultat de l'addition est la soustraction sept, la multiplication 24 et la division cinq. OK ? Maintenant, si je change cela comme suit, bien sûr, c'est clair, résultat de l'addition, cinq plus trois. OK, dix moins trois, ça donne sept. OK ? Si je change ce paramètre à 13, vous verrez le résultat devenir négatif. C' est donc également possible. OK ? Si vous faites défiler la page vers le bas, résultat de la multiplication est simple, d' accord, ce sera un nombre positif à moins que vous n'essayiez de multiplier par zéro, le résultat serait zéro. OK ? Si vous faites défiler le résultat de la division vers le bas, vous obtenez un chiffre ici, d'accord ? B 20 est divisible par quatre. Maintenant, si je change cela à sept, disons que le résultat de la division ici est en décimales. C'est bon. Donc, s'il ne s'agit pas d'un nombre entier, vous obtiendrez un résultat décimal la suite de la division. C'est bon. Maintenant, il s'agit de multiplication, de soustraction, d'addition. Ce sont les opérations arithmétiques standard que nous effectuons également dans notre vie de tous les jours. Qu'est-ce que le module ? Donc, si vous utilisez un langage de programmation comme Java, vous devez connaître le modulus Mais juste au cas où vous ne sauriez pas ce qu'est le module, je vais juste vous faire une démonstration, d'accord, donc je vais avoir le module ici . OK. Et l'opérateur de module est représenté à l'aide d'un symbole de pourcentage ici OK. Et ici, je vais écrire le module OK, quelque chose comme ça. Voyons maintenant quel est le module, d'accord ? Donc Modulus est ici et je vais imprimer la sortie sous forme de résultat du module Maintenant, au lieu de la division, je vais changer cela en pourcentage. D'accord, parce que nous utilisons l' opérateur de module ici arrive aussi que certaines personnes Il arrive aussi que certaines personnes le prononcent comme modulus modulo, o Il existe différentes manières de le dire Vous pouvez donc voir que le résultat du module est nul en ce moment. OK ? Donc, le module vous donnera le reste après avoir effectué la division C'est la division qui le fait, elle divise et vous donne le résultat. Mais le module effectuera la division et vous donnera le reste. C' est ce qu'il demande. Disons donc que si vous dites que 20 est clairement divisible par quatre, le résultat sera nul Il est également divisible par cinq, donc la sortie sera nulle, vous pouvez le voir Mais avec six, vous obtiendrez un résultat de deux, d'accord ? Parce que 18 est divisible par six, non ? Six trois font 18, puis deux c'est le reste. Par conséquent, vous aurez le reste , deux ici. OK ? Si vous essayez de le diviser par sept, vous devriez obtenir six en sortie. Vous pouvez voir six parce que 14 est divisible par 772 14, n'est-ce pas ? Et puis six c'est le reste, non ? Donc, six est ce que vous obtenez en sortie. Donc, en gros, ce que fait Modulus, c'est qu'il vous donne le reste après avoir effectué la division. C'est bon. Maintenant, vous me demanderiez pourquoi vous voudriez un tel opérateur. exemple, pourquoi vous voulez un reste après avoir effectué le di Okay, il existe plusieurs cas d'utilisation scénarios ou exigences dans lesquels vous souhaitez effectuer ou obtenir le reste du résultat. Un exemple que je peux vous donner ici est l'identification du nombre pair et impair. OK ? Supposons donc que vous écriviez du code ou un programme dans lequel vous souhaitez identifier si le nombre donné est pair ou impair. Ce que vous feriez normalement, c'est utiliser cet opérateur de reste ici , modulus, d'accord ? Donc sept modulo et tu le feras avec deux. OK. Vous obtiendrez donc la sortie en une seule fois. Il s' agit donc d'un nombre impair. OK ? Six modulo deux, vous obtiendrez zéro pour le reste OK. Donc, cela signifie que six est un nombre pair. OK ? Ainsi, vous pouvez utiliser modulo et obtenir le résultat Il s'agit donc de modulo. Vous avez aussi quelque chose appelé incrément, d'accord ? Je vais donc m'en débarrasser. OK ? C'est incorrect maintenant. OK. Maintenant, je vais vous montrer ce que l' on appelle incrément. Maintenant, l'opérateur d'incrémentation est utilisé ou représenté comme ceci, plus plus OK ? Alors laissez-moi faire défiler la page vers le bas. Et disons que si vous avez une valeur, disons que j'ai une variable X égale à cinq, d'accord ? Et je peux dire journal des points sur la console ici, je peux imprimer la sortie de X, ou la valeur de X. Vous verrez cinq comme sortie. OK ? Maintenant, permettez-moi également de le faire venir ici. OK ? Je vais comprendre cela et je peux le dire sous forme de résultat incrémenté. OK ? Maintenant, cela n'est pas encore incrémenté. Vous en attribuez cinq et vous obtenez cinq en sortie OK ? Mais ce que vous pouvez faire, c'est augmenter la valeur de disons si vous voulez augmenter la valeur de X d'un. Il existe donc deux approches : vous pouvez soit dire que X est égal à X plus un. OK ? C'est faisable. Si vous l'enregistrez, vous obtiendrez un résultat de six, d'accord ? Mais il existe une autre méthode qui vous permet d'utiliser simplement cet opérateur d' incrément et d' obtenir le même résultat de manière abrégée Il s'agit donc d'une version abrégée de cette déclaration ici. Vous dites que X est égal à X plus un, mais en fait, vous augmentez simplement la valeur de X. Alors pourquoi ne pas le faire de cette façon ? C'est bon. Et vous pouvez l'incrémenter autant de fois que vous le souhaitez. Je peux donc l'incrémenter encore une fois, et vous verrez le résultat comme sept. C'est bon. Voici donc ce qu'est l'opérateur d'incrémentation. Il s'agit d'une version abrégée de l' incrémentation de la valeur accord ? C'est une question d'incrémentation, alors vous avez ce qu' on appelle la décrémentation Maintenant, la décrémentation fonctionne également de la même manière, d'accord ? Alors voilà, si je me permets de simplement copier ceci. OK. Donc, au lieu de X, je vais prendre un exemple de Y ici. OK ? Et laissez-moi vous en donner la version longue. OK ? Donc, ce que je ferais, c'est m'en débarrasser et je dirais que Y est égal à Y moins un. OK ? Donc ce n'est pas une version abrégée, d' Et ici, je dirais un résultat décrémenté. OK, et j'imprime la valeur sous forme de Y. D'accord. Maintenant, si je sauvegarde ceci, vous verrez que le résultat décrémenté est quatre, n'est-ce Maintenant, je peux utiliser l'opérateur de décrémentation ici. OK, et je peux dire ici, y moins moins. Cela me donnera le même résultat. Je peux le faire deux fois ou autant de fois que je veux, d'accord. Donc, essentiellement, c'est similaire à l'opérateur d'incrémentation, d'accord, mais il est utilisé pour décrémenter la valeur. C'est bon. Maintenant, l'opérateur d'incrémentation est utilisé pour incrémenter la valeur de manière abrégée, comme nous l'avons vu, et l'opérateur de décrémentation est utilisé pour décrémenter la valeur de manière abrégée, comme la valeur de manière abrégée, comme nous l'avons vu, et l'opérateur de décrémentation est utilisé pour décrémenter la valeur de manière abrégée, comme nous le voyons ici. C'est bon. Ce sont donc les opérateurs arithmétiques qui existent en JavaScript. C'est bon. J'espère que c'est clair, et que tout cela est important, vous comprenez. Les autres opérateurs sont donc simples, mais je dirais qu'il est important que vous compreniez comment cela fonctionne. Et je vous recommande également d'essayer quelques exemples dans la console du navigateur. Vous pouvez saisir directement. Vous n'avez pas besoin de code Visual Studio pour cela. Vous pouvez donc taper directement ici et voir comment cet opérateur se comporte avec différents ensembles de valeurs OK ? J'espère donc que cela vous sera utile et que vous avez pu suivre. 18. Opérateurs de mission: Ce sont les opérateurs d'assignation que nous avons dans Ja Script, et commençons à parler de chacun d'entre eux. Ce premier est donc quelque chose que nous avons vu plusieurs fois jusqu'à présent. Il est utilisé pour attribuer la valeur du côté droit à la variable du côté gauche. J'ai maintenant ajouté un exemple très simple illustrant en quoi consiste cette mission D'accord, cela devrait être très facile et pas du tout difficile à comprendre pour vous. D'accord ? J'assigne donc simplement une valeur de cinq à cette variable A, et nous imprimons simplement cette valeur accord ? Ensuite, nous avons une mission supplémentaire. D'accord ? Cela permet donc d' effectuer également l' ajout en même temps que l'assignation. Permettez-moi donc de vous en donner un exemple. Je vais donc ajouter du code ici. Vous pouvez voir l' assignation supplémentaire ici dans la pratique. J'ai créé une nouvelle variable, appelée B. Et ce que je fais ici, c'est que je veux en ajouter trois à B. Donc, une façon est de faire quelque chose comme ça. D'accord ? Alors laissez-moi d'abord vous montrer ceci. D'accord. Et je vais faire un commentaire à ce sujet. Maintenant, si je sauvegarde ceci, vous verrez le résultat sous la forme 13. Il a été initialisé à dix, mais la sortie est maintenant 13. C'est bon. Maintenant, si je commente ceci, et si je le décommente, cela revient à écrire ceci. Le résultat serait le même. Donc, cela équivaut à B égal à B plus trois. Hein ? Il ajoute donc d'abord trois à B, puis il affecte la valeur totale ou le résultat à la variable B. D'accord ? Ensuite, nous l' imprimons pour voir le résultat. C'est ainsi que l'addition et l' assignation fonctionnent ensemble. Il s'agit essentiellement d'un raccourci ou d' un moyen pratique, devrais-je dire, effectuer une addition ou d'ajouter un nombre dans une variable particulière Maintenant, comme nous avons une assignation d' addition, nous avons également une assignation de soustraction Cela fait essentiellement le même travail que celui d' Addition Assignment. Disons si nous avons cette variable 15 et si vous voulez en soustraire cinq Vous pouvez avoir une attestation comme celle-ci, d'accord. Je vais enregistrer ceci et vous en verrez dix ici, d'accord, ou vous pouvez le commenter, et vous verrez le même résultat ici en utilisant cette assignation de soustraction abrégée Il effectue donc essentiellement la soustraction d'abord de la variable, puis il attribue la valeur à la variable, et nous l' imprimons ensuite, n'est-ce pas ? C'est donc ce qu'est l'assignation par soustraction. Vient ensuite l' assignation à la multiplication. D'accord. comme une version abrégée de la multiplication d' une valeur en elle-même C'est aussi une version similaire, comme une version abrégée de la multiplication d'une valeur en elle-même, d'accord ? Ou pas lui-même. Essentiellement, vous multipliez une valeur une variable, puis vous attribuez cette valeur à la même D'accord ? Cela équivaut à, comme vous pouvez le voir ici dans les commentaires que j'ai écrits, D est égal à D sur deux, donc je vais d'abord le démontrer. D'accord. Vous verrez que la réponse est 12. D'accord ? Mais si je le commente et si je le décommente, vous verrez à nouveau la sortie sous la forme 12 elle-même. Cela fait donc qu'il s'étend jusqu'à ce que D soit égal à D en deux. D'accord. Et ce n'est qu'une autre version abrégée de l'exécution de la même chose, mais de manière courte et concise Vous avez ce qu'on appelle une affectation de division, si vous voyez par ici. D'accord ? Il s'agit d'une méthode similaire qui vous permet de diviser une valeur ou de diviser une variable ou une valeur d'une variable par quelque chose, puis d'attribuer le résultat à la variable elle-même. D'accord ? Donc, si je sauvegarde ceci, vous verrez le résultat comme cinq, d'accord ? Ce sont donc tous les opérateurs d'assignation qui existent en JavaScript. 19. Opérateurs de comparaison: Il est donc temps de parler des opérateurs de comparaison en JavaScript et de voir ce que signifie chaque opérateur. Nous allons donc parcourir la liste et voir quelques exemples. Nous allons donc d'abord parler de l'opérateur d'égalité. Maintenant, qu'est-ce qu'un opérateur d'égalité ? Bien entendu, l' opérateur d'égalité compare deux opérnes et renvoie une sortie Pollan Maintenant, une chose que je souhaite souligner ici, tous les opérateurs de comparaison vous donneront un résultat booléen , car ils sont utilisés pour effectuer des comparaisons, n'est-ce pas ? C'est ce que dit la catégorie, les opérateurs de comparaison. Donc, que la comparaison soit vraie ou fausse. C'est ce que sera le résultat. Maintenant, à titre d'exemple, je peux dire «  console point log » ici, d'accord ? Et je peux dire que cinq est égal à cinq ici. Vous pouvez voir que la valeur est vraie. Maintenant, si je le fais avec six, bien sûr, cela va me donner une fausse impression. Maintenant, cela peut même fonctionner avec des variables. Disons donc si nous avons A et si nous avons B ici, et que P en a six. D'accord ? Et si je duplique cette ligne, cela peut également fonctionner avec les variables ici. Je peux donc dire P ici, et cela peut être A. Vous verrez donc que le résultat est faux. D'accord ? Mais si je change cela en Pi, bien sûr, le résultat sera vrai. D'accord ? Voici comment fonctionne un opérateur de comparaison. Maintenant, que se passe-t-il si vous avez une chaîne en comparaison ? Disons que si je fais le journal des points de la console, cinq est égal à six. Si je le convertit en chaîne, disons que ce n'est pas un entier, mais en fait c' est une chaîne, n'est-ce pas ? Maintenant, laissez-moi également vous montrer que c'est aussi une chaîne. Donc, connectez-vous à la console ici. Je vais utiliser le type d'elle. Vous pouvez voir que c'est une chaîne, n'est-ce pas ? Donc, si je fais une comparaison de cette façon, vous verrez que j'ai des chutes ici. OK. Maintenant, que se passe-t-il si je le convertit essentiellement en cinq comme ceci ? Cela va me donner la vérité. D'accord ? Je vais juste déplacer ça jusqu'à la fin. C'est donc plus facile à voir sur la console. Le résultat est donc vrai ici. Maintenant, pourquoi est-ce vrai ? Parce qu'ici, vous utilisez le chiffre Oups. Ici, vous utilisez un nombre, et ici c'est une chaîne. Pourquoi est-ce vrai ? Parce que ce qui se passe est interne, il y a une conversion d'une chaîne en un nombre, et c'est ainsi que cela est géré. D'accord ? Ce serait donc le résultat, non ? J'espère que cela a du sens. C'est donc une question d'égalité, d'accord. Vous avez maintenant ce qu'on appelle une égalité stricte. Maintenant, c'est différent des autres langages de programmation comme Java. Si vous venez après avoir appris Java, il y a quelque chose de nouveau pour vous. D'accord ? Donc, nous avons dit que si Phi est égal à une version chaîne de cinq, cela signifie que l'impression est vraie, n'est-ce pas ? Maintenant, que se passe-t-il si j'utilise un opérateur d' égalité strict, ce qui signifie égal à trois fois ? D'accord ? Maintenant, si je sauvegarde ceci, vous allez obtenir une fausse sortie SE. OK. Donc, ce qui se passe, c' est que l'égalité stricte fonctionne, c'est qu'elle vérifiera également qu'elle comparera la valeur et qu'elle vérifiera également le type, ce qui signifie qu'aucune conversion de type n'est effectuée. Et si les valeurs sont de types différents, la comparaison renverra immédiatement la valeur false. D'accord ? Parce que même si les valeurs sont identiques, le type est différent. Cela va donc échouer. D'accord ? Maintenant, si c'est six, pour une raison ou une autre, cela vous donnera également un faux. Pour que cela soit vrai, si c' est le cas, pour que cela soit vrai, cela doit être du même type, et c'est à ce moment-là que vous devenez vrai ici. C'est bon. Maintenant, gardez ceci à l'esprit, accord, cette égalité, cette égalité stricte comme ici, la conversion implicite ici ou la conversion automatique ici d'une chaîne en un nombre. OK, gardez ces points à l'esprit, car lorsque vous écrivez de vrais programmes Jascript, du code de script Ja, vous utiliserez beaucoup ces opérateurs de comparaison dans les conditions, et c'est là que cela importe, n'est-ce pas  ? code de script Ja, vous utiliserez beaucoup ces opérateurs de comparaison dans les conditions, et c'est là que cela importe, n'est-ce pas Il s'agit donc d'une stricte égalité. N'oubliez pas que l'égalité stricte est stricte. D'accord ? Le nom indique que c'est strict et il vérifie le type ainsi que la valeur. Donc, si le type est le même ici parce que les deux sont des chaînes, si je change la valeur, je vois que c'est faux maintenant. D'accord ? J'espère donc que cela a du sens. OK, qu'est-ce que l'égalité stricte ? Et l'égalité n'est pas stricte, d'accord ? Parce que son nom n'est pas strict. Donc, il va réellement en voir la valeur. Et si les valeurs sont de type différent, elles seront converties. Je vais faire une conversion, puis le résultat s'affichera, n'est-ce pas ? Voilà donc la différence entre deux. Ensuite, il y a l'inégalité. Aujourd'hui, l'inégalité est assez simple. OK. Je vais donc vous donner un exemple. D'accord ? Je ne créerai pas de variables, mais je vais tout de suite vous donner un exemple ici. Cinq est donc égal à trois ? Quel en serait le résultat, selon vous ? Cinq est égal à trois. La sortie serait fausse, bien sûr, vous voyez des chutes ici. Cinq n'est pas égal à trois. Pas égal à trois, pas trois. Je suis désolée Donc, si vous convertissez cela en inégalité ici, o et si vous l'enregistrez, vous obtiendrez deux en sortie car c'est juste l' inverse de l'égalité. D'accord ? Nous vérifions donc ici si les deux valeurs ne sont pas égales. S'ils sont égaux les uns aux autres, cela va entraîner des chutes ici. C'est vrai. J'espère que cela a du sens maintenant, d'accord ? Il s'agit donc d'une inégalité. Il y a alors ce que l' on appelle l'inégalité stricte. Maintenant, qu'est-ce que l'inégalité stricte ? Bien entendu, nous avons vu une version stricte de l'égalité. Il s'agit d'une aversion stricte pour l'inégalité. C'est simple. OK. Donc voilà, si vous voyez, d'accord, laissez-moi dupliquer cette ligne, d'accord ? Donc, si je duplique cette ligne, maintenant, cela va nous donner une fausse, bien sûr. OK. Mais s'il s'agit d'une chaîne , alors aussi, cela va nous donner un faux. D'accord ? Parce que les deux ne sont pas égaux. D'accord ? Maintenant, que se passera-t-il si je à l' inégalité stricte, d'accord ? Si je fais quelque chose comme ça, vous verrez que cela redeviendra vrai. C'est bon. Maintenant, bien sûr, alors que nous agissions de la manière normale en matière d'inégalité, sans utiliser le strict. OK. Donc, ici, ce qui se passait, c'est que seule la valeur était comparée et non le type. Mais ici, le type est également comparé. La valeur est donc la même, mais le type n'est pas égal, c'est pourquoi elle renvoie vrai. C'est ainsi que cela fonctionne. J'espère que cela a du sens, non ? Et si je le duplique ici, vous allez voir si je remplace par cinq, bien sûr. OK, tu verras la vérité à nouveau, d'accord ? Mais si c'est cinq maintenant, d'accord, si je le remplace par cinq, quelque chose comme ça, vous verrez des chutes ici. OK. C'est donc une inégalité stricte, d'accord ? C'est la version stricte, et c'est une version souple. Donc, normalement, sur Internet, vous verrez différents termes utilisés pour désigner « perte d'égalité », « perte inégalité », « égalité stricte », inégalité stricte ». D'accord ? Alors vous avez plus que moins. D'accord ? Donc, plus qu'une leçon , c'est assez simple. Laissez-moi copier ces houblons. Permettez-moi de les copier tous les deux. OK. Je vais venir ici et j'ajouterai un Je vais le convertir en commentaires, d'accord ? Maintenant, jetons un coup d' œil à ça, d'accord ? Il s'agit donc d'un journal de points de console assez simple. OK. J'ai cinq de plus que trois. Est-ce que c'est le cas ? Donc, après comparaison, cet opérateur supérieur renverra un résultat booléen Donc cinq est supérieur à trois, oui. Cela reviendrait donc à vrai dire, non ? Vous pouvez voir la vérité ici. OK. Maintenant, si j' ajoute un plus grand nombre sur le côté droit. D'accord ? Disons donc que nous en avons sept. Et si je le sauvegarde, il retournera des plis car cinq n'est plus supérieur à sept. C'est supérieur à. Bien sûr, moins que c'est exactement l' inverse, d'accord ? Et je vais juste en ajouter un peu plus ici. OK, vous pouvez voir que la situation est maintenant inversée. La première condition est donc fausse, puis elle est vraie parce que sept est supérieur à cinq. Est-ce que trois est supérieur à cinq ? Non Désolé, j'ai trois de plus que cinq ? Oui, donc ce n'est pas le cas, non ? C'est donc moins qu'en fait. C'est pourquoi il donne une fausse sortie SE. C'est bon. J'espère donc que cela a du sens. Maintenant, ici, c'est une version de supérieur et inférieur à, d'accord ? Il s'agit donc en fait d'un symbole égal à un. Je vais également comparer pour l'égalité. Si vous prenez cet exemple ici, si vous en avez cinq des deux côtés. D'accord ? Quel est le résultat auquel vous pouvez vous attendre ? Vous pouvez voir ici que vous obtenez résultat faux ici. D'accord ? Faux car les deux sont en fait égaux. Cette condition ne correspond donc pas. Mais si vous mettez à jour ce paramètre égal à ici, ou inférieur ou égal à. Cela va redevenir vrai. Tu peux voir. OK. Vous pouvez même vous en servir ici, vous pouvez voir que cela se vérifie. OK. J'espère donc que cela a du sens quant à la façon dont cela fonctionne, et j'espère que vous comprenez bien les opérateurs de comparaison. Gardez donc à l'esprit que les opérateurs de comparaison renverront une valeur booléenne après avoir effectué la comparaison des opérants Maintenant, il existe plusieurs opérateurs de comparaison tels que l'égalité, l'inégalité. Nous en avons une version plus stricte, qui prend également en compte le type car la version normale ne prend pas en compte le type, n'est-ce Vous avez alors plus que moins que supérieur à égal ou inférieur à égal à. D'accord ? J'espère donc que cela avait du sens, et j'espère que cela a été utile. 20. Opérateurs logiques: Il est donc temps de commencer à parler des opérateurs logiques. Maintenant, il existe trois opérateurs logiques, et c'est ce que nous allons explorer. Alors, que sont les opérateurs logiques, tout d'abord ? Les opérateurs logiques sont donc utilisés pour travailler avec les valeurs de Pollan, qui sont vraies et fausses, et ils vous permettent de combiner ou d'invoquer ces valeurs, Il y en a donc trois. Vous pouvez voir ce qui est logique et qui est représenté à l'aide de ce symbole particulier. Vous avez une logique ou, ce qui est représenté de cette façon, rien de logique, représenté par une exclamation C'est bon. Parlons donc de logique et d'opérateur. Maintenant, qu'est-ce que la logique et l'opérateur ? Neuf commentaires, j'ai ajouté quelques points sur la logique La logique et l'opérateur vérifient donc si les deux conditions sont vraies. OK ? Tout d'abord, cela fonctionne à deux conditions, c'est ce que vous devez noter ici. Les deux conditions, ce qui signifie que cela fonctionne sous deux conditions, et si les deux sont vraies, alors le résultat est vrai. OK ? Vous pouvez donc voir qu'il renvoie vrai que si les deux sont vrais. Dans le cas contraire, il renverra la valeur false. OK ? Maintenant, si je dois le démontrer sous forme d'exemple, je dirais console point log ici. OK ? Vrai. Et vous pouvez utiliser la logique et ici et vous pouvez simplement coder en dur les valeurs booléennes OK. Je peux voir que le résultat est vrai. OK ? Maintenant, si je duplique cette ligne et si l'une d'entre elles est fausse ici, dans ce cas, vous verrez la valeur false en sortie. Donc, pour que cela soit vrai, les deux doivent être vrais. OK ? Maintenant, l'une ou l'autre d'entre elles est fausse, le résultat sera , genre, faux. OK ? Donc, si je dis faux ici, vous verrez que cela devient faux parce que les deux sont faux, n'est-ce pas ? Maintenant, si le premier est faux, même si vous obtiendrez une fausse sortie SA. Nous ne devenons donc vrais que dans un cas où les deux sont vrais. OK ? Maintenant, c'est très utile si vous voulez évaluer deux conditions, d'accord ? Maintenant, ces deux valeurs ou ces deux opérants sur lesquels nous opérons peuvent être n'importe quelle sorte d'expression qui donne une valeur booléenne OK ? Maintenant, permettez-moi de vous donner un exemple. Imaginons que vous créez un programme, et qu'il s'agisse d'un site Web destiné à gérer un concert. OK ? Imaginez donc que pour vous connecter au concert, vous deviez avoir à la fois vos billets et votre identifiant. OK ? Donc, ce que je vais faire, c'est ici, je vais avoir un exemple écrit ici. OK. Exemple. OK. Supposons maintenant que nous ayons des tickets comme l'une des variables booléennes OK. Supposons que sa valeur initiale soit vraie. OK. Et disons que j'ai une autre variable qui a un identifiant. Donc, que l'utilisateur ait un identifiant ou non, et qu'il ait des tickets ou non, c'est ce que cela nous aide à suivre, n'est-ce pas ? Maintenant, je vais dire console point log ici. OK. Je veux avoir un mandat selon lequel l'utilisateur doit avoir les deux. Donc, s'il existe un mandat, les deux conditions doivent être vraies ou si les deux conditions doivent exister pour que l'expression soit valorisée comme vraie, c'est à ce moment-là que vous utilisez et opérez ici. Donc je vais dire qu'il a des billets et une pièce d'identité. Et je vais enregistrer ça. Maintenant, vous allez voir true en sortie C ici parce que les deux sont vrais. Maintenant, si l'une d'entre elles est fausse, alors permettez-moi de mettre à jour son identifiant avec celui de falls over here. OK ? Je dirais qu'il n'a pas d'identifiant, disons, et j' imprimerai à nouveau le résultat. Vous verrez donc des chutes par ici. OK ? Voici donc comment cela fonctionne. Maintenant, nous utilisons des variables, d'accord ? Maintenant, cela peut être n'importe quelle sorte d'expression ici. OK ? Il peut s'agir de n'importe quel type d' expression qui correspond, bien entendu, à une valeur de A Pollan. OK ? Si je dois vous donner un exemple, d'accord, disons qu'au lieu d' avoir des billets, disons que j'en ai cinq, plus de trois. OK. Est-ce que cinq est supérieur à trois ? Oui OK. Et disons que si j'ai un autre exemple ici ou une autre expression ici, cinq est supérieur à six. Est-ce que cinq est supérieur à six ? Absolument pas. OK ? Cela va donc donner une valeur fausse en sortie car cette deuxième expression renvoie une valeur fausse. Et si je sauvegarde ceci, vous verrez une sortie false. OK ? Cette méthode est donc logique et peut être utilisée dans des expressions et des prises de décision complexes. C'est bon. Maintenant, lorsque vous commencerez à écrire des programmes complexes, vous utiliserez bien sûr beaucoup ces opérateurs logiques. OK ? Il est donc préférable de comprendre le concept. Logique et nous avons terminé, ce qui est logique et pour résumer la logique nous vérifierons si les deux conditions sont vraies, cela fonctionne sur deux valeurs booléennes au fur et à mesure, et ces valeurs booléennes peuvent également être dérivées des expressions OK ? Maintenant, il s' agit d'une question de logique. Parlons maintenant de logique. Maintenant, qu'est-ce qui est logique ou pas ? Je vais ajouter quelques commentaires ici en tant que définition de la logique ou donc de l' opérateur ou de l'opérateur logique, accord, le logique ou l'opérateur dit qu'il vérifiera si au moins une condition est vraie, d'accord ? Donc, l'opéran sur lequel il travaille doit au moins être vrai pour qu'il redevienne vrai Donc, j'ai été très strict, d'accord, et j'ai dit que les deux devraient être vrais. Mais je suis un peu indulgent. Il dit qu'au moins une condition doit être vraie, et je suis d'accord avec ça, d'accord ? Il renvoie donc vrai si au moins l'une des conditions est vraie. Si les deux sont faux, la valeur renvoyée est fausse. C'est bon. Maintenant, pour le démontrer, je vais copier cet exemple ici, cette saisie que j'ai faite. OK, et nous remplacerons tout par ou par ici. Maintenant, il s'agit essentiellement de deux symboles en forme de pipe. Vous pouvez voir ces symboles en forme de pipe. Je vais ajouter ceci Oups OK, et c'est fait. Maintenant, cette première chose sera vraie. Cela sera également vrai pour le cadeau. Cela sera également vrai pour le cadeau. Maintenant, ces trois affirmations vont nous donner la vérité parce qu' au moins un des points est vrai ici dans ce Et cela va nous donner du faux parce que les deux sont faux. OK ? Donc, si je sauvegarde ceci, vous verrez, vrai, vrai, vrai, puis cela nous donne du faux. Maintenant, comment cela peut-il être utilisé ? Imaginez donc que vous êtes en train de créer un programme qui vous aide à décider si vous devez jouer à l'extérieur ou non. OK ? Et disons que vous irez jouer dehors s'il fait beau ou si vous avez un imperméable. Un exemple très simple. OK ? Maintenant, nous utilisons ou opérons ici parce que cette déclaration indique que je peux jouer dehors s'il fait beau ou si j' ai un imperméable, n'est-ce pas ? Cela ne veut pas dire si le temps est ensoleillé et si j'ai un imperméable S'il est indiqué et, alors seulement, nous utiliserons un opérateur. Mais pour le moment, c'est l'un ou l'autre. Donc, bien entendu, le choix est l'opérateur logique. Donc je dois dire qu'il fait beau à Let ici. OK. Est-ce qu'il fait beau dehors ? Je vais dire faux, et désolé, il n'y a pas d'imperméable OK. Alors je vais dire « vrai » ici, quelque chose comme ça. OK. Et je vais faire un journal des points sur la console ici. OK. Et je dirais qu'il fait beau et qu'il fait aussi beau qu'un imperméable OK, c'est assez simple. Quel en serait le résultat ? Le résultat doit être vrai. Je peux aller jouer parce que la condition était soit qu'il fasse beau, soit que j'aie besoin d' un imperméable Le résultat est donc vrai. OK, je peux voir si je change la valeur de has raincoat, disons, par celle de false Maintenant, je n'en ai plus. Il n'y a pas d'imperméable et il ne fait même pas beau Dans ce cas, la valeur renvoyée sera fausse. OK ? Donc, en cas de prise de décision, cela va être beaucoup utilisé, non ? J'espère que c'est amusant. Le troisième opérateur logique que nous avons et dont nous devrions parler est le néant logique Maintenant, l'opérateur logique zéro inverse essentiellement la valeur d'un booléen par un booléen Donc, si c'est vrai, cela le changera en faux, et si c'est faux, cela le changera en vrai, comme le dit la déclaration. OK ? Laissez-nous le tester. Donc, si je dis console point log, ici. OK. Maintenant, si je dis vrai ici, cela va s'imprimer en vrai, comme vous pouvez le voir, n'est-ce pas ? Il sera imprimé en vrai. Mais disons que je veux imprimer je veux inverser cela en utilisant un opérateur logique, donc ça va dire faux ici, d'accord ? Une autre question est de savoir pourquoi voudriez-vous utiliser cet opérateur no ? Quels sont les cas d'utilisation ? Je vais vous donner un exemple, non ? Il existe de nombreux scénarios dans lesquels cet opérateur peut être utilisé. Supposons donc que vous vouliez rester à l'intérieur s'il ne pleut pas, ou que vous vouliez sortir s'il pleut Disons qu'il y a une décision que vous voulez prendre, d'accord ? Et je vais laisser pleuvoir parce que tout dépend de la pluie, non ? C'est ma décision. Je vais donc créer une variable. Je vais l'attribuer à une valeur booléenne. OK ? Et je dirais qu'il faut rester à l'intérieur. OK, quelque chose comme ça. Maintenant, cela ne vaudrait pas la peine de pleuvoir. Quelque chose comme ça. OK. Et je peux avoir un journal des points sur la console, et je devrais rester à l'intérieur. OK ? Alors, est-ce qu'il pleut ? Non, ce n'est pas parce que cette valeur est fausse. Alors, dois-je rester à l'intérieur ? Oui, tu devrais. Tu peux voir. Maintenant, s'il pleut ici. Devrais-tu rester à l'intérieur ? Tu peux voir. C'est donc ainsi que booléen n'est pas un nœud logique, devrais-je L'opérateur de nœud logique fonctionne, c'est vrai, et il fonctionne d'une manière qui vous aide à inverser une condition particulière Ceci est également beaucoup utilisé dans la prise de décision, et lorsque vous commencerez à écrire du code Ja Script, vous en verrez plusieurs cas d' utilisation. D'accord ? Maintenant, il s' agit de l'opérateur du nœud Je tiens également à souligner un autre concept ici. Maintenant, le concept concerne les expressions booléennes. Que sont donc les expressions booléennes ? Une expression booléenne est une expression dont l'évaluation correspond à une valeur booléenne OK ? Donc, si vous faites défiler la page vers le haut. OK, c'est une expression booléenne. OK. Vous l'avez sous forme d'expression booléenne, d'expression booléenne Tout cela est une expression booléenne car elle est à une seule valeur booléenne Ce sont donc toutes des expressions booléennes construites à l'aide d'opérateurs logiques et/ou non C'est bon. J'espère donc que vous avez pu me suivre, et j'espère que cela vous a été utile. 21. Opérateurs ternaires: Il est donc temps de commencer à parler d'opérateur ternaire Maintenant, qu'est-ce qu'un opérateur ternaire ? Vous pouvez donc voir ici l'opérateur conditionnel. C'est donc une façon très abrégée de prendre des décisions rapides ou choisir entre deux valeurs, Et ici, vous pouvez voir que c'est sa syntaxe. Alors laissez-moi vous le démontrer à l'aide d'un exemple, d'accord ? Disons que j'ai une variable. Disons, appelons-le X, d'accord. X a donc une valeur de dix. OK ? Et disons que j'ai une expression Pullen. OK ? Je peux donc parler de pollen ici et ne pas créer une expression de Pollan J'aurai tout de suite un message ici. OK ? Donc disons que si X est supérieur à cinq, je veux imprimer, X est supérieur à cinq, donc, je veux imprimer X n'est pas supérieur à cinq, n'est-ce pas ? Donc ce que je ferais, c'est que j'aurais un problème ici, d'accord ? Nous suivrons la même syntaxe. OK ? Je vais le copier. OK, quel est le problème ? La condition est X supérieure à cinq. C'est ce que nous sommes en train de vérifier, n'est-ce pas ? Donc, si X est supérieur à cinq, cette partie indique que si cette condition est vraie, elle sera évaluée ou utilisée. Si cette condition est fausse, sera traitée. Ou cela sera utilisé. OK ? Peu importe ce qu'il y a là-bas. OK ? La condition est donc quelque chose que nous avons ajouté ici. La condition est ajoutée. Qu'est-ce que Value One ? Si X est supérieur à cinq, je voulais imprimer un message. X est supérieur à cinq, d'accord pour le moment. Et si c'est faux, je dirais que X est inférieur à cinq, quelque chose comme ça. Oups. Donc oui. OK. Et ce que je vais faire, c'est dire journal des points de la console et j' imprimerai le message ici. OK. À votre avis, quel en serait le résultat ? X est dix, donc X doit être supérieur à cinq. Si je sauvegarde ceci, vous verrez que X est supérieur à cinq. OK ? Maintenant, si la valeur de X est réduite à quatre, vous verrez que X est inférieur à cinq. OK ? Nous prenons donc des décisions ici, d'accord ? Nous sommes Altstspace ici. Nous prenons des décisions ici avec l'aide de l'opérateur ternaire. OK. Maintenant, dans toute cette expression, je n'ai pas besoin que cela soit enfermé dans une paire d'accolades rondes Vous pouvez donc voir ici que c'est également très bien. Mais c'est normalement une bonne pratique d'avoir à condition que vous écriviez entre parenthèses ou, devrais-je dire, entre crochets ici OK ? Si vous l'enregistrez, vous verrez qu'il s'agit de la sortie et que la sortie n'est pas affectée. C'est bon. Ici, au lieu d'une expression booléenne, vous pouvez même avoir une valeur booléenne OK. Je peux donc simplement taper vrai ici et vous pouvez voir que X est supérieur à cinq. Et si je dis faux ici, vous voyez que X est inférieur à cinq. OK ? Je vais juste faire le set Control et nous retrouverons l'expression pollinique que nous avions. OK ? C'est donc ce qu'est un opérateur ternaire Donc, si la condition est vraie, la valeur vraie est renvoyée. C'est une vraie valeur. Et si la condition est fausse, est renvoyée. OK ? Et tout cela se situe entre un point d'interrogation et deux points. Vous pouvez voir la syntaxe ici. OK. Donc oui, c'est ce qu'est un opérateur ternaire Maintenant, permettez-moi de vous donner un exemple. OK. Écrivons un programme simple qui vérifiera si la valeur est booléenne ou non ou, désolé, pas une La valeur O est paire ou non, ou un nombre est pair ou non. C'est bon. C'est donc là que nous pouvons utiliser l'opérateur ternaire. Disons que j'ai ce numéro quatre. OK. Et ce que je ferais, c'est obtenir des résultats ici. Maintenant, quel est le résultat ? OK, donc le résultat aura le reste après division par deux. OK ? Alors, qu'est-ce qu'un nombre pair ? Un nombre pair est un nombre divisible par deux, n'est-ce pas ? Je vais donc simplement dire un chiffre ici. OK ? Le pourcentage deux est égal à zéro. Et je fais usage de l'égalité stricte. OK ? Cela devient donc maintenant un booléen ici. OK ? Je ne vais pas entreposer le reste ici pour le moment. Je stocke simplement une valeur booléenne, qui est le résultat de cette expression OK ? Et 1 seconde. Alors voilà, je peux dire de laisser EX P venir ici. OK ? Voilà ce que c'est. OK. Et maintenant, ce que je peux faire, c'est dire que si EXP est vrai, alors vous pouvez donner la sortie paire, ou vous pouvez donner la sortie impaire, quelque chose comme ça Et vous pouvez le sauvegarder et il devrait revenir. D'accord, nous n'imprimons pas le résultat ici, donc je dois également imprimer le résultat. Oups, je dois prendre les choses sur une nouvelle ligne, accord, et je dois obtenir des résultats Maintenant, la sortie est paire, et si c'est cinq ici, par exemple, la sortie sera impaire. OK ? Maintenant, au lieu d' avoir EXP comme variable, vous pouvez en fait couper toute cette expression ici et vous pouvez l' apporter ici D'accord, c'est également faisable. Je vais m'en débarrasser. OK. Maintenant c'est faisable. C'est bon. Vous pouvez voir comment cette sortie fonctionne correctement. OK ? Donc oui, c'est ce qu'est le programme. Nous sommes en train d'évaluer si le chiffre est vrai ou non. OK ? La prise de décision est donc une partie très importante du programme. Vous savez, disons si vous créez une boutique en ligne et si vous souhaitez une réduction ne soit applicable qu'à certains membres privilégiés. Vous pouvez donc avoir ce type de prise de décision. Si le membre est privilégié, il s'agit d'une valeur de réduction. Si ce n'est pas le cas, il s' agit d'une valeur de réduction. Tous ces types de prise de décision constituent donc une grande partie de votre programmation Jascript, et pas simplement du Jaw Script, de n' importe quelle programmation OK, la prise de décision tourne autour de ça, d'accord ? J'espère donc que vous connaissez bien l'opérateur conditionnel ou l' opérateur ternaire. Je dois dire qu'il est également connu sous le nom d' opérateur conditionnel, d'ailleurs, accord, à certains endroits, mais je préfère l'appeler ternaire D'accord ? Maintenant, une dernière chose dont je voudrais parler ici à propos du ternaire c'est que vous pouvez même avoir un opérateur ternaire imbriqué Alors, qu'est-ce qu'un opérateur ternaire imbriqué, d'accord ? Je vais donc ajouter un exemple ici. Supposons donc que nous créions une application et que nous voulions évaluer l'âge à plusieurs niveaux. OK ? Donc, si l'âge est inférieur à 13 ans, d'accord, nous disons que la personne est un enfant. OK ? Si l'âge est inférieur à 20 ans, accord, alors nous disons que la personne est adolescente, non. Et si l'âge est inférieur à ce que vous pouvez dire ou supérieur à 20 ans. D'accord, nous disons qu'il est adulte. OK. Donc ici, en fait, ce ne sera pas moins de 20, mais ce sera 13-20. OK ? Donc, si l'âge est de 13 à 20 ans, c'est un adolescent, et s' il est supérieur à 20 ans, c'est un adulte Comment feriez-vous cela avec l'aide de l' opérateur Turnary ? Laisse-moi te montrer. OK ? Donc, d'abord, je vais dire que l'âge est égal à, je vais avoir une valeur d'âge. Disons que c'est 16. OK ? Maintenant, quelle est la syntaxe de l'opérateur ternaire ? Il s'agit d'une syntaxe. Je vais chercher la syntaxe, d'accord ? Et je vais donc appeler cela une catégorisation, enfant, adolescent, adulte OK ? Je dirais donc que la catégorie ici est égale à, et c'est de la syntaxe. Donc, la première condition est d' avoir moins de 13 ans, non ? L'âge est donc inférieur à 13 ans, il vaut mieux l'avoir entre crochets. C'est ce que je vais faire. Si l'âge est inférieur à 13 ans, que disons-nous ? C'est ce que nous appelons ici quand nous étions enfants. OK. Donc c'est un enfant, non ? Maintenant, je vais juste combler cette lacune et voici T. D'accord ? Maintenant, qu'est-ce que la valeur deux ? OK ? Valeur deux, au lieu de la valeur deux, vous pouvez en fait démarrer un autre opérateur ternaire ici OK. Laissez-moi vous montrer comment faire. Donc, vous pouvez dire qu'il une autre condition ici, j'ai moins de 20 ans. Donc, une chose est confirmée si vous exécutez cette partie du code, il n'a pas moins de 13 ans, n'est-ce pas ? Cette partie est confirmée, n'est-ce pas ? Si cette partie est exécutée, il a moins de 13 ans, non ? Donc, ce que vous feriez, c'est de venir ici, tomber s'il a plus de 13 ans, vérifier s' il est inférieur à 20 ans. C'est moins de 20 ? Si c'est moins de 20, vous dites que c'est un adolescent. Quelque chose comme ça. Et si ce n'est pas le cas, vous diriez qu'il est adulte. Compris. Cela a du sens, laissez-moi voir si je peux apporter une nouvelle orientation. Cela est donc désormais lisible en un seul clic. Permettez-moi de vous montrer la catégorie ici. OK. OK, je vais donc ajouter la catégorie ici. OK ? Maintenant, il a 16 ans, donc vous pouvez voir que c'est un adolescent. OK. Laisse-moi fixer l'âge à dix ans. C'est un enfant. Laisse-moi porter l'âge à 22 ans. C'est un adulte. Comment est-ce que cela fonctionne ? Nous vérifions donc d'abord l'âge ici. Si l'âge est inférieur à 13 ans, d'accord ? C'est un enfant. OK ? Et si c'est faux, si l'âge est supérieur à 13 ans, alors nous vérifions si l'âge est inférieur à 20 ans ou supérieur à 20 ans ? OK ? Parce que maintenant cette condition est terminée, non ? C'est faux. Donc, s'il entre dans la fourchette des chutes, nous vérifierons s'il a plus de 20 ans ou moins de 20 ans. S'il a moins de 20 ans, on dit adolescent , sinon on dit qu'il est adulte. C'est ainsi que cela fonctionne. Et cet exemple ici est un exemple d'opérateur ternaire imbriqué Vous pouvez également continuer à nicher ici. Il vous permet également d'ajouter un opérateur ternaire supplémentaire, et vous pouvez simplement continuer à le faire correctement Mais ce n'est pas une bonne pratique d' imbriquer un grand nombre d'opérateurs ternaires Un ou deux, c'est bien, d'accord ? L'un d'eux est parfait. En fait, je dirais que c'est bon. C'est bon. Mais au-delà de cela, je dirais que n'est pas lisible et que ce n'est pas une bonne pratique. C'est bon. Mais oui, s'agit d'opérateurs ternaires ou d'opérateurs conditionnels, et j'espère que vous êtes clair Les opérateurs ternaires nous aident à évaluer les conditions et à effectuer certaines actions dans notre code J'espère donc que vous avez pu me suivre, et j'espère que cela vous a été utile. 22. Tableaux dans JavaScript: C'est bon. Il est donc temps de parler de l'un des sujets intéressants appelés tableaux Maintenant, il y aura des scénarios où vous écrirez des programmes dans lesquels vous ne voulez tout simplement pas stocker une seule valeur, mais plutôt plusieurs valeurs d'une chose similaire, d'accord ? Maintenant, permettez-moi de vous donner un exemple. Vous pouvez créer une variable pour stocker les informations d'un étudiant. Par exemple, vous pouvez créer une variable appelée numéro de rôle pour stocker le numéro de rôle d'un étudiant. Et si vous souhaitez enregistrer le numéro de rôle d'un millier d'étudiants ? Allez-vous créer 1 000 variables ? Absolument pas. Et c'est à ce moment-là que vous pouvez créer des tableaux. Les tableaux vous permettent donc de stocker plusieurs valeurs dans une seule variable, d'accord ? Et vous pouvez créer des tableaux à l'aide de crochets comme celui-ci Nous allons donc parler beaucoup plus des tableaux. Laissez-moi donc créer un tableau pour vous. Je vais créer un tableau appelé numéro. chiffres ici et je vais en avoir un, deux, trois et quatre ici. D'accord. Et vous pouvez l' imprimer de cette façon. D'accord. Tu peux dire des chiffres. D'accord. Cela vous donnera le résultat sous forme de un, deux, trois, quatre. Désormais, vous pouvez même créer des tableaux directement sur la console. Il s'agit d'une console JavaScript. Vous pouvez donc dire que num est égal à ce que je peux ajouter. D'accord. Et vous pouvez imprimer dans Num ici, quelque chose comme ça, vous pouvez le voir, n'est-ce pas ? C'est donc aussi une façon de le faire, d'accord, mais nous nous en tiendrons au code de Visual Studio. Voici comment vous pouvez créer des nombres OK, tableau de nombres. Et vous pouvez même créer un tableau de chaînes. Je peux donc dire « laissez les fruits ». Prenons un exemple de fruits, et vous pouvez avoir des pommes ou une banane. Tu peux avoir une orange. accord. Et vous pouvez choisir de verrouiller la console ici. D'accord. Je vais donc créer le journal de la console et imprimer des fruits. Oups. Et je vais enregistrer ceci, vous pouvez le voir, comme le résultat ici. Maintenant, le fait est que vous avez créé des tableaux, et la création de tableaux est relativement simple, Maintenant, comment accéder aux éléments d'un tableau ? D'accord ? Maintenant, si vous avez ces nombreux éléments, d'accord ? Il s'agit d'une liste d' éléments du tableau. Maintenant, je tiens à mentionner ici que les éléments des tableaux sont accessibles à l'aide de ce qu' on appelle un index D'accord ? Donc index, c'est-à-dire la position de l'élément. On est donc en position zéro, car les index commencent toujours à zéro D'accord ? Vous avez donc zéro, un, deux, puis trois dans le tableau. D'accord ? Maintenant, comment pouvez-vous utiliser ces index ou ces positions ? C'est en fait la position, c'est vrai, qui part de zéro. D'accord, ils sont nuls, ils suivent zéro. L'indexation Beast est ce qu'ils appellent, d'accord Mais la question est, d'accord, c'est la position, c'est l'indice que j'ai, d'accord ? Comment puis-je m'en servir ? Vous pouvez donc dire « Console point log » ici. D'accord ? Et disons que si je veux accéder aux numéros, et que je veux accéder au numéro position ou à l'index trois, d'accord ? Vous pouvez donc en voir quatre en cours d'impression. D'accord ? Je peux en avoir des fruits. Je peux le sauvegarder. OK, donc il n'y a pas de fruit en troisième position parce que 01 et deux. OK, c'est pourquoi nous sommes de plus en plus mal définis, mais vous pouvez en avoir un ici et vous verrez Panana D'accord ? JavaScript a donc une indexation basée sur zéro, ce qui est courant dans de nombreux langages de programmation Si vous venez de Java, vous serez au courant de l'indexation ici D'accord. Vous pouvez même modifier les éléments du tableau à l'aide d'index. D'accord ? Ainsi, par exemple, comme je vous l'ai montré, vous pouvez accéder aux éléments du tableau à l'aide d'index. Vous pouvez donc dire fruits et disons le fruit à l'index 1, je souhaite avoir à la place de la banane, je souhaite avoir des cerises, disons, par exemple. D'accord. Et puis si vous essayez de l'imprimer ici, vous verrez une cerise en sortie. Tu peux voir. Nous avons donc modifié l'élément au premier index ici, qui est la deuxième position dans le tableau. D'accord ? Il s'agit donc d'un tableau. Vous pouvez même avoir un tableau au sein d'un tableau. Vous pouvez donc créer une sorte de matrice ici. Je peux donc dire Matrix. Appelons-la matrice elle-même. Vous créez un tableau entre crochets, à droite. Maintenant, à l'intérieur de celui-ci, vous allez à nouveau avoir des crochets et vous pouvez dire un, deux, trois. Vous pouvez en avoir encore un, quatre, désolé, quatre, cinq, six, d'accord. Et tu peux en avoir six ou sept, désolé, pas six. Il devrait y en avoir sept, huit et neuf. D'accord. Et tu peux l'imprimer. OK, nous avons une erreur, je ne peux pas lire, d'accord ? OK, c'est probablement parce que j'ai oublié une virgule, donc elle doit être séparée par des virgules, et vous pouvez voir que le problème a disparu N'oubliez donc pas la virgule si vous essayez de créer un tableau inestd et que vous pouvez imprimer en matrice ici, quelque chose Et vous verrez le résultat ici. D'accord ? Vous pouvez donc voir que c'est un tableau de tableaux Vous pouvez donc l' imprimer de cette façon, zéro. Et vous verrez, comme le tableau du premier index imprimé. Vous pouvez même imprimer le premier élément. Vous pouvez donc utiliser quelque chose comme ça, double indexation, et vous pouvez en obtenir une ici. D'accord. Si vous dites « un », « oups », pas « Q », vous en verrez deux s'imprimer D'accord ? C'est donc 00, zéro virgule un, zéro virgule deux D'accord ? Donc, ce zéro représente d'abord la ligne, et celui-ci représente la colonne. C'est bon. Ce sera donc deux virgules C'est bon. J'espère que cela a du sens. C'est bon. C'est ainsi que vous pouvez utiliser des tableaux imbriqués, également appelés tableaux multidimensionnels Parlons maintenant certaines méthodes qui nous sont fournies lorsque nous travaillons avec des tableaux Maintenant, parlons de certaines des méthodes disponibles pour les développeurs comme nous pour mieux utiliser les tableaux en JavaScript, n'est-ce pas ? Vous pouvez donc voir qu'il existe plusieurs méthodes comme push qui est utilisé pour ajouter un élément à la fin du tableau, pop, qui est utilisé pour supprimer le dernier élément, qui est utilisé pour supprimer l'élément forcé, et shift, qui peut être utilisé pour ajouter un élément au début du tableau. Tranche qui copie une partie d'un tableau, puis nous avons une tranche qui peut ajouter ou supprimer les éléments à l'index spécifique. Jetons donc un coup d'œil à chacun d'eux individuellement, n'est-ce pas ? Nous allons donc commencer par pousser ici. OK, alors pousse. D'accord. Maintenant, qu'est-ce que Push ? Il dit qu'il ajoute un élément à la fin. C'est bon. Maintenant, avant de parler de push, permettez-moi également de vous rappeler une propriété intéressante du tableau, qui est la longueur. D'accord ? Vous pouvez donc obtenir la longueur du tableau et le script Ja ici comme ceci. Vous pouvez en voir trois imprimés, ce qui signifie que les fruits contiennent trois éléments. D'accord ? Vous pouvez voir qu'il comporte trois éléments. D'accord. Alors maintenant, si vous voulez insérer un élément dans un tableau, vous pouvez dire fruits, point, pousser. D'accord, je peux placer n'importe quel élément ici. OK, je peux probablement dire orange. OK, comme ça. D'accord. Et je peux dire «   console point log » ici, et je peux dire « fruits ». D'accord. Maintenant, si vous l'imprimez, vous verrez une pomme, une cerise, une orange, une orange. Orange a été ajouté deux fois ici. D'accord ? Si j'ajoute de la banane ici, vous verrez des pommes, des cerises, oranges, des bananes. C'est ce que c'est. D'accord. Vous insérez donc un élément la fin du tableau. Et si vous prenez la longueur du tableau ici, après avoir poussé l'élément, la longueur est désormais de quatre. Plus tôt, c'était trois. C'est bon. Cela nous indique donc que les tableaux en JavaScript sont dynamiques, n'est-ce pas ? Vous pouvez ajouter et supprimer des éléments et la taille du tableau peut changer dynamiquement. D'accord ? Et la longueur est une propriété étonnante qui peut nous aider à obtenir la longueur du tableau. D'accord ? Il s'agit donc de pousser. C'est assez simple. Il est utilisé pour placer un élément à la fin du tableau. accord ? C'est ce que cela dit. Ensuite, il y a papa. Maintenant, qu'est-ce que la pop ? C'est bon. Donc, la définition dit de supprimer le dernier élément, c'est vrai. Voyons maintenant comment cela nous aide à supprimer le dernier élément. D'accord ? Je peux donc dire que je vais copier ce journal de points de la console ici. Et avant le point log de la console, je dirais fruits, point, je peux dire pop by here. D'accord. Et auparavant, il comportait quatre éléments. Maintenant, il y en aura trois. Vous pouvez donc voir des pommes, des cerises et des oranges. D'accord ? Vous pouvez même insérer cet élément dans une variable, afin que vous puissiez dire « dernier fruit », par exemple. D'accord. Et tu peux même imprimer le dernier fruit que tu as reçu, d'accord ? C'est également possible. Il est donc possible d'attraper le dernier élément. Vous pouvez voir des pommes, des cerises, des oranges, et vous avez des bananes comme dernier fruit ici. Vous pouvez voir la définition ici, supprimer le dernier élément du tableau et le renvoyer. D'accord ? Il revient donc également. Si le tableau est vide, undefined est renvoyé et le tableau n'est pas modifié D'accord ? Il s'agit donc de pop, et la prochaine chose que vous avez, c'est Shift. Maintenant, qu'est-ce que Shift ? D'accord ? Shift supprime donc l'élément forcé. D'accord ? Donc, comme pop supprime le dernier élément, il supprime l'élément forcé. Donc je vais juste l'apporter ici. OK, ou je vais juste envoyer cette partie ici. D'accord. Et je vais commenter ce truc pour le moment et vous pouvez dire «   passez par ici ». Maintenant, si vous l'exécutez, vous verrez qu'Apple a été le premier. Maintenant, vous n'avez que deux cerises et deux oranges. OK ? Vous pouvez même acheter les premiers fruits ici. Comme si nous avions eu le dernier fruit, laissons les premiers fruits ici. OK, quelque chose comme ça. Et laissez-moi imprimer les premiers fruits, d'accord, ici. Vous voyez, la pomme est le premier fruit. C'est bon. Donc, comme pop renvoie le dernier élément, shift si vous passez la souris dessus, il supprime le premier élément et le renvoie également C'est ce que fait Shift. D'accord. Ensuite, vous avez ce qu' on appelle unshift away, qui est utilisé pour ajouter un élément au début OK ? Permettez-moi donc de présenter cette méthode ici. OK. Passons à la vitesse supérieure. Tu viens ici et tu nous laisses découvrir l'unhetto ici. OK ? Donc, ce que je peux faire, c'est dire que j'ai des fruits. Voilà ce que contiennent les fruits, d'accord ? Ce que je peux faire, c'est dire fruits point et shift, et je peux ajouter, disons, je peux ajouter Apple. Encore une fois, Apple, quelque chose comme ça. OK. Et imprimons. Faisons un journal de console. Vous pouvez voir Apple à nouveau être ajoutée. OK ? Donc tout à l'heure, Apple a été supprimée, d'accord ? Et puis nous avons à nouveau Apple. Tu peux voir ? Par ici. OK ? Donc, ceci est ajouté sans décalage. Cet élément particulier a été ajouté au début, d'accord ? Et vous pouvez voir insère un nouvel élément au début du tableau et renvoie la nouvelle longueur du tableau. Il renvoie donc en fait la nouvelle longueur du tableau. OK ? Si tu veux, tu peux dire « nouvelle longueur » ici. OK. Et vous pouvez dire « Console », point log » ici, et vous pouvez imprimer dans une nouvelle longueur, quelque chose comme ça. OK. Vous verrez la nouvelle longueur du tableau. OK, par ici. Auparavant, c'était une longueur de deux. Il a maintenant une longueur de trois. C'est bon. Donc c'est du unshift. Maintenant, il ne reste plus qu'à trancher. Slice copie maintenant une partie du tableau. Voyons ce que cela signifie, d'accord ? C'est donc une solution pour nous, d'accord. Supposons maintenant que nous ayons un tableau. OK, c'est donc le tableau de quatre éléments. C'est bon. Laisse-moi trancher ça, d'accord ? Supposons donc que je veuille découper les éléments de l'index un à deux, donc de la cerise à l'orange, d'accord ? Parce qu'il y a trois éléments, pas quatre, d'accord ? Permettez-moi donc de trouver un tableau de quatre éléments ici. OK ? Je peux donc redéclarer ce tableau ici, recréer ou me OK, ton orange, je peux voir cerise ou une fraise, quelque chose comme ça. OK. Nous avons donc maintenant des éléments un tableau de quatre éléments. C'est bon. Ce que je peux faire, c'est que je peux vraiment avoir laissé, je peux avoir une gamme découpée, et je peux dire des points de fruits. Je peux dire, donc ici vous pouvez voir, S. Si vous tapez S, vous avez une tranche. Nous allons utiliser la tranche 1, la virgule 3. OK. Et vous pouvez dire console point log ici et vous pouvez dire tableau découpé. Oups. Il dit donc : OK, cela a déjà été déclaré et nous ne pouvons pas l'utiliser à nouveau. Je peux donc vous parler de nouveaux fruits ici. OK. J'aurais dû utiliser le nouveau nom, d'accord. De nouveaux fruits, de nouveaux fruits, je vais garder ça et vous pourrez voir une banane orange. C'est bon. Il s'agit donc de l'index 1, puis de l'index deux, et vous pouvez voir comment il est découpé à partir d'ici. OK ? Il s'agit donc de copier l'élément de l' index un à l'index deux. C'est ce qui se passe. OK ? Nous voyons donc une virgule trois Donc ce qu'il fait c'est 1 à 2 par ici, d'accord ? Les deux sont découpés en tranches. C'est bon. Et si vous passez la souris dessus, vous verrez qu'il renvoie une copie d' une section d'un tableau pour le début et la fin Et un indice négatif peut être utilisé pour indiquer un décalage par rapport à la fin du tableau. Donc, moins deux, si vous dites moins deux, fait référence à l'avant-dernier élément du tableau. D'accord ? Ce qui veut dire avant-dernière. Donc, moins deux sera orange ici. OK ? C'est une avant-dernière. C'est bon. C'est ainsi que Slice peut être utilisé. Il est essentiellement utilisé pour découper un tableau. Et puis vous avez une tranche ici, qui peut être utilisée pour supprimer ou ajouter un élément à un index spécifique. OK ? Alors laisse-moi essayer cette tranche ici. OK. Maintenant tu as des fruits ici. Donc ce que je vais faire, c'est dire fruits point, épissage par ici OK. Et ce que nous allons faire, c'est supprimer un élément à l'index 1. OK ? Vous pouvez donc dire un élément. OK ? Donc, si vous passez la souris dessus, vous verrez de la documentation. D'accord. Il accepte donc quelques paramètres. Commencez par indiquer le nombre de valeurs que vous souhaitez supprimer, OK, et la chaîne de caractères ici. Vous pouvez donc voir que le début signifie l'emplacement de base zéro dans un tableau à partir duquel vous souhaitez commencer à supprimer des éléments. nombre de suppressions indique le nombre d'éléments que vous souhaitez supprimer de ce nombre. Donc, si vous dites à partir de la première position, je veux en supprimer deux, vous devez donc ajouter une virgule deux ici, quelque chose comme ça Je vais retirer deux éléments de la première position, d'accord ? Et troisièmement, il renvoie un élément contenant ce qu'il renvoie. Elle renvoie le tableau contenant les éléments qui ont été supprimés. OK ? Alors essayons ça ici. Donc, ce que je ferais, c'est ici, je dirais d'abord enregistrer les points sur la console, et je vais imprimer des fruits. OK ? Maintenant, nous supprimons deux éléments, commençant par la première position, d'accord ? Donc, si je l'enregistre, vous verrez à nouveau Apple uniquement en cours d'impression. OK ? C'est donc un tableau que nous avions. Nous supprimons donc deux éléments, en partant de la première position. OK, donc vous pouvez voir qu'il y avait à nouveau Apple , cerise et orange. Il ne reste donc qu'Apple, car deux éléments à partir de la position 1 signifient que les deux éléments sont finalement supprimés. D'accord ? Maintenant, la documentation indique qu'elle renvoie un tableau contenant les éléments qui ont été supprimés. OK ? Vous pouvez donc réellement les obtenir. Vous pouvez dire « Autoriser les éléments supprimés » ici. OK. Et je peux imprimer des éléments supprimés, essentiellement ici. OK ? Je peux donc dire des éléments supprimés. Oups ici, je peux enregistrer ceci et vous pouvez voir sont les éléments qui ont été supprimés ici. D'accord ? Maintenant, quelle est la magie après la suppression, nous avons utilisé Slice pour supprimer l'élément. OK. Désormais, cela peut également être utilisé pour supprimer et ajouter des éléments en même temps. Maintenant, si je spécifie un élément ici. OK, vous pouvez voir les objets. Il s'agit donc d'éléments à insérer dans le tableau à la place des éléments supprimés. Vous pouvez le voir apparaître automatiquement. Vous avez donc commencé, vous aviez le nombre de suppressions, et maintenant vous avez une liste d'éléments. Je peux donc dire nouvel article ici, et je peux l'enregistrer et vous verrez un nouvel article ajouté. D'accord. Permettez-moi d'ajouter un autre élément ici. OK. Je peux à nouveau ajouter un nouvel article. Et vous verrez qu'à la place des éléments supprimés, vous pouvez même ajouter de nouveaux éléments à l' aide de Slice. Tu peux voir. C'est ainsi que cela fonctionne , en gros, et il est essentiellement utile de modifier le tableau selon vos besoins accord ? Voici certaines des méthodes auxquelles vous avez accès. J'espère que vous avez pu me suivre et j'espère que cela vous a été utile. 23. Objets dans JavaScript: Il est maintenant temps de commencer à parler d'objets. Maintenant, que sont les objets ? Les objets en JavaScript vous permettent donc de regrouper des données connexes et même des fonctions. Oui, nous en arrivons à la partie des fonctions. Mais pour l'instant, nous allons parler de la partie données. Les objets vous permettent donc de regrouper des données et des fonctions connexes. Un objet est créé à l'aide d'une paire de brises frisées. Donc, si vous devez créer un objet, vous devez créer quelque chose comme celui-ci. Vous diriez « laissez-moi », disons, si je souhaite stocker des données relatives à une personne, n'est-ce pas ? Je peux donc dire que quelqu'un d'ici peut avoir une paire de brises frisées comme celle-ci, puis je pourrais y avoir des paires clé-valeur, où chaque clé est également connue sous propriété et a une valeur qui lui est associée C'est bon. Je peux donc dire qu'est-ce qu'une personne aurait ? Donc, une personne peut avoir beaucoup d'informations, d'accord ? Supposons que je développe un programme et que je souhaite stocker les informations d' une personne. Donc, soit je peux créer plusieurs variables, comme je peux dire « laisser une personne », et je peux dire « âge, personne, un nom ». Alors, pour la deuxième personne, je peux dire la personne deux, chacune, etc., mais ce n'est pas la façon idéale de procéder, n'est-ce pas ? Donc, au lieu vous voudriez avoir un objet dans lequel vous pouvez regrouper données associées à une personne en particulier. Donc, pour la première personne, je pourrais dire son nom, et je pourrais avoir le nom Alice, par exemple, non, je pourrais avoir H et chacun peut avoir 25 ans. OK ? Maintenant, prenez une note ici. C'est une ficelle ici, non ? Il s'agit d'une chaîne. Ce n'est pas un chiffre. C' est un nombre ici, et je peux aussi avoir un booléen ici. Je peux donc dire qu' une personne est étudiante et je peux dire que la vraie tombe ici. OK. Notez donc que vous pouvez avoir plusieurs types de données ici. OK. Pour en revenir ici, un objet est créé à l'aide d'une paire de phrases de requête, comme nous le faisons ici, il contient des paires clé-valeur. Il s'agit donc d'une clé et d'une valeur. OK ? Chaque clé est également appelée propriété. Il s'agit donc également d'une propriété de l'objet. La personne a donc trois propriétés, à savoir le nom. Vous pouvez voir si vous passez la souris dessus, il est écrit « propriété » ici, d'accord ? Et cela s'appelle name et le type de données est chaîne. Si vous placez le pointeur dessus, si je le survole, c' est la propriété H et le type est Si vous passez la souris ici, la propriété est étudiante et elle est booléenne Et si vous passez la souris dessus , vous pouvez voir la définition complète d'une personne, n'est-ce pas ? Et vous verrez le type de données ici au lieu des valeurs. C'est bon. Chaque clé est donc appelée propriété et une valeur lui est associée, n'est-ce pas ? C'est ce que nous avons fait en créant une personne. Et bien sûr, pour l' imprimer ici, vous pouvez également l'imprimer quelque chose comme ça. D'accord ? Et vous le verrez s'imprimer sur la console. D'accord ? désormais accéder aux propriétés de l'objet de plusieurs manières Vous pouvez désormais accéder aux propriétés de l'objet de plusieurs manières. C'est bon. Nous sommes donc en train d'imprimer l'objet dans son intégralité, n'est-ce pas ? Mais si vous souhaitez accéder à une propriété spécifique, vous pouvez même le faire, et il existe plusieurs façons de le faire. Disons que je peux dire console point log. Vous pouvez maintenant utiliser ce que l' on appelle la notation par points. Donc, la personne ne vieillit pas ici. Nous imprimons donc H sous la forme 25. C'est une façon de faire les choses. Une autre solution est de le dupliquer Une autre méthode consiste à utiliser ce type de syntaxe. Par exemple, vous avez des crochets, et à l'intérieur de ceux-ci, vous avez le nom de la propriété. Tu peux voir. Ensuite, vous pouvez même y accéder de cette façon et vous verrez la sortie sur la console. C'est bon. Voici donc les deux manières d'accéder aux propriétés des objets en JavaScript. Maintenant, si vous regardez le code source en ligne, vous verrez la plupart du temps que c'est ce qui est utilisé, d'accord ? Comme partout dans votre application de production, sur votre lieu de travail ou dans n'importe quel type de code source que vous lisez en ligne, vous verrez que cette convention est utilisée à plusieurs endroits. C'est très rare, et la raison évidente en est que ce n'est pas si facile à regarder et même à taper, n'est-ce pas ? C'est donc beaucoup plus simple que la notation par points, et c'est pourquoi elle est couramment utilisée. D'accord ? Maintenant, nous avons parlé de la création d'un objet. Nous avons parlé de l'accès aux propriétés. Vous pouvez même ajouter ou mettre à jour les propriétés. OK ? Maintenant, parlons d'abord de la mise à jour. Nous allons donc d'abord mettre à jour l'âge. Vous pouvez donc voir que le point H est égal à 66 ici. OK ? Et puis si vous l' imprimez ici, et si vous sauvegardez, vous verrez que âge de la personne est passé à 66 ans. Et même si j'imprime l'objet dans son intégralité, vous verrez que la valeur qu'il contient est 66. accord ? Maintenant, il s' agit de mettre à jour. Voici comment procéder à la mise à jour. C'est assez simple. Vous utilisez la notation par points ou vous pouvez même utiliser ce type de syntaxe ici avec les crochets, et vous pouvez mettre à jour la propriété en lui attribuant une nouvelle valeur Maintenant, comment ajouteriez-vous une nouvelle propriété ? Supposons que je souhaite ajouter une nouvelle propriété dans laquelle je souhaite enregistrer le travail de la personne. Je peux donc dire Person Dot Job ici, et je peux dire ingénieur. Quelque chose comme ça. C'est bon. Et je peux imprimer cet objet ici. Et maintenant, si vous imprimez , vous verrez qu'il contient une nouvelle propriété appelée JOB. Donc, tout d'abord, cette propriété n' existait pas lorsque nous avons créé la personne, vous pouvez le voir. Il n'existait pas. Il n'y avait que trois propriétés : nom, âge et étudiant, vous pouvez le voir, n'est-ce pas ? Mais plus tard, nous avons ajouté une propriété qui disait « person dot JOB ». Et nous lui avons attribué une valeur appelée ingénieur. L'ajout d'une nouvelle propriété est aussi simple que d'accéder à cette nouvelle propriété à l'aide de la notation par points. Donc, si vous ajoutez un nouveau nom de propriété en utilisant la notation par points, vous pouvez l'attribuer à une valeur et celle-ci sera ajoutée à l'objet ici. OK ? Vous pouvez même y accéder en utilisant la notation par points si vous le souhaitez ici, comme si vous accédiez aux autres propriétés. Vous pouvez voir le moteur ici. C'est bon. Tout cela est donc possible ici avec ou quand vous voulez créer ou quand vous voulez ajouter ou mettre à jour les propriétés. D'accord ? Vous pouvez désormais ajouter une propriété à un objet. Vous pouvez même supprimer une propriété. Comment ferais-tu ça ? Jetons donc un coup d'œil à la suppression de propriétés. OK ? Disons que je souhaite supprimer, je souhaite supprimer son étudiant ici. OK ? Donc, pour le moment, je peux utiliser le mot clé Dell, supprimer le mot clé, désolé, ne pas le dire. Il s'agit de supprimer le mot clé. Vous pouvez voir par ordre de suggestion, vous pouvez voir la personne enseignée et vous aurez la liste des propriétés ici. Lequel souhaitez-vous supprimer ? Je souhaite supprimer son étudiant ? OK. Et puis si vous essayez d' accéder à cet étudiant ici, et si vous l'enregistrez, vous verrez qu'il ne sera pas défini C'est bon. Et si vous inscrivez simplement la personne, vous ne verrez pas son étudiant participer à tout cela. Vous pouvez voir plus tôt que l'étudiant était là dans cet objet en particulier, mais plus tard, vous n' avez plus sa personne ici. Cette propriété est donc effectivement supprimée à l'aide du mot clé delete. C'est bon. Il est donc possible d'ajouter des propriétés de manière dynamique après la création de l'objet, et vous pouvez également supprimer les propriétés une fois l' objet créé. Tout est donc possible, d'accord ? Maintenant, il est également possible de vérifier si une propriété particulière existe réellement dans un objet donné, d'accord ? Maintenant, il y aura des scénarios, bien sûr, dans lesquels vous souhaiterez peut-être mettre à jour une propriété si cette propriété existe. Supposons donc que si un emploi existe chez cette personne, vous souhaiterez peut-être le mettre à jour. Si vous n'ajoutez pas cette vérification, si poste n'existe pas en personne, il sera ajouté, il sera créé récemment, et vous ne voulez pas que cela se produise. Vous souhaitez effectuer la mise à jour uniquement si elle existe. OK ? Donc, tout d'abord, ce que nous pouvons faire, c'est d'accord, vérifier une seconde. Nous vérifierons si la propriété existe. OK ? Comment le faites-vous ? Je vais donc simplement faire défiler la page vers le bas. OK. Et je dirais, journal à points sur console, et je pourrais voir le nom en personne. OK ? Maintenant, cela va donner une valeur booléenne Vous pouvez voir la vérité ici. Pourquoi est-ce vrai ? Parce que le nom existe réellement en personne. Vous pouvez voir que nous avons ajouté un nom ici. Si vous jetez un œil aux précédentes déclarations du journal à points de la console, vous constaterez que le nom est présent. OK ? C'est une façon de le vérifier. Il existe un autre moyen, vous pouvez donc dire « console point log » ici. OK. Et vous pouvez dire personne, point et vous pouvez dire qu' il possède ses propres biens, quelque chose comme ça, puis vous pouvez dire âge ici. OK. Tu vas redevenir honnête ici, d'accord ? Donc, cette propriété possédée détermine, vous pouvez voir la documentation ici, détermine si un objet a une propriété avec le nom spécifié, d'accord ? Maintenant, si je change cela en un an, si je le change pour en nommer un ici. Bien sûr, ces deux-là n'existent pas. Donc si je garde ça, tu vas te tromper ici, non ? Parce que ces deux-là n'existent pas. Je vais juste faire Control Z ici et je vais l' enregistrer pour que le vrai soit imprimé sur la console. accord ? Maintenant, c' est vraiment utile. Comme je l'ai dit, si vous souhaitez effectuer une mise à jour des propriétés, selon que la propriété existe ou non dans un objet, vous pouvez utiliser n'importe laquelle de ces syntaxes, d'accord ? Et vous l'utilisez normalement avec des instructions conditionnelles, et si c'est vrai, vous mettrez probablement à jour la propriété. Hein ? Et ce truc que vous voyez ici est un opérateur ici. OK ? Et avec l'aide de cela, cela vous permet de vérifier, essentiellement, que vous voyez quel est le cas d'utilisation de in ici. C'est bon. Donc oui, il s'agit de vérifier si la propriété existe. Maintenant, il y a ce qu'on appelle des objets imbriqués, d'accord ? Cela signifie qu'un objet peut contenir un autre objet ou également d'autres objets. Maintenant, la définition de l'objet que nous avons vue contient des paires clé-valeur, n'est-ce pas ? Il n'y a rien d' imbriqué dedans. Il y aura donc des scénarios dans lesquels vous souhaiterez peut-être stocker des données complexes, dans lesquels vous voudrez peut-être avoir un objet dans un objet, n'est-ce pas ? Maintenant, permettez-moi de vous donner un exemple. Supposons que vous créez des objets pour suivre les étudiants et que vous construisiez une académie en ligne dans laquelle un étudiant s'inscrit à des cours Donc, ce que vous feriez, c'est avoir un étudiant ici. OK ? J'aurais pour objet de stocker les informations sur les étudiants, et j'aurais le nom de l'étudiant. Quel est le nom ? Le nom est disons « pop » ici. OK. Maintenant, je veux avoir une liste des cours auxquels l'étudiant s'est inscrit. Je peux donc parler de cours ici. OK. Et dans ce cadre, ce cours est un objet parce que ce sera une liste, n'est-ce pas ? Donc tu peux avoir Mat ici. OK. Maintenant, ici, tu peux dire vrai, OK. Tu peux avoir des signes. Vous pouvez faire des chutes ici et ainsi de suite. C'est bon. Maintenant, si vous souhaitez l'imprimer, vous pouvez dire Console point Log, et vous pourrez voir l' étudiant ici. Quelque chose comme ça. Vous pouvez donc voir le nom , puis le cours est à nouveau imbriqué ici, que vous pouvez étendre le nom et le signer Désolé, les maths et les sciences sont ici. C'est bon. Maintenant, la question est de savoir s'il y a un objet dans un objet. C'est un objet imbriqué, non ? Comment accèderiez-vous aux mathématiques de la propriété ? Alors laissez-moi vous le montrer également. C'est bon. Donc, ici, vous avez un étudiant. Vous pouvez dire « point étudiant », et vous pouvez voir la suggestion. Alors nommez si vous voulez accéder à l'âge, bien sûr, vous pouvez utiliser le point ici. OK, l'âge n'existe pas. Je peux donc utiliser le nom ici et vous aurez accès à pop. OK. Maintenant, si vous voulez accéder à des cours, vous pouvez dire cours ici, tout de suite, et vous aurez accès à ce Jason, qui est l'objet imbriqué ici. Vous pouvez voir les mathématiques, c'est vrai. La science est fausse. C'est bon. Et si vous voulez avoir accès à l'une de ces propriétés, vous pouvez utiliser davantage la notation par points et vous pouvez dire maths ici et vous serez sûr. OK ? Vous pouvez donc enchaîner ces notations par points de cette manière Vous pouvez dire que les cours par points pour étudiants pointent les mathématiques. OK ? Vous parlez donc de cours par points pour étudiants, mathématiques par points ici. C'est bon. Et cela vous donne le résultat comme étant vrai. accord ? Maintenant, comme l'objet extérieur, l' objet intérieur peut également avoir des propriétés avec différents types de données. À l'heure actuelle, nous utilisons le booléen. Bien entendu, vous pouvez stocker des chaînes de caractères. Tu peux avoir des chiffres. C'est bon. C'est à vous de décider ce que vous voulez stocker, et cela dépend également entièrement de vos besoins. C'est bon. J'espère donc que cela a du sens. Il s'agit donc d'objets. Et avant de terminer, je voudrais vous montrer une chose intéressante lorsque vous travaillez avec un objet, connue sous le nom de structuration d' objets D. Structuration. C'est bon. Alors, qu'est-ce que la structuration de l'objet D ? Maintenant, la structuration de l'objet D est un concept ou un moyen pratique, je dois dire, d'extraire plusieurs propriétés d'un objet et de les attribuer à des variables Maintenant, jetez un œil à cet objet ici. Il a plusieurs propriétés, non ? Tout objet que vous créez en JavaScript aura plusieurs propriétés. Il peut donc arriver que vous souhaitiez extraire ces propriétés et les attribuer à des variables individuelles. Maintenant, cela est possible grâce à la déstructuration d'objets. Nous avons donc un objet ici. Essayons-le là-dessus. Vous avez donc deux propriétés, comme le nom et les cours. C'est bon. Ce que je vais faire, c'est que je veux un nom Je veux avoir une variable appelée name ici, qui aura une valeur de nom ici pour cet objet, et les cours auront la valeur des cours. OK ? Donc, ce que je vais faire, c'est dire « laissez-le faire ». Je vais utiliser ce type de syntaxe ici. Je vais donner le nom et les cours ici. OK ? Ensuite, je vais l' assigner à un étudiant. C'est bon. Que croyez-vous qu'il se passerait ? C'est tout à fait valable ici. OK. Mais ce qui se passe réellement ici, c'est cet objet est en fait décomposé et que les propriétés sont attribuées. La valeur des propriétés est affectée à ces variables. C'est bon. Donc, si je veux imprimer dans le journal des points de la console ici, je peux dire le nom. Vous verrez le nom imprimé sous le nom de Bob ici. D'accord, qui est en fait le nom que vous avez attribué, puis vous pouvez avoir au lieu du nom, vous pouvez avoir des cours et vous pouvez les enregistrer, vous verrez le résultat ici. OK. J'espère donc que cela a du sens. Maintenant, si vous remplacez le nom de la variable par le nom deux ici, supposons, par exemple, que si vous l'enregistrez, vous verrez que le nom n'est pas défini Maintenant. Pourquoi n'est-il pas défini Parce que pour que la déstructuration fonctionne parfaitement, donc le nom doit être attribué au nom ici, alors ce nom doit correspondre au nom du nom contenu dans cette propriété dans cet objet, je suis désolée OK. Ainsi, par exemple, si je change également le nom des cours en cours, vous verrez qu'il n'est pas défini OK, donc le nom doit être similaire à celui de la propriété. Le nom de la variable doit être identique à celui de la propriété pour que la déstructuration fonctionne Si vous ignorez l'une des variables ici, si je saute des cours, vous verrez que les cours ne sont pas déstructurés. C'est bon. Donc, oui, c'est ce qu'est la déstructuration d' objets. Et tout cela concerne les objets en Jascript. J'espère que cette vidéo vous aidera à comprendre tout code que vous verrez, qui utilisera des objets Jascript à l'avenir. Bonne chance. 24. Conversion de type: Il est donc temps de parler conversion de type en JavaScript. Maintenant, qu'est-ce que la conversion de type, tout d'abord ? Ainsi, chaque fois que vous créez une variable, vous y stockez des valeurs. La variable a un type, non ? Donc, soit vous pouvez stocker une chaîne, un booléen ou un nombre, Maintenant, la conversion de type est un processus dans lequel vous convertissez une valeur d' un type à un autre. OK ? Donc, si vous convertissez une chaîne en nombres, des nombres en chaîne, c'est ce que l'on appelle la conversion de type. Maintenant, une chose que vous devez savoir, c'est que vous savez déjà, bien sûr, JavaScript est un langage mal typé, ce qui signifie que vous n'avez pas besoin de déclarer le type d' une variable, Et le type de variable peut changer manière dynamique en fonction des valeurs que vous stockez. OK. Une autre chose est que JavaScript prend en charge les conversions implicites et explicites. Donc, ce que signifie implicitement la conversion implicite est un type dans lequel JavaScript lui-même convertit automatiquement la valeur d' un type à un autre. Un explicite est l'endroit où, en tant que programmeur, vous demandez de convertir une valeur d'un type à un autre accord ? Jetons donc un coup d' œil à la conversion de type. Maintenant, laissez-moi vous donner un exemple ici. Disons donc que j'aurai X, o et disons que j'en aurai cinq plus un. OK. Maintenant, je vais faire le journal des points sur la console ici. OK. Et je vais imprimer la valeur de X. Très bien. Je vais également faire le journal des points sur la console ici. OK, et je vais dire « tape off ». Je vais dire X ici. Si je sauvegarde ceci, vous verrez que la sortie est six, bien sûr, et que la sortie est également un nombre car il contient la valeur du type number. Maintenant, laissez-moi expérimenter un peu, non ? Supposons maintenant que je convertisse cette valeur cinq en une chaîne en ajoutant un code unique. Vous pouvez même ajouter des codes doubles. C'est tout à fait normal. sera le résultat selon vous ? Y en aura-t-il six ? Et si vous pensez que c'est six, alors que pensez-vous que cela nous donnera un résultat ? Quel sera le résultat du type d'opérateur ici ? Si je sauvegarde ceci, vous verrez que la sortie est 51, puis vous avez une chaîne ici. OK ? Donc, ce qui se passe ici, c'est que vous avez cinq, qui est une chaîne, vous avez l'opérateur plus. Vous utilisez l' opérateur plus sur deux opérateurs. Ainsi, un opérent est une chaîne et l'autre est un nombre Donc, ce qui se passe, c'est que ce n'est pas un ajout valide, n'est-ce pas ? Donc, ce que JavaScript fait implicitement ou en interne, c'est qu'il en convertit une en chaîne OK ? Il en résulte donc que cette équation devient essentiellement p. J'en ai cinq ici plus un ici sous cette forme. OK ? Alors, qu'est-ce que cinq plus un ici ? Dans ce cas ? Cela devient 51 parce que les deux sont des cordes, non ? Et une concaténation de chaînes est en cours d'exécution. Donc, si vous avez loué ou si je dis console point log ici, et si je dis bonjour, d'accord ici, et bonjour. Je vais donc obtenir le résultat high hello car une concaténation de chaînes est en cours d'exécution ici OK ? C'est ainsi que l'opérateur plus se comporte avec les chaînes Et pour ce qui est des chiffres, il va additionner ces deux chiffres. OK ? Il s'agit donc d'un exemple de conversion de type implicite. accord ? Je vais juste le commenter. OK ? Maintenant, laissez-moi vous donner un autre exemple, d'accord ? Disons que j'ai le deuxième exemple ici, d'accord ? Et permettez-moi d'en donner un exemple ici, d'accord ? Donc, quelque chose comme ça. OK ? Oups, quelque chose OK, donc cette déclaration n' est pas encore complète. C'est pourquoi je reçois un message d'erreur. OK ? Disons donc le deuxième exemple. Quel est le deuxième exemple, au lieu d' avoir cinq sous forme de chaîne plus un. OK ? Laissez-moi donc d'abord l'avoir sous forme de nombre entier. Je vais donc avoir moins cinq moins un. OK. Je vais copier ces deux lignes de déclaration. Je vais les reconstituer ici. Et cela devient le deuxième exemple, bien entendu. OK ? Il y en a deux également. Maintenant, si je sauvegarde ceci, vous verrez la sortie est quatre parce que cinq moins un est, bien sûr , quatre, et la sortie est un nombre ici, en raison du type d'opérateur. OK ? C'est ce que vous voyez. Alors maintenant, permettez-moi de changer ces deux points. Une ficelle. Maintenant, quel en serait le résultat, selon vous ? OK ? Parce qu'ici, si vous changez cette chaîne, elle devient 51, non ? Vous pouvez voir qu'il en imprime 51. Quel sera, selon vous, le résultat ici, d'accord ? Des suppositions ? Donc, si je sauvegarde ceci, le résultat est toujours quatre et le type de l'exemple deux est toujours un nombre. Maintenant pourquoi en est-il ainsi ? Donc, ici, si vous utilisez l'opérateur plus, d' accord, cela a été converti. C'était ASIS, et cela a été converti en chaîne, en fait, et le résultat obtenu était une chaîne. Vous pouvez voir le résultat ici. Mais en cas de problème, cela a changé, non ? Ce n'est pas le cas, ce n'est pas comme ça qu'il se comporte lorsque vous utilisiez Plus avec la mer ou les prins Donc, le comportement, la réponse à cette question est le comportement des opérateurs plus et moins avec des chaînes et des nombres, est différent, et c'est pourquoi vous constatez un changement de comportement dans la sortie. Alors laissez-moi vous expliquer cela. Lorsque vous utilisez des opérateurs plus avec des chaînes, d'accord ? Avec les chaînes, JavaScript a la possibilité d' effectuer une concaténation OK ? JavaScript peut effectuer une concaténation avec des chaînes et JavaScript peut effectuer des ajouts lorsque l'opérateur plus est utilisé OK ? Donc, si vous l'utilisez avec des chiffres, il sait, d'accord, je dois effectuer un ajout. Si vous l'utilisez avec des chaînes, il sait que je dois effectuer une concaténation Mais lorsque vous utilisez un type mixte, il convertit le nombre en chaîne. OK ? Maintenant, dans ce cas, minus n' a pas de rôle ni de comportement lorsqu'il est utilisé avec des chaînes. Pouvez-vous imprimer en haut moins bonjour ? OK ? Cela n'a aucun sens, n'est-ce pas ? Donc, comme cette conversion d'un en chaîne n'avait aucun sens, Ja Script a converti cinq en nombre, n'est-ce pas ? Et cela vous a donné l' opération arithmétique qui en a résulté, soit quatre, et le type de sortie finale était également supérieur à quatre OK. Et c'est quelque chose de similaire. Et c'est ainsi que cela fonctionnera si vous utilisez également la multiplication , n'est-ce pas ? Alors laissez-moi vous le montrer également. OK ? Je vais donc simplement le dupliquer ici. Voici notre exemple trois, l'exemple trois et l'exemple trois, et j'en ai cinq en un. Quel en sera le résultat selon vous ? chaîne comme cinq dans une chaîne multipliée par un dans une chaîne a-t-elle du sens ? Non Donc, bien sûr, ce sera un chiffre. OK. Donc oui, c' est comme ça que les choses fonctionnent. Et comme vous pouvez l' imaginer, en interne, JavaScript effectue une conversion implicite ici dans ce cas, laquelle il convertit automatiquement la valeur de cinq ici, qui est une représentation sous forme de chaîne en nombre ici. OK ? Et comme vous pouvez le voir, vous recevez un résultat ici. Maintenant, bien sûr, si vous dupliquez ceci, laissez-moi le dupliquer et laissez-moi vous montrer un autre exemple. Si je fais défiler l'écran vers le bas, si je le remplace par l'exemple quatre, désolé, pas cinq. Ça fait quatre. C'est aussi quatre, et c'est aussi quatre. OK. Maintenant, au lieu de cinq ici, disons que c'est le cas, laissez-moi m'en débarrasser. Disons que vous avez une vérité. OK. Et tu peux dire « vrai » plus un. OK. Quel en sera le résultat, selon vous ? La sortie serait donc de deux ici car true est considéré comme un. Donc, si je sauvegarde ceci, vous en verrez deux et le résultat sera un nombre. OK ? Si je dis que c'est faux, vous verrez que la sortie est un parce que false est zéro. OK. Je vais donc m'en tenir à la vérité ici. OK, et vous pouvez voir le résultat. D'accord, c'est ainsi que les choses fonctionnent, et vous pouvez très bien voir comment se comporte la conversion implicite ici C'est bon. Parlons maintenant des conversions explicites. C'est bon. Je vais donc venir ici. OK. Et nous parlerons de la conversion de valeurs de manière explicite. C'est bon. Maintenant, il y aura d' abord des scénarios, d'accord. Il y aura des scénarios dans lesquels la conversion implicite ne sera pas suffisante et où vous voudrez faire les choses de manière explicite, n'est-ce pas ? Supposons que vous demandiez à l'utilisateur de saisir un H, par exemple, ou de saisir des marques. Maintenant, ces choses sont toujours saisies sous forme de chiffres, n'est-ce pas ? Et votre programme de script de travail obtient cela à partir du HTML. OK ? Donc, ce que vous feriez, c'est vous voudriez l' utiliser pour certains calculs. Maintenant, disons que vous avez NUM ici, d'accord ? Un, deux, trois, d'accord ? Donc, dans l'exemple dont je parlais, où vous acceptez des éléments tels que l'âge et les notes, vous voudrez peut-être effectuer une conversion explicite dans laquelle vous savez que le nombre saisi est en fait un nombre, mais il se peut qu'il soit donné en entrée dans votre programme sous forme de chaîne. Vous voudrez peut-être le convertir explicitement, n'est-ce pas ? Permettez-moi donc de vous donner un exemple. Disons que vous avez un numéro ici et disons que vous avez une piscine ici. Ceci. J'ai deux variables. OK. Maintenant, afin d'effectuer une conversion de type de manière explicite, Ja Script propose un ensemble de fonctions que vous pouvez voir ici. Ainsi, lorsque vous travaillez avec des chaînes, voici les fonctions. Vous avez deux cordes et deux cordes ici. Vous avez également un nombre, un parsent et un parse float si vous travaillez avec des nombres Et si vous souhaitez travailler avec le type de données booléen, vous pouvez utiliser le booléen Voyons donc comment vous pouvez les utiliser individuellement. Donc d'abord, nous allons parler des cordes ici, d'accord ? Maintenant, j'ai déjà créé quelques chaînes. Donc, ce que je ferais, c'est simplement les déplacer dans ce bloc ici, pas les bloquer après les commentaires. OK ? Maintenant, laissez-moi convertir ou laissez-moi vous montrer comment utiliser la fonction de chaîne. Je peux donc dire let num à chaîne ici, et je peux dire une chaîne comme celle-ci, et je peux dire Num. OK ? Donc, il suffit de passer le paramètre ici, d'accord ? Et je peux dire « console point log » ici. Peut voir un engourdissement dans une chaîne. Je peux ajouter un coma. Et puis ici, je peux dire type de et imprimer le type de num sur une chaîne. OK. Si je l'enregistre, vous verrez un, deux, trois et une chaîne en sortie. OK ? Donc oui, c' est en fait en nombre et c'est en train d'être converti en chaîne. Maintenant, la valeur est la même, un, deux, trois, mais elle est au format chaîne pour le moment. OK ? Maintenant, c'est une chose. Comment pouvez-vous utiliser le booléen ici ? Donc, vous pouvez également convertir le booléen, d'accord ? Permettez-moi donc de créer une nouvelle variable ici. Disons Bool pour une chaîne ici, et je peux dire chaîne OK, je peux dire « bool » ici, quelque chose comme ça. Et laissez-moi le copier. Et vous pouvez dire bool à chaîne et tirer à chaîne du type de Vous pouvez voir vrai et il est maintenant représenté sous forme de chaîne. Voici donc comment fonctionne cette chaîne ici. Tu peux voir, non ? Il s'agit donc d'une question de chaîne. Maintenant, vous avez également deux cordes que vous voyez ici. Donc, vous pouvez vraiment dire « laissez faire ». Alors permettez-moi de dire engourdissement à chaîne ou laissez-moi le copier en fait C'est bon. Je vais juste copier tout ça en fait. OK. Et ici, je vais l'appeler comme tel. Il y en a aussi un ici. Cela en a également un. J'en ajouterai un à la fin. OK. Et au lieu d' une chaîne ici, je peux dire numb, tot, to string OK. Comme ça. Et pour Bool aussi, je dirais bool, tot, à une chaîne comme celle-ci Et je vais voir si c'est le cas. Vous pouvez donc voir que le résultat est le même. OK. Donc, soit vous pouvez utiliser deux chaînes ici, soit simplement une chaîne de cette façon. accord ? Maintenant, parlons de chiffres, d'accord ? Donc, si vous avez une valeur dans une chaîne, disons, SDR num. D'accord, tu ne peux pas l' utiliser pour les calculs. Disons que vous en avez quatre, cinq, six ici. OK ? Vous ne pouvez pas l'utiliser pour des calculs. Vous voudrez peut-être le convertir explicitement en nombre afin de pouvoir l'utiliser. C'est bon. Supposons que vous ayez également huit valeurs de tartes décimales Je dirais que le SDR flotte ici. OK, ou tu peux dire, appelle-le décimal, comme tu veux Et disons que c'est 12h55, par exemple. C'est bon. Vous pouvez prendre n'importe quel nombre aléatoire. OK. Jetons donc d'abord un coup d'œil au chiffre. OK ? Vous pouvez donc dire « Let SDR to num over here ». OK ? Tu peux dire un chiffre. Vous pouvez voir le nombre, et vous pouvez transmettre SDR num Sorry, not float, STR, num. OK. Comme ça. OK. Maintenant, laissez-moi imprimer la valeur ici ainsi que le type. OK. Je vais donc le copier et le coller ici. Et si je sauvegarde ceci, vous verrez que 456 est le résultat, et celui-ci est de type numéro maintenant. C'est bon. Cela a donc été converti en nombre, comme vous pouvez le voir. OK ? Maintenant, je peux dupliquer cette ligne, dupliquons cette ligne et voyons un exemple avec parse int ici Donc, si j'utilise parse int, vous pouvez dire int ici, d'accord, STR à int et je le remplacerai par parsint et je l'enregistrerai Maintenant tu peux voir que c'est à nouveau un chiffre, d'accord ? Il s'agit donc en fait de convertir cette chaîne en un entier. OK ? Maintenant, que se passe-t-il si vous ajoutez du SDR, que vous flottez ici ? OK. Si vous ajoutez STR float, vous verrez qu'il tronque cette partie décimale Vous pouvez voir que seulement 12 sont en cours d'impression. La version 12.55 n'est pas imprimée. OK ? C'est donc utile si vous voulez un nombre entier, non ? Mais à quoi ressembleraient les choses si vous vouliez également conserver les décimales vouliez également convertir en nombre et conserver les décimales pour OK ? Parce qu'il y a une perte de données, non ? La valeur décimale est perdue. C'est donc là que le flotteur clairsemé entre en scène. Donc, ce que vous pouvez faire, c'est me laisser dupliquer ceci ici, STR pour flotter. Par ici. Et je vais le reconstituer ici, et je vais voir si c'est le cas. Au lieu de parse end, je dirais parse, float Si je le sauvegarde, vous verrez 12h55. La valeur décimale est donc également préservée et elle est imprimée sous forme de nombre OK ? Il y a donc trois choses à retenir : le nombre, qui est utilisé pour convertir une chaîne en nombre, analyse int, qui est utilisé pour convertir toute valeur que vous avez en un entier Ensuite, vous avez parse float, qui peut vous aider à obtenir la valeur complète ou stocker la valeur entière avec le nombre décimal OK. Maintenant, il y a une chose que je veux mentionner ici, si vous essayez de convertir une chaîne en nombre, cela ne fonctionnera pas. Vous pouvez donc dire SDR ou non valide ou num non valide. Non valide, num. Disons que parce que cela va être invalide, je le sais. Disons que je dis un chiffre. Je ne créerai pas de variable ici, mais j'aurai directement un numéro et je pourrai dire bonjour. OK. Maintenant, ce n'est pas du tout valide, d'accord ? Vous pouvez donc le prendre et l'imprimer ici. Mais ce n'est pas valide, d'accord ? Si je sauvegarde ceci, vous verrez que ce n'est pas un nombre, NN ne signifie pas un chiffre, NN, et le type est un nombre, d'accord ? Mais la valeur est perdue. C'est NAN. C'est bon. Donc oui, si vous effectuez un typage ou une conversion de type en nombre, assurez-vous que la source contient réellement un numéro valide OK ? Si j'y ajoute des caractères en quatre, cinq, six, je dis quatre, cinq, six, alors ce sera à nouveau NN parce que ce n'est pas un nombre valide, n'est-ce pas ? J'espère que cela a du sens. OK ? Maintenant, parlons de booléen ici. Nous allons donc créer zéro OK. Et je vais aussi laisser une chaîne booléenne non vide ici ou supprimer une chaîne booléenne d'ici. C'est de plus en plus long. OK. Ensuite, je passerai le bonjour. OK. Et voyons comment vous pouvez utiliser le booléen Vous pouvez dire « laissez zéro » à « booléen ». Convertissons donc d'abord zéro en booléen. Je vais dire booléen ici, et je dirais zéro. OK. Quel en sera le résultat selon vous ? Permettez-moi de comprendre cette déclaration, le verrouillage de la console. Je vais remplacer ce nombre invalide par un booléen zéro, et vous verrez faux Donc, zéro se traduit en fait par faux lorsqu'il est converti en booléen Et maintenant, d'accord, j'ai ajouté zéro accidentellement, ça devrait être zéro. OK ? Le résultat sera le même. Mais si vous convertissez le zéro en un, cela vous donnera la vérité. OK ? Si vous dites un, cinq, six, n'importe quel nombre aléatoire, cela restera vrai. Il n'y en a donc que 40 par ici. OK. J'espère que cela a du sens. C'est bon. Maintenant, si vous avez cette chaîne ici, que se passera-t-il si vous essayez de la convertir en Poulin, d'accord ? Alors permettez-moi de le copier ici. OK. Je vais passer à la ligne suivante. Et au lieu de zéro à booléen, je dirais chaîne à chaîne booléenne à booléen Et ici, je vais avoir une chaîne non vide. OK. Et je vais copier la chaîne en booléen et je l'ajouterai ici. Voyons quel en est le résultat. Tu verras que c'est vrai. OK ? Donc, toute chaîne non vide que vous avez et si vous essayez de la convertir en booléen, vous verrez true comme sortie OK ? Ainsi, les valeurs telles que zéro ou chaîne vide, null, undefined et NN sont fausses, ce qui signifie qu'elles sont converties en Donc, même à la place de zéro, si vous avez une chaîne vide, chaîne vide. OK, ce sera faux. Tu peux voir. Si c'est une fin, disons, une fin. Et si je le sauvegarde, ce sera faux. OK ? S'il est nul, il redeviendra faux. OK. Mais je vais m'en tenir à zéro. OK. Et tout le reste, sauf zéro, chaîne vide, null, NN non défini, ce sont toutes de fausses valeurs Si elles sont converties, elles se traduiront en faux dans Bolin, et tout le reste est vrai, n'est-ce pas ? J'espère donc que cela a du sens quant à la façon dont les conversions de type fonctionnent explicitement dans Jascript OK. OK. C'était une erreur ici. J'espère que cela vous sera utile. 25. Projet : créer un générateur de couleurs: Construisons donc un générateur de couleurs en utilisant JavaScript en HTML, n'est-ce pas ? Je suis donc ici sur le point d'index HTML, j'ai donc ce fichier point d'index HTML et point d'index Hs. Il s'agit d'un fichier JavaScript dans lequel résidera notre code Ja Script. Je vais ajouter un autre fichier, que j'appellerai «   styles point Nous allons donc embellir un peu, pas grand-chose, mais nous allons donner à notre page Web un aspect un peu décent, n'est-ce pas ? pas grand-chose, mais nous allons donner à notre page Web un aspect un peu décent, n'est-ce pas Alors maintenant, ici en HTML à points d'index , je vais taper exclamation, et je vais juste obtenir le code standard d'une page HTML C'est bon. Maintenant, vous pouvez voir que j'ai un appareil et tout le reste ici, d'accord. Et ici, je vais ajouter le titre du document ou le titre de la page Web, non ? Et ce titre sera un générateur de couleurs aléatoires. Quelque chose comme ça. C'est bon. Maintenant, ici sous le corps, je vais avoir la balise H one parce que c'est là que je vais commencer à écrire le code. Je vais donc dire générateur de couleurs aléatoires. Et en fait, au lieu de taper, je peux directement l'obtenir. OK. Ceci est fait, et le fonctionnement de cette application est nous aurons un bouton qui générera des couleurs aléatoires chaque fois que vous cliquerez sur le bouton. C'est bon. Nous avons donc besoin de ce bouton. Je vais donc ajouter un bouton ici. Vous pouvez voir cet élément de bouton. C'est bon. Je vais le fermer et j' appellerai ce bouton « générer de la couleur ». OK. OK. C'est fait. Et puis nous devons également afficher les codes couleur, d'accord. Maintenant, la couleur générée sera en code xassimol Ce sera un code Exad assimil que nous pourrons également afficher à l'utilisateur. C'est bon. Nous allons donc afficher le code couleur. Je vais dire Ptag ici. OK. Et nous allons faire imprimer un code couleur ici. C'est fait, non ? Maintenant, nous devons également charger le JavaScript. Donc, ce que je peux faire ici, c'est charger le fichier JavaScript. Nous avons donc le fichier Ja Script créé sous la forme index point qs. Je vais donc sortir de la balise body ici et je vais dire script SRC, et je vais dire index point s ici Et je vais fermer la pile. C'est bon. Aucun lien n'a encore été créé pour le CSS, mais nous l' examinerons sous peu. C'est bon. Je vais fermer cette console. Nous n'avons plus besoin de voir la console, non ? Maintenant, si je vois ceci, d' accord, cela devrait réellement afficher ce code HTML en particulier ici. Vous pouvez voir le générateur de couleurs aléatoires et générer de la couleur. C'est bon. Maintenant, nous allons passer au point d'index JS, à droite. C'est ici que nous allons écrire le script Java qui fonctionnera avec ces éléments HTML et y ajoutera de la vie. Donc, si vous cliquez sur Générer la couleur comme je l'ai dit, cela devrait générer un nouveau code couleur et l'arrière-plan de cette page Web entière devrait être défini sur ce code couleur particulier, et nous devrions également afficher le code couleur et nous devrions également afficher le code couleur ici à l'utilisateur. C'est bon. Donc, ce que je vais faire, c'est ici si tu viens. Voilà, nous avons ce PTAC. Nous avons certains éléments et nous devons également afficher le code couleur ici. Ce que je vais faire, c'est lui attribuer un identifiant, car je dois le référencer à partir du JavaScript. OK ? Je vais donc le coder sous forme de code couleur ici. Quelque chose comme ça. OK, et je vais le sauvegarder. OK. Et laissez-moi simplement supprimer ce code d'ici. OK ? Je vais juste prendre de la couleur. Je vais venir ici. OK. Et ce que je vais faire, c'est dire document. J'ai donc besoin de cette balise P là où nous voulons afficher la couleur. Je vais donc dire document point get element by ID. Je récupère donc l'élément par identifiant à partir du document. Maintenant, je vais évoquer l'idée de l'élément. L'idée de l'élément est donc une couleur ou un code de trait d'union de couleur, peu importe ce que vous avez ajouté là-bas OK ? Et nous pouvons l'attribuer à une variable, d'accord ? Je peux donc dire couleur et paragraphe, d'accord, par. Et je vais enregistrer ça. OK ? Nous avons donc maintenant accès au tag P, d'accord ? Et si vous le souhaitez, vous pouvez choisir d'enregistrer les points sur console ici. Ou au lieu de faire un journal des points sur la console, je dirais que vous pouvez dire Color para Tot du contenu du texte, et vous pouvez ajouter un test ici. OK. Et si vous sauvegardez ceci, vous devriez voir test être ajouté ici, d'accord ? Cela signifie que vous pouvez accéder à la balise de paragraphe, qui est une balise P en utilisant cet identifiant, d'accord ? Et si vous survolez ce document point get element by ID, vous pouvez voir les renvois faisant référence au premier objet avec la valeur spécifiée de l'attribut ID L'attribut ID est donc la couleur dans ce cas. OK ? Et nous sommes en mesure d'accéder à l'élément D. Maintenant, vous pouvez également avoir un code couleur par défaut affiché ici. OK ? Je peux donc ajouter un code couleur sous forme de hachage Les codes couleurs commencent donc par le hachage, et je peux dire FF FF, FF OK. Vous pouvez donc ajouter un code couleur par défaut qui s'affiche réellement lors du chargement de la page. C'est bon. Maintenant, une fois que vous avez fait cela, vous devez cliquer sur ce bouton. Donc, en cliquant sur ce bouton, le code couleur devrait être généré, et la façon dont nous allons le générer est d'avoir une génération aléatoire. C'est bon. Donc, ce que je vais faire, c'est venir ici et nous devons avoir accès au bouton, car en cliquant sur ce bouton, du code devrait s'exécuter, n'est-ce pas ? Donc, ce que je vais faire ici, c'est dire que je vais lui attribuer un identifiant ici, et un identifiant peut être généré. OK. E n'y sera pas. OK. C'est là et je vais venir. Je vais le copier et je vais voir le document point Get element by ID se générer ici. OK. Maintenant, une fois que nous aurons accès au bouton, je vais dire qu'il suffit de cliquer sur ce bouton. OK. Nous devons donc indiquer de cliquer sur ce bouton. Je dois ajouter une fonction ici. OK. Voici maintenant la syntaxe pour définir une fonction en JavaScript. OK. Et nous allons définir une fonction. Maintenant, dans ce cadre, ce qui se passe, c'est ce bloc de code. Cette fonction signifie que bloc de code que nous définissons ici est exécuté lorsque l'on clique sur le bouton OK ? C'est assez simple. Je vais dire « laisser » et une couleur aléatoire sera générée. Maintenant, comment allons-nous générer une couleur aléatoire ? Parce qu'il s'agit d'une couleur aléatoire que nous afficherions également. Maintenant, pour générer cette couleur aléatoire, nous allons utiliser une formule. Maintenant, chaque fois que vous représentez des codes couleur, cela commence par un hachage, puis vous avez une valeur hexadécimale comme FF, CC, FF, quelque chose comme ça OK ? Nous devons donc obtenir cette valeur hexadécimale. Au hasard, hachage, vous pouvez l' ajouter manuellement, non ? Donc, ce que je ferais, c'est de venir ici. Nous allons utiliser la formule, d'accord ? Et nous allons utiliser ce l'on appelle un objet mathématique. OK ? Je vais donc dire mathématiques ici et je vais dire qu'un point maintenant dans mathématiques ou un objet mathématique en JavaScript donne accès à de nombreuses fonctions en JavaScript. L'une des fonctions est aléatoire. Maintenant, en utilisant cette fonction, vous pouvez générer des nombres aléatoires. OK ? Donc, si vous passez la souris dessus, vous verrez un résultat pseudo-aléatoire de 0 à 1 OK ? Maintenant, chaque fois que cela est exécuté, il génère un nombre aléatoire. Alors laisse-moi te montrer ça ici. OK ? Donc, Alco to Console, vous pouvez voir des calculs tendus et aléatoires ici. Oups, Mt taut, random, quelque chose comme ça, et vous pouvez générer un nombre aléatoire Donc, chaque fois que vous l'exécutez, il va générer un nombre aléatoire. OK ? Maintenant, ce que nous allons faire, c'est utiliser cela et générer un nombre hexadécimal. Comment ? Je vais donc générer ce nombre aléatoire, d'accord ? Permettez-moi donc de copier ce nombre aléatoire qui est généré. Il s'agit donc d'un nombre aléatoire qui est généré. Je vais vider la console, et je vais multiplier ce nombre aléatoire par un nombre. Maintenant, ce nombre est de 1627 à 15. Maintenant, pourquoi est-ce que je le multiplie par ce nombre ? Si je le multiplie par ce nombre, c'est parce qu'il s'agit de la valeur maximale OK ? Ce nombre représente la valeur la plus élevée possible ou maximale pour une couleur 24 bits, ou en hexadécimal. C'est donc avec cela que je vais le multiplier. OK. Et puis, une fois la multiplication terminée , nous obtenons un résultat. Ensuite, je vais utiliser Math Dot Floor. Maintenant, qu'est-ce que Math Dot Floor ? J'ai donc copié cette valeur après multiplication. Qu'est-ce que Math Floor ? Matt Floor est une fonction de sol qui vous donnera donc si j'ai une valeur décimale de un, quatre, cinq, six, le résultat sera un OK ? Maintenant, si vous en avez un, quel que soit le nombre que vous avez, il vous donnera la plus faible valeur décimale OK ? Donc, si vous avez 1,4 4636, il va éradiquer ou ignorer cette valeur ici. L'un d'eux est donc le résultat. Maintenant, si je le colle ici, cela me donnera, bien sûr, huit fois deux, 8937 ici D'accord ? Ensuite, je vais prendre cette valeur, cette valeur ici et je vais la convertir en représentation hexadécimale d'une chaîne de caractères. Pour une chaîne hexadécimale, c'est ce que je peux dire. C'est bon. Je vais donc dire que ce nombre est un point de deux chaînes, et je vais passer 16 comme argument, ce qui signifie que j'ai besoin d' une valeur décimale exa D'accord ? Cela m'a donc donné une erreur ici. OK. Laisse-moi voir. OK, donc pour que cela fonctionne, il faut que ce soit sous forme de chaîne. Je vais donc le copier à nouveau. Je vais dire « hash » ici. Je vais le reconstituer. OK. Ensuite, je vais dire à string et laissez-moi essayer ce 16 ici. Voyons voir. OK, jeton non valide ou inattendu. 1 seconde Laisse-moi réessayer. Cela devrait donc fonctionner idéalement. OK, donc ça marche. Vous pouvez le voir, pour une raison ou une autre, cela ne fonctionne pas sur la console, d'accord. Mais laissez-moi vous le montrer sur la carte d'identité elle-même, non ? Nous avons donc dit que nous allions obtenir un nombre aléatoire. Je vais le multiplier par 16777, OK, à un, cinq Oups, ça doit être cinq. C'est bon. Et tout ça, tout ça doit être dans une paire de bretelles rondes, puis je vais le passer au sol ici. OK. Nous obtenons donc la valeur du flux. C'est bon. Maintenant, permettez-moi de passer au journal par points de la console ici. Au lieu d'un journal de console, ce que nous pouvons réellement faire, c'est afficher dans Coal Para. La couleur du contenu du texte est égale à la couleur aléatoire. D'accord ? Nous pouvons donc voir le résultat ici même. C'est bon. Maintenant, si je rafraîchis, laissez-moi voir ce qui se passe ici. Il sera donc déclenché si vous cliquez sur Générer la couleur. Vous pouvez donc voir que ces numéros sont générés. OK. Mais pour le moment, ce n'est pas la représentation exadimale, Donc, ce que je ferais ici, c'est de venir ici. Je dirais qu'on a appris à faire des chaînes ici, et je dirais une valeur de 16, quelque chose comme ça. Et je garderais ça. OK ? Je dirais générer de la couleur. Vous pouvez maintenant voir que ces valeurs sont générées. Vous pouvez voir ces valeurs d'examen. D'accord ? Vous devez le préfigurer avec du hachage D'accord ? Donc je vais dire « oui » ici, quelque chose comme ça, et je vais dire « OK ». Alors maintenant, vous avez des codes couleur générés ici. Je ne suis pas sûr que le blanc ne fonctionne pas sur la console. Si tu le sais, merci de me le faire savoir. C'est bon. Mais cela fonctionne parfaitement ici , comme vous pouvez le voir, d'accord. Maintenant c'est fait, d'accord ? Et ce que nous devons faire, c'est afficher la couleur aléatoire. Ce que nous devons également faire, c'est changer l'arrière-plan en fonction de la couleur générée. Je peux donc dire document, tot body, et je peux dire tot style, tot, et je peux obtenir la couleur de fond. Oups. Couleur de fond ici. Et la couleur de fond sera une couleur aléatoire. Et si je garde ça, tu peux voir Fun, non ? Donc, avec du JavaScript simple, combien de lignes de script Java avez-vous écrites ? Même pas une, deux, trois, quatre, cinq, cinq, six lignes de code, vous êtes capable générer autant de magie. C'est bon, tu peux voir. Ainsi, avec cette formule, nous générons un code couleur que nous affichons à l'utilisateur, et nous le définissons également comme couleur d'arrière-plan. Maintenant vient le style point CSS, non ? Donc ce que je vais faire, c'est que nous allons venir ici. OK, et commencez à vous coiffer ici. OK. Je vais donc dire famille de polices ici. Et j'ajouterai Found Familia en tant qu'Aerial. OK. Et on peut dire alignement du texte. Je vais aligner le texte au centre. OK, marge ici, marge, on peut la mettre à zéro. Oups. Et puis, par ici, je vais prendre du rembourrage Je vais avoir un rembourrage de 20 pixels. OK, et j'ai la couleur de fond. Je peux avoir une couleur de fond à hacher ici et iFiFi quelque chose OK. Donc oui, c'est le premier CSS. D'accord, mais nous devons également lier le CSS au fichier HTML. Ce n'est qu'alors que cela reflétera, vrai, ce que nous n'avons pas fait. Donc, ce que je peux faire, c'est ajouter un lien ici. RL est égal aux feuilles de style. OK. Feuille de style ici, et je peux avoir HRF. Et ce sera styles point css, et je vais le fermer. Quelque chose comme ça. D'accord ? Vous allez donc maintenant voir le CSS appliqué ici, d'accord ? Maintenant, le corps est prêt, d'accord. Nous pouvons le styliser un peu plus. OK. Il a une étiquette. Ce que je peux faire, c'est ajouter de la couleur ici. La couleur peut être, d'accord, au lieu de cela, je peux en ajouter 333 ici. OK. Ensuite, nous devons styliser le bouton. Quel style peut-on donc donner au bouton ? OK. Donnons-lui donc une couleur bleutée. J'ai donc un code couleur en tête, donc je peux dire que je peux avoir du bleu ici, une sorte de couleur bleue, vous pouvez voir. OK. Faites maintenant défiler l'écran vers le bas. Couleur : Oups. La couleur est le blanc, 55. OK. Et une frontière, je ne peux pas dire qu'il n'y en a aucune ici. OK, Boter est parti. Nous pouvons maintenant ajouter du rembourrage pour lui donner un aspect décent, donc je peux dire dix pixels et 20 pixels, enregistrez-le. OK ? Ça a l'air décent. Vous pouvez également réduire le rembourrage si vous le souhaitez. OK. Marge. Je peux avoir dix pixels de marge. OK. Et je peux avoir une taille de police de 16, disons. OK. Ou nous pouvons avoir Cursor, pointeur ici. OK, rayon frontalier. OK, le rayon de la bordure peut être de cinq pixels ici. OK. Et puis je peux avoir une transition ici, une transition de couleur de fond. 0,3 seconde OK. OK. Donc ça y est. Vous pouvez voir le CSS s'appliquer, d'accord ? Et si tu zoomes un peu. Vous devrez donc zoomer un peu, d'accord. Voici donc le bouton CSS. Ou vous pouvez aussi faire survoler le bouton, d'accord ? Donc, bouton. D'accord, H. D'accord. Et ici, vous pouvez dire la couleur de fond, et vous pouvez ajouter du bleu foncé. OK. Vous pouvez voir que le CS est en action. C'est bon. C'est donc chose faite. Vous pouvez même avoir l'écran sur lequel vous affichez, vous affichez réellement ce code couleur, n'est-ce pas ? Vous pouvez donc également obtenir ce style. Donc, j' appuie accidentellement sur autre chose. OK, donc nous l' affichons ici, en couleur. OK. Donc, ce que je ferais, c'est de venir ici. Couleur Asta. Je vais comprendre, je vais faire référence à cet identifiant, et je dirais que la taille de police de vous pouvez dire 24 ici. OK, le poids de la police est en gras ici. Vous avez accès au gras. OK. Et tu peux dire couleur ici. Couleur, tu peux ajouter, OK. Tu peux juste en garder 333. Vous pouvez le voir ici. OK. Et puis vous pouvez avoir une marge et une marge de 20 pixels et 100. OK. C'est fait. Maintenant, oui, c'est ce que c'est. Je ne pense pas que nous devrions ajouter « OK, donc c'est fait, et nous pouvons avoir plus si vous le souhaitez ». Mais pour le moment, nous allons nous arrêter ici, d'accord ? C'est à peu près ça, non ? Et c'est un générateur de couleurs très simple. Vous pouvez voir comment, à l'aide d'un simple JavaScript, à peine cinq ou six lignes de code, nous avons pu donner beaucoup de vie à notre page Web statique, n'est-ce pas ? Donc oui, vous pouvez même choisir d'utiliser le vent arrière si vous le souhaitez Mais oui, j'ai juste choisi d'écrire un peu de CSS brut, d'accord J'espère donc que cela vous donnera un aperçu de la façon dont vous pouvez utiliser les sélecteurs ici Et comment ajouter des écouteurs aux boutons et comment exécuter un morceau de code après avoir ajouté écouteur à votre code JavaScript C'est bon. Donc oui, j'espère que cela vous sera utile, et j'espère que vous avez pu suivre. 26. Projet : construire un convertisseur de température: Voyons donc comment vous pouvez créer une application de conversion de devises. C'est bon. Nous allons donc travailler sur trois fichiers ici, comme index point has, index point HTML et style point CSS. C'est bon. Nous allons donc commencer à écrire le code dans le fichier HTML. Maintenant, toute cette application va avoir une liste déroulante, qui aidera les utilisateurs à sélectionner endroit où ils le souhaitent ou dans quelle unité souhaitent convertir la température, n'est-ce pas ? Ensuite, nous aurons également une zone de texte dans laquelle l'utilisateur pourra entrer la température qu'il souhaite convertir. Et en plus de cela, nous aurons un bouton de conversion, lequel l'utilisateur pourra cliquer pour convertir la température. Alors allons-y. Je vais juste avoir une exclamation ici et je vais juste préparer un code standard ici C'est bon. Maintenant, une fois que nous aurons le code standard, je mettrai à jour le titre, donc je parlerai Convertisseur ici. OK. Et puis, dans le corps, j'aurai à nouveau l'étiquette Hone. Je vais donc simplement le copier entièrement, et je vais simplement le renommer en H one C'est bon. Vous avez donc un convertisseur de température. OK. Oui, tu peux voir. Alors maintenant, ce que nous devons faire, c'est ajouter une entrée. D'accord ? L'entrée est donc de type texte ici. OK, alors tapez du texte, et j'aurai également un espace réservé Je dirais d'entrer la température. OK. Et nous allons fermer ça. Ajoutons également un élément d'identification ici. Donc, l'identifiant pour cela peut être Oups ici, donc l'identifiant pour cela peut être la température ou la température, comme vous le souhaitez Je vais juste faire court pour ce qui est de la température. OK. Si vous voyez, vous avez ce champ de texte sur les températures intercalaires ici. C'est bon. Maintenant c'est fait. Nous avons maintenant besoin d'une sélection, qui est une liste déroulante. Je vais appeler ça. Je vais attribuer cet identifiant d'unité. Et dans ce cadre, je vais avoir choix. Par ici. OK. Maintenant, l'option sera de type value et la valeur est C. Maintenant, l'affichage est Celsius. Quelque chose comme ça. Et si tu viens ici, tu vas voir Celsius là-haut. Je vais essayer de le dupliquer ici. Au lieu de C, je vais avoir F ici et je vais prendre Farin Fahrenheit, quelque chose D'accord ? Donc, si vous venez ici maintenant, vous allez voir des degrés Celsius et Fahrenheit, ce qui est suffisant C'est bon. Maintenant, en fonction de la sélection, C et F seront transmis à l'application ou à n'importe quel sélecteur ou endroit où vous passez la valeur Maintenant, ici, tu peux avoir un bouton. OK. Je vais ajouter un bouton de conversion ici, l'ID est converti et le texte Aad est converti ici D'accord ? Ensuite, nous devons également afficher la valeur convertie, donc je dirais la température convertie ici. Quelle est donc la température convertie ? Je vais ajouter une plage pour afficher la température. D'accord ? Je vais donc dire span over here et nous aurons zéro au départ, et je peux ajouter un identifiant, convertir quelque chose comme ça. OK. C'est fait, vous pouvez donc voir ici. Voici à quoi ressemble l'interface en ce moment. C'est bon. Maintenant, nous pouvons rapidement le lier à notre application, donc je vais parler de script ici. Je vais dire SRC et je dirais index s, et je vais le fermer. Nous allons également lier la partie CSS. Je vais donc dire Link RL et je dirais feuille de style. OK. Et je dirais que je vais ajouter le HRF ici car les styles parsèment le CSS et LCLoss. D'accord ? Donc c'est fait jusqu'à présent tellement bien, vous pouvez voir l'application. Nous devons maintenant commencer par la partie JavaScript, c'est vrai. Alors maintenant, ce que nous devons faire, c'est d'abord au clic que le code doit être exécuté, n'est-ce pas ? Nous devons donc obtenir ce bouton. D'accord ? Nous pouvons donc dire «   document point get element by ID », car nous utilisons l'identifiant ici. D'accord ? Et je peux vous dire de vous convertir ici, non ? Et que devrait-il se passer ? Donc, en cliquant dessus, nous voulons exécuter quelque chose. Je vais donc dire qu'il suffit de cliquer ici pour exécuter une fonction. Une fonction n'a pas de nom, elle n'a aucun type de paramètre, et je l'aligne d'abord avec un point-virgule Et maintenant, dans cette fonction, nous pouvons ajouter ce que nous voulons, le code que nous voulons afficher ou le code que nous voulons exécuter simplement en cliquant sur un bouton. Je vais donc d'abord créer quelques variables ici, la température, et je vais également obtenir l'unité. Maintenant, nous devons d'abord obtenir la température ainsi que l'unité. OK. Je vais donc dire document, taut, get element by ID, et nous devons obtenir une valeur temp taut Maintenant, pourquoi Temp dot value. Donc voilà, c'est Temp. Nous obtenons donc d'abord la valeur saisie par l'utilisateur. Et puis nous devons également obtenir l'unité sélectionnée par l'utilisateur, n'est-ce pas ? Donc, ce que je ferais, c'est de le copier ici ou d'attendre une minute, nous devons le terminer. La valeur que nous recevrons ici sera au format chaîne. Je ne veux pas utiliser de chaîne, nous devons donc également préserver les valeurs décimales Alors, quel est le bon choix ici ? Oui, comme vous pouvez le voir, j'utilise parse float. Pourquoi est-ce que j'utilise parse float ? Parce que l'utilisateur peut entrer une valeur décimale. J'ai aussi besoin de la valeur décimale. Pour plus de précision. C'est bon. Je vais envoyer ce document point Get Element ID ici, et je vais faire venir l'unité ici. OK, donc ça doit être dans Ça doit être sous forme de chaîne. Je vais donc dire unité, quelque chose comme ça. OK. C'est fait, jusqu'ici tout va bien. OK. Et une fois que nous avons l' unité et la température, nous pouvons réellement écrire du code sur la base duquel la conversion aura lieu, n'est-ce pas ? Maintenant, quel devrait être ce code ? Nous devrons donc utiliser la prise de décision ici, non ? Donc, si l'utilisateur sélectionne farenhight. Une formule est appliquée. Si l'utilisateur sélectionne Celsius et clique sur Convertir, une autre formule est appliquée. Ainsi, en fonction de ce qui est sélectionné ici, l'application de la formule change. C'est bon. Alors laissez-moi d'abord vous montrer la formule, d'accord ? La formule est donc de convertir les degrés Celsius en degrés Fahrenheit, nous dirons la température en 9/5 ici plus 32 C'est une formule que nous allons utiliser pour convertir C en F. Ensuite, pour convertir les degrés Fahrenheit en degrés Celsius, nous allons dire température -32, et nous allons dire 9/5. C'est bon. Ces deux formules sont les suivantes. Permettez-moi également de le mentionner ici. Cela convertira F en C. D'accord ? Maintenant, comment savoir quelle formule nous voulons exécuter, n'est-ce pas ? Donc je vais le dire. Donc, ce que je vais faire, c'est dire si l'unité est égale à C. Donc l'unité I est C, n'est-ce pas ? Donc, si l'utilisateur a sélectionné Celsius ici en haut vers le bas, il devrait se passer pour convertir C en F, n'est-ce pas ? Parce qu'alors nous devrions l' exécuter, non ? Ou si ce n'est pas vrai , nous pouvons l'exécuter . C'est bon. Et nous pouvons avoir cette partie dans la paire de bretelles rondes et même cette partie dans la paire d'accolades rondes pour plus de clarté. D' accord ? Quelque chose comme ça. OK. Et puis je peux assigner la sortie de celui-ci à convertir. La température ici, qui est une variable. OK. Et si je viens ici. Oups. Donc, si je viens ici, je le peux pour que nous ayons cette température convertie. Nous pouvons afficher cette température convertie. Alors, comment vais-je l'afficher ? Je vais copier ce texte, et nous devons l'afficher dans ID converti, non ? Est-ce l'identifiant que nous donnons ? OK, donc l'identifiant est converti, oui, nous devons l'afficher dans le span, non ? Donc point converti. Je parlerai du contenu du texte et du point temporaire converti Je peux simplement afficher la température convertie. Voyons quelle est la valeur que nous voyons. Disons que la température est de 100, je sélectionne Celsius. C' est Celsius, non ? Je dois donc le convertir en Fahrenit. Donc ça fait 21, deux. OK. Maintenant, si vous voulez vérifier cela, vous pouvez simplement rechercher Celsius à Fahrenit sur Google et vous trouverez cette calculatrice sur Google lui-même, Google Search Vous pouvez donc entrer 100 et vous pouvez voir le résultat comme un, deux. C'est bon. Nous pouvons faire de même pour Fahrenit si vous sélectionnez Fahrenit La température en degrés Celsius est de 122,4, et vous pouvez le vérifier ici J'ai Google maintenant Fahrenit à Celsius. C'est donc de Celsius à Fahrenit. C'est de loin Celsius. Donc, si je dis 100, je comprends, accord, donc il y a quelque chose d'une seconde. Il y a donc 100 degrés Fahrenit et je suis en train de convertir OK, donc ma conversion semble fausse, donc il devrait faire 37 degrés Celsius, Mais j'en ai 122. Donc, si vous venez ici, il y peut-être quelque chose qui ne va pas dans la formule. OK, donc c'est impossible. OK, donc ça ne devrait pas être neuf par cinq, ça devrait être cinq par neuf ici. Maintenant, si vous venez, vous trouvez une conversion de 100 degrés Fahrenheit, vous pouvez voir 37,77 78 OK. Alors maintenant c'est correct. C'est bon. Il y a eu une erreur dans la formule, alors assurez-vous d'utiliser cette formule, n'est-ce pas ? Alors maintenant, ça ne s'annonce pas bien, non ? C'est 7777, un lot de sept, puis huit. Je voudrais donc le déplacer vers décimales fixes ou une position fixe de deux places Donc, ce que je peux faire ici, c'est que je peux dire convertir une température, tendue, en fixe, et je peux dire deux Vous pouvez voir, le nombre de chiffres. Cela vous permet donc de mentionner le nombre de chiffres après la virgule décimale et doit être compris entre 020 et 20, je suis désolée, inclus Donc, si je sauvegarde ceci, et si vous venez ici, si je saisis 100 degrés Celsius, c'est bien. OK. Je vais donner zéro, zéro. Si vous ajoutez Fahrenheit, vous verrez 37,78. C'est bon. C'est ainsi que fonctionne le convertisseur de température de manière assez simple, d'accord. Mais avec l'aide de JavaScript, nous pouvons faire beaucoup de choses, n'est-ce pas ? Maintenant, jetons un coup d'œil au style ici. OK. Nous garderons le style très simple ici. Je vais juste en taper quelques-unes. Je vais juste taper quelques styles, d'accord, comme style, je vais juste taper quelques éléments de style. Je vais donc simplement ajouter quelques éléments de style ici. Donc, pour la famille, disons comme celui-ci. OK, ligne de texte. Je vais garder le centre et la marge à zéro. Et je dirais que le rembourrage est de 20. Probablement. OK. Et j'ajouterai probablement de la couleur de fond. Nous pouvons ajouter un arrière-plan sous la forme, disons, d'Azure. Voyons à quoi ça ressemble. OK. Est-ce que ça a l'air bien ? C'est bon. Azure a l'air décent. Courier a également l' air décent, d'accord ? Ou vous pouvez mettre à jour la famille de polices si cela ne vous plaît pas, d'accord ? Ainsi, la famille de polices peut être, vous pouvez sélectionner le capteur Alvita aérien Tu peux voir. Cela va également. En fonction de votre choix, vous pouvez choisir la famille de polices. Viens voir H one par ici. OK. Maintenant, pour H one, je vais voir la couleur. Quelle est la couleur ? Vous pouvez sélectionner probablement descendre et vous pouvez avoir une couleur noirâtre. Je peux aussi le mettre à jour, donc vous pouvez le mettre à jour avec quelque chose comme ça. C'est à vous de décider ou vous pouvez vous en tenir au noir ici. Je vais juste m'en débarrasser. Je vais juste rester simple. OK. OK. C'est chose faite. Maintenant, ici, nous pouvons voir la sélection et l'entrée. Je peux donc dire saisie pour taper sous forme de texte. OK. Et pour sélectionner ici. Il s'agit d'un CSS. Maintenant, ici, je peux dire un rembourrage de zéro pixel. OK. Je peux dire qu'il y a une taille de police ici de 16. OK. Alors vous pouvez avoir une marge de dix pixels par ici, d'accord ? Vous pouvez avoir un rayon de puissance de cinq pixels. C'est bon. Vous pouvez avoir une largeur ici d'un pixel, solide, et je dirais hashtg alors vous pouvez avoir une largeur ici de 200 Laissez-nous enregistrer et voir, vous pouvez voir. Cela a un peu changé, non ? Ça a l'air plutôt décent, non ? Vous pouvez ajouter plus de rembourrage si vous le souhaitez. OK. Je peux augmenter le rembourrage à dix, disons. OK. Le rembourrage n'était pas très beau, mais maintenant il a l'air décent, vous pouvez le voir OK. Et maintenant, passons à autre chose, le suivant est le modèle ici. Jetons donc un coup d'œil au modèle, à tout ce que nous pouvons ajouter. D'accord ? Donc, pour le bouton, je vais dire motif ici et faire défiler la page un peu vers le bas. OK. Donc, pour le bouton, nous pouvons dire la couleur de fond, euh, laissez-moi ajouter du bleu. OK. Je peux dire la couleur du blanc, la bordure n'en est pas une. Et je peux ajouter du rembourrage ici, dix pixels, 20 pixels, quelque chose comme ça Et vous pouvez dire police, d'accord, pas police, taille de police. La taille de police peut être de 16 et devrait sembler décente. Nous modifierons cela si ce n'est pas le cas. OK, pointeur du curseur ici. Je peux dire que le rayon de poudre est de cinq pixels, quelque chose comme ça. Et oui, je pense que c'est ça. Si tu viens ici, d'accord, ça a l'air plutôt sympa. Vous pouvez ajouter un effet de survol si vous le souhaitez, d'accord ? Je peux donc dire survoler le bouton. OK, donc le survol du bouton peut être une couleur d'arrière-plan, et je peux dire bleu foncé Viens ici. Vous pouvez voir cet effet, non ? C'est à peu près ça. C'est bon. Et maintenant, vous pouvez ajouter un style pour le PTAC. D'accord ? Je peux dire que la taille de la police et les pixels DIN sont un peu plus grands que ceux du bouton. Et le poids de la police est en gras. Et puis la couleur est 333. Marge de je peux dire 20 pixels et zéro. Si tu viens ici, d'accord ? Maintenant, ajoutons donc ce que nous avons, qui est converti, nous allons ajouter quelque chose à cela. OK. Je vais venir ici et là, le convertir. Donc pour cela, je vais dire couleur. Couleur de « we can say I can a it blue ». OK. Selon vos préférences, vous pouvez indiquer la taille de police. Je dirais gros et solide, audacieux. Voyons à quoi ça ressemble. Donc, vous pouvez voir assez bien, se démarquer. Tu peux le convertir. OK. Voici donc notre convertisseur de température, et la façon dont il a fonctionné est que nous l'avons construit ou que nous avons écrit du HTML, du HTML simple, des balises simples que nous avons utilisées, nous avons créé des liens, comme du JavaScript et du CSS. Dans JavaScript, nous obtenons le bouton de conversion, et nous l'ajoutons au clic Lissner, qui se déclenche lorsque vous cliquez dessus, puis vous obtenez ces valeurs que vous allez récupérer car sur cette base, vous allez effectuer la vous allez effectuer Assurez-vous de le faire, obtenez la valeur de température sous forme de flotteur. Huit. Ensuite, nous convertissons la température à l'aide de vous pouvez voir ici à l'aide d'un opérateur ternaire, n'est-ce pas ? Vous êtes donc en train de vérifier d'abord. C'est une condition. D'accord, vous vérifiez d'abord si l'unité est égale à Celsius. S'il est égal à Celsius, vous devez convertir Celsius en ferrenit Si l'unité actuelle n'est pas le Celsius, si c'est le ferrenit, vous devez convertir le ferrenit Celsius, et voici les formules Et puis vous affichez le résultat converti en coupant les décimales jusqu'à Et puis vous avez ajouté un style de base pour l'embellissement. J'espère donc que vous avez pu me suivre, et j'espère que cela vous a été utile. 27. Littérature de modèle: Il est maintenant temps de commencer à parler modèles littéraux et de comprendre ce qu'ils sont Donc, chaque fois que vous travaillez avec des chaînes, d' accord, comment créez-vous une chaîne, accord ? Désolée pour les casquettes. Vous pouvez créer une chaîne de cette façon pour pouvoir dire, et le nom est égal à W doubles codes, vous pouvez attribuer un nom ici. OK ? Désormais, au lieu de codes doubles, vous pouvez même utiliser un code unique. D'accord, je peux sélectionner le texte et taper un seul code. Donc c'est aussi une chaîne valide ici, d'accord ? Maintenant, c'est une façon de créer des chaînes et une autre méthode consiste à utiliser des modèles littéraux. Maintenant, que sont les littéraux des modèles ? Ils vous permettent donc de travailler avec des chaînes de manière plus flexible et plus lisible. Maintenant, que signifie « plus flexible » et « plus lisible » ? C'est également flexible, non ? Mais c'est une bonne solution pour les cas d'utilisation simples. Maintenant, il y aura des cas d'utilisation dans lesquels vous voudrez peut-être créer, disons, une variable supplémentaire. OK ? Je souhaite créer une autre variable, et je souhaite vous dire bonjour. OK ? Et j'aimerais avoir un nom ici, non ? Je vais donc devoir dire quelque chose comme ça. OK. OK. Maintenant, si je fais un journal par points sur la console ici, je peux dire bonjour. OK. Vous verrez donc Hello Alice ici. C'est bon. Donc, si vous voulez concaténer deux chaînes, vous utiliserez plus ici Maintenant, c'est une solution, mais si vous voulez faire plusieurs sortes de choses, si vous voulez créer une chaîne à la volée et si vous voulez utiliser plusieurs variables lors de la construction d'une chaîne, parce qu'ici nous n'utilisons qu'une seule variable, n'est-ce pas ? Nous n'utilisons pas plusieurs variables. Donc ça va toujours. Mais si vous avez plusieurs variables dans lesquelles vous utilisez plusieurs variables pour construire une chaîne de manière dynamique, cette approche n'est pas du tout facile et elle n'est pas du tout flexible ou lisible. C'est bon. Donc, dans ce cas, vous pouvez utiliser le modèle littéral Je vais donc vous montrer ce que sont les modèles de litière. Nous utilisons donc ici une seule citation, d'accord ? Et nous utilisions le signe plus ici pour ajouter la variable à la fin. Mais ici, lorsque vous utilisez syntaxe littérale d'un modèle, vous pouvez dire bonjour, et j' utiliserai plus haut ici parce que je veux ajouter un nom ici, n'est-ce Et je vais dire mon nom. OK. Le modèle littéral est donc essentiellement une syntaxe que vous utilisez pour créer des chaînes à la volée accord ? Maintenant, ça ne marchera pas. Je n'ai pas enregistré le fichier. Cela ne fonctionnera pas car il s'agit toujours de codes uniques. Donc, pour que le modèle fonctionne littéralement. OK, laisse-moi faire le set de contrôle. Donnez-moi la même syntaxe. OK ? Si je le sauvegarde, vous verrez le nom de Hello Dollar. Cette valeur n'est donc pas remplacée. Pour remplacer cette valeur, je devrai ajouter Bates au lieu d' utiliser un code unique Vous pouvez voir des backticks. Vous avez maintenant une sorte de surlignage syntaxique ici, et vous pouvez voir le nom ici. OK ? Maintenant, cela fonctionne avec n'importe quel type de variable. Si j'ai une variable appelée nom de l'étudiant, d'accord, je peux avoir le nom de l'étudiant ici, et ici je peux dire que chacun est égal à 17. Disons, par exemple. Bonjour étudiant, d'accord ? Et je peux dire que tu l'es. Je peux utiliser So I want to print in age now, non ? Je peux donc dire dollar, âge. OK. Et tu es vieux. OK. Vous verrez donc ici. Bonjour, Alice, tu as 17 ans. Tu peux voir ça ? OK. Si je fais un petit zoom arrière par rapport à l'éditeur, vous verrez ceci s' imprimer. C'est bon. C'est ainsi que les littéraux des modèles peuvent être utiles. Imaginez maintenant que vous fassiez cela à l'aide de l'opérateur de concaténation, l'opérateur plus que nous utilisions D'accord ? Ce n'est pas bien si la chaîne est un peu complexe. Il est construit de manière un peu complexe. OK ? Et ce n'est pas simple. Si vous utilisez plusieurs variables, il n'est pas pratique de créer des chaînes sans l'aide de modèles littéraux OK ? Vous pouvez donc voir à quel point la syntaxe est pratique. Il est également lisible. Donc, la définition ici dit que c'est lisible, non ? Et c'est lisible. Ainsi, toute personne lisant votre code saura ce que vous essayez de faire ici. OK ? Et ID fait également un excellent travail en surlignant la syntaxe ici. Ainsi, dès que vous ajoutez un dollar et ces accolades, cela est mis en évidence dans une syntaxe différente accord ? Alors, modèle, que sont les littéraux du modèle Les littéraux de modèles sont une syntaxe à l'aide de laquelle vous pouvez construire des chaînes et les utiliser de manière plus flexible et, je dirais, plus lisible Et qu'est-ce qu'une syntaxe ? Donc normalement, vous pouvez créer une chaîne en utilisant des codes simples ou des guillemets, n'est-ce pas ? Et vous pouvez concaténer en utilisant l'opérateur plus, n'est-ce pas ? Mais ici, vous utilisez des chauves-souris. Ainsi, lorsque vous utilisez des textes antérieurs, vous dites à Jascript que « Hé, je veux utiliser des modèles littéraux et que cette chaîne peut contenir des expressions Hein ? Maintenant, il s'agit d'une expression dans laquelle la valeur est substituée ici. D'accord ? Il s'agit donc d'une chaîne d'une seule ligne. Maintenant, il existe également des scénarios dans lesquels vous souhaitez créer une chaîne multiligne OK. Permettez-moi donc de vous donner un autre exemple. OK. Je vais ajouter un commentaire ici. Jetons un coup d'œil à Multiline. String par ici. OK ? Je vais donc avoir plusieurs lignes et d'accord, 1 seconde. Je vais avoir une chaîne multiligne, comme ça. OK. Et je peux dire que c'est une chaîne multiligne. OK. Maintenant, au moment où vous faites cela, vous allez avoir des erreurs. Ce n'est pas correct. OK ? Parce que vous ne pouvez pas créer une chaîne comme celle-ci dans le script Ja. Même si vous ajoutez des codes uniques, cela ne fonctionnera pas. Maintenant, comment créer une chaîne multiligne, est-ce pas ? Dans le script Ja. Vous pouvez donc utiliser des modèles littéraux, comme je l'ai dit, et utiliser des backticks Cela ne donnera donc aucune sorte d'erreur, n'est-ce pas ? Et vous pouvez simplement dire Console point log, et vous pouvez imprimer sous forme de chaîne multiligne Vous pouvez donc voir qu'il s'agit d'une chaîne multiligne, n'est-ce pas ? Maintenant, d'accord, maintenant je peux même prendre chaque mot d' une nouvelle ligne, ce qui est également faisable ici Si je l'enregistre, vous pouvez voir qu'il s'agit d'une chaîne multiligne, n'est-ce pas ? C'est donc le pouvoir de, des littéraux de modèles. Et la syntaxe est essentiellement que vous aurez des backticks ici, d'accord, quelque chose comme ça, et vous aurez une chaîne normale, et il peut y avoir des expressions ici OK, donc tu peux dire une expression comme celle-ci. C'est donc une syntaxe, OK, et laissez-moi taper. C'est la syntaxe ici. OK. Voici donc comment nous pouvons l'utiliser. Maintenant, laissez-moi vous montrer plusieurs cas d'utilisation, d'accord. Alors maintenant, nous ne faisons que substituer des variables, n'est-ce pas ? Mais tu peux même avoir des expressions, d'accord ? Vous pouvez donc dire des expressions, et vous pouvez utiliser des expressions dans des littéraux de modèles Huit. Laisse-moi voir. Disons que j' ai laissé E égal à cinq ici. J'ai que B soit égal à dix, par exemple, je dirais que le résultat est ici. OK. Maintenant, je vais faire des backticks Je vais dire la somme de tout, et je vais dire A, et je dirais que B est. Maintenant, quelle est la somme ? OK, nous devons imprimer la somme, non ? Je vais donc dire A plus P. D'accord. Ensuite, je dirai Console point log, et je dirai résultat. Vous verrez donc que la somme de cinq et dix est 15. OK ? Nous intégrons donc maintenant des expressions dans le modèle littéral, Cela fonctionne donc parfaitement, et vous pouvez voir comment les expressions sont également évaluées à la volée et comment la chaîne est construite. accord ? C' est donc également possible. Nous pouvons même utiliser des modèles littéraux avec des objets de script Ja Supposons que j'ai un objet utilisateur ici, qui porte un prénom, et que j'aie John comme prénom. OK. Je vais juste avoir deux propriétés et mon nom de famille. OK. Désolé, au lieu d'être égal à, il s' agira de paires clé-valeur. D'accord, donc John et moi allons en dire deux par ici. Maintenant, c'est un objet JavaScript, non ? Donc, ce que je peux faire, c'est dire « laissez les informations sur les utilisateurs ici ». Laissez les informations utilisateur être des informations utilisateur, et je vais passer à la ligne suivante. Je dirais que le nom est. Maintenant, quel est le nom ? Je dirais plus grand et je dirais utilisateur Tt, prénom. OK. Et je vais dire plus grand, utilisateur tot, nom de famille, quelque chose comme ça Et puis je peux dire console point log. Vous pouvez indiquer des informations sur l'utilisateur. Quelque chose comme ça. C'est bon. Et vous verrez les informations de l'utilisateur, Colin, il s'appelle John Doe. Maintenant, si vous avez plus d'informations sur l'utilisateur, par exemple, vous pouvez indiquer l'âge ici. OK. Disons que c'est 33, par exemple, non ? Vous pouvez toujours ajouter une autre ligne ici. Vous pouvez dire que l'âge est plus grand et que l'utilisateur vieillit, quelque chose comme ça Vous pouvez voir que l'âge est de 33 ans. OK. Donc oui, cela peut également fonctionner avec des objets tels que des objets. C'est bon. Maintenant, si c'est le cas, comment travailleriez-vous avec des chaînes déjà cochées B ? OK ? Alors laissez-moi créer une chaîne. Supposons que vous ayez une chaîne E, qui indique qu'il s'agit d'un backtick OK. OK, j'aime bien qu'il s'agisse simplement d'imprimer un message, et qu'il soit écrit, c'est un backtick, d'accord ? Vous allez maintenant voir que cette coche arrière est imprimée ici. OK. Mais maintenant, dès que je l'aurai converti en chaîne littérale ou, désolé, modèle littéral, vous verrez qu'il y a un problème OK ? Il pense donc que c'est le point final. Comment travaillerais-tu avec ce type de chaîne ? Donc, dans ce cas, vous devez échapper au sens de cela. Donc, pour échapper, vous pouvez ajouter une barre oblique inversée ici. OK ? Et une fois que vous l'aurez enregistré, vous verrez qu'il s'agit d'un backtick. Hein ? Cette barre oblique inversée n' est donc pas prise en compte, mais elle annule le sens du backtick Et ce truc ici est connu sous le nom d'évasion. OK ? Vous êtes donc en train d' échapper au tic arrière ici, ce qui signifie que vous échappez à la signification du tic Bac et que vous en faites partie de la ficelle. D'accord ? donc cette coche arrière qui est prise en compte et non celle-ci lors de la fermeture latérale du gabarit ici. C'est bon. Donc oui, il s'agit de modèles littéraux. Si vous travaillez avec JavaScript, vous verrez de nombreux modèles littéraux dans le code Si vous lisez ou si vous créez vos propres projets, vous utiliserez beaucoup ce concept. Bien, si vous travaillez avec des chaînes en JavaScript, n'est-ce pas ? Donc oui, ce sont des modèles littéraux pour vous. 28. En faire plus avec console.log: Salut, voilà. Il est donc temps de commencer à parler de console point log. C'est bon. Maintenant, nous avons utilisé ou si vous avez vu un quelconque type de code JavaScript, vous devez déjà avoir vu ou devez savoir ce qu'est le journal des points de la console. Très bien, il est donc utilisé pour imprimer des choses sur la console. Donc, si je dis bonjour tout le monde, et si je l'enregistre, je vais voir Hello world over here en sortie. Donc, peu importe ce que je cède ici entre ces deux codes ou un seul code, je peux également utiliser un seul code. Je vais voir ce truc comme une sortie ici, d'accord ? Et je peux aussi, donc si je dis console point log, un, deux, trois, et si je sauvegarde l'impression de ce RC 123. OK ? Il s'agit donc d'une forme de journalisation de base que vous utilisez et la journalisation est l'une des méthodes ou fonctions disponibles sur cet objet de console. Donc, la console est un objet, en fait, d'accord ? Et vous utilisez le journal pour obtenir des valeurs et les imprimer sur la console. C'est bon. Maintenant, ce que nous voyons ici est une journalisation de base, n'est-ce pas ? Vous pouvez bien entendu enregistrer plusieurs valeurs. Alors, comment enregistreriez-vous plusieurs valeurs ? OK, prenons donc plusieurs valeurs. Vous pouvez donc dire « console point log » ici. OK. Et je peux imprimer le nom. OK. Et je peux dire ici, je peux ajouter Alice, puis je peux avoir chacune, quelque chose comme ça et je peux dire 25. OK. Maintenant, cela peut également être remplacé par des variables. OK, tu peux voir le nom d'Ale, 25 ans. OK. Et je sépare tout à l'aide d'une virgule Je peux même utiliser Plus ici. Donc, si je copie ceci, d'accord, vous pouvez ajouter un avantage. Donc, au lieu de cela, vous pouvez dire « plus ». D'accord, cela va donner un résultat similaire. Tu peux voir. Donc oui, c'est une façon d' imprimer plusieurs valeurs. Et, bien sûr, ces valeurs peuvent également être remplacées à l'aide de variables, n'est-ce pas ? Vous pouvez donc utiliser des variables, comme je l'ai dit, d'accord, vous pouvez donc dire que X est égal à dix ici et que Y est égal à 20. OK. Et si je dois imprimer, je peux dire « journal des points de console » ici, la valeur D de X est, et je peux ajouter X. D'accord. Vous pouvez voir que c'est une variable qui arrive ici. C'est bon. Tu peux même, genre, avoir des expressions. Vous pouvez donc dire que la somme est OK, X plus Y. Vous verrez 30. Tu peux voir. C'est ainsi que fonctionnent les différentes choses. Vous pouvez également utiliser des modèles littéraux ici. OK, donc je peux littéralement venir ici. Au lieu d' utiliser des codes doubles, je peux le rendre beaucoup plus lisible ici, et je peux dire plus grand, quelque chose comme ça, et je peux avoir ceci. Tu peux voir. La somme est de 30. D'accord, vous utilisez donc des modèles littéraux et vous obtenez les valeurs. C'est bon. Maintenant, si vous avez créé un objet, vous pouvez également l'enregistrer. Laissez-moi vous le montrer. OK ? Donc, enregistrer des objets, non ? Maintenant, permettez-moi de créer un objet appelé personne ici. OK ? Et je vais dire mon nom. Je vais dire Charlie. OK. Et je dirais que l'âge est, disons, 28 ans, et je peux dire que le métier est développé. OK. OK. C'est donc une personne qui s'appelle Charlie 28 ans et le métier est développeur. OK. Maintenant, je peux simplement dire console point log. OK, je peux dire le nom, désolé, le nom de la personne à point. Et le nom sera imprimé , non ? Tu peux voir Charlie. Maintenant, je peux simplement me débarrasser du nom ici et je peux simplement imprimer l'objet de la personne dans son intégralité. C'est également possible avec Console Log, non ? Vous pouvez même avoir un style C ou même une sortie formatée OK ? Donc, ce type de sortie formatée, vous devez l'avoir vu si vous êtes familier avec la programmation en C, d'accord ? Donc, si je dis console point log, d'accord, et laissez-moi comprendre. OK. Donc, si je dis la valeur de X ici. X est le pourcentage D. D'accord ? Et si je sauvegarde ceci, vous verrez que la valeur de la valeur est, cela devrait être le fait que l'énoncé n' est pas correctement encadré, donc la valeur doit être le pourcentage D, ou vous pouvez avoir la valeur de X ici, pourcentage D. Vous utilisez le pourcentage D, qui agit comme un espace réservé pour remplacer les valeurs. Hein ? Maintenant, si vous utilisez cet espace réservé, un seul espace réservé Et si vous ajoutez plusieurs valeurs de substitution ici, d'accord ? Et si vous lancez ceci, vous verrez qu'il est juste ajouté à la fin, d'accord ? Et oui, c'est comme ça que ça marche. Maintenant, vous pouvez également avoir plusieurs espaces réservés ici D'accord, vous pouvez donc dire console point log. Et je peux dire bonjour, pourcentage S. Maintenant, le pourcentage S est pour la chaîne. Le pourcentage D correspond aux valeurs décimales. Pourcentage D parce que H est pourcentage D et je dirais plusieurs années. Vous pouvez voir le pourcentage S de Hello et le pourcentage D datent d'il y a des années. Maintenant, je peux avoir Ale ici, et je peux en avoir 22 ici. Si je garde ceci, tu verras Bonjour Alice, tu as 22 ans accord ? C'est ainsi que journal de console peut être utilisé de plusieurs manières. Ce journal est une méthode ou une fonction, je vous l'ai dit, non ? C'est une méthode disponible avec Console Object. Maintenant, il existe plusieurs autres méthodes, d'accord ? Donc, les méthodes de la console. OK ? Il existe maintenant plusieurs autres méthodes. Quels sont-ils ? Nous avons donc le journal de la console , que nous avons vu. Vous avez une erreur de point de console ici, vous pouvez voir que l'erreur est aussi une méthode, et je peux voir que c'est une erreur. Vous pouvez transmettre n'importe quel message d'erreur, et vous verrez qu'il s'agit d'une erreur. Vous pouvez voir comment ça arrive, non ? Je peux le copier et au lieu d'une erreur, je peux avoir un avertissement ici. Il s'agit d'un avertissement. Et si je sauvegarde ceci, vous verrez que c'est un avertissement, non ? Et si je le duplique, vous pouvez également avoir un message d' information ici, afin que je puisse dire des informations. Ce sont donc des informations. C'est informatif. Et si je sauvegarde ceci, vous verrez que c'est informatif, non ? L'avertissement est donc affiché de cette façon. Les messages d'information sont affichés de cette façon et les erreurs s' affichent de cette façon, n'est-ce pas ? Donc oui, il existe plusieurs manières d' utiliser les méthodes de console. Maintenant, vous pouvez également utiliser la table de console. OK ? C'est donc une autre chose étonnante. C'est bon. Maintenant, disons que cet objet s'appelle « personne », d'accord ? Et si je dis, d'accord, disons console point log. Si j'utilise le journal de la console et si je dis personne, vous verrez que l'affichage n' est pas très bon. Il affiche sous forme JCN paires clé-valeur, qui sont extensibles Je veux l'avoir sous forme de sortie sous forme de tableau. Je peux voir la console, le tableau ici et je peux passer en personne ici et je peux avoir un point-virgule Si je sauvegarde ceci, vous verrez que l'index est le nom, la valeur est Charlie. Indice H, la valeur est 28, l'indice est la profession, la valeur est développeur. Vous pouvez également le trier. OK. Donc, il y a aussi un peu de fonctionnalité ici, et c'est l'objet, juste au cas où vous souhaiteriez le voir sous forme Json ou sous forme d'objet. Hein ? C'est donc la fonctionnalité du tableau qui vous permet d'imprimer éléments complexes tels que la structure de données d' un objet ou une variable d'objet sur la console. C'est bon. Et vous pouvez voir que c'est ainsi que cela apparaît. C'est bon. Donc, en effet, la console est très précieuse. Vous pouvez utiliser le journal. Vous l'utiliserez très fréquemment. Vous pouvez l'utiliser pour imprimer des objets, des modèles littéraux, des valeurs de substitution , créer des chaînes la volée à afficher en sortie Vous pouvez utiliser un format de sortie formaté si vous venez d'un environnement de programmation comme C, C plus plus, d'accord ? Vous pouvez également faire en sorte que cette sortie formatée existe également en Java OK ? Vous pouvez également obtenir ce type de sortie formatée en Java, n'est-ce pas ? Ensuite, vous pouvez avoir différentes méthodes de console pour imprimer des messages d'erreur, des messages d'avertissement, des messages d'information. Et au final, vous avez un tableau, pour afficher des objets tels que des objets sous forme de tableau, n'est-ce pas ? J'espère donc que cela vous sera utile et que vous avez apprécié l'exploration de Console Object. 29. Conclusion du cours: C'est la fin de cet incroyable voyage dans le monde de JavaScript. Tout au long de ce cours, vous avez acquis une base solide en JavaScript tout en apprenant les principes fondamentaux de JavaScript tels que les tableaux, les opérateurs, les objets et les différents types de données Vous avez également compris le fonctionnement de JavaScript dans des environnements réels. Nous avons également parlé de certaines applications pratiques et de certains projets que nous avons réalisés en classe. J'espère que ce cours vous a aidé à envisager Jascript un angle complètement différent Mais n'oubliez pas que l'apprentissage de Jascript ne doit pas et ne s'arrête pas là La meilleure façon de grandir en tant que programmeur est de continuer à pratiquer, construire des choses et même à expérimenter Parce qu'en élaborant des projets, vous appliquerez tous les concepts que vous avez appris, et cela vous aidera également à prendre confiance en vous avant de passer à des projets concrets. Maintenant, je voudrais vous demander de continuer à pratiquer, à explorer et à expérimenter ce cours en particulier, vous trouverez un projet de classe dans la section des projets, que je vous encourage à compléter et à partager avec l'ensemble de la classe. Merci de m'avoir rejoint dans ce voyage. J'espère que ce cours vous a aidé à prendre confiance en JavaScript et vous a donné envie de continuer à apprendre Bon codage et tout le meilleur.