JavaScript : Principes de base de l’ES6 | Emma Williams | Skillshare

Vitesse de lecture


1.0x


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

JavaScript : Principes de base de l’ES6

teacher avatar Emma Williams

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

      1:14

    • 2.

      Laisser et laisser

      2:15

    • 3.

      Portée

      9:16

    • 4.

      Levage

      3:58

    • 5.

      pour...de et pour...en

      3:31

    • 6.

      Introduction de modèles littéraux

      2:49

    • 7.

      Plus de modèles littéraux

      1:56

    • 8.

      Fonctions de flèche

      3:20

    • 9.

      Sténographie des propriétés d’objet

      3:25

    • 10.

      Geler des objets

      4:03

    • 11.

      Plus sur le gel des objets

      1:28

    • 12.

      Décomposition de tableaux

      4:30

    • 13.

      Décomposition d’objets

      3:46

    • 14.

      Plus de destructuration d’objets

      2:41

    • 15.

      Détruire des objets imbriqués

      2:28

    • 16.

      Plus de destructuration d’objets imbriqués

      3:02

    • 17.

      Paramètres de la fonction de destruction

      2:34

    • 18.

      Plus de destructuration des paramètres de fonction

      1:53

    • 19.

      Paramètres par défaut

      3:37

    • 20.

      Plus de paramètres par défaut

      3:07

    • 21.

      Diffuser des fonctions

      3:28

    • 22.

      Plus de diffusion dans les fonctions

      2:08

    • 23.

      Introduction de la propagation dans les objets

      2:29

    • 24.

      Répartir dans des objets

      3:18

    • 25.

      Plus de diffusion avec des objets

      2:10

    • 26.

      Répartissez en tableaux

      4:21

    • 27.

      Introduction du paramètre rest

      3:52

    • 28.

      Utilisation du paramètre rest

      3:16

    • 29.

      Présentation de forEach

      3:39

    • 30.

      Utilisation de forEach

      3:04

    • 31.

      Présentation de la carte

      3:46

    • 32.

      Utilisation de la carte

      7:57

    • 33.

      Utiliser un filtre

      7:13

    • 34.

      Utiliser find

      7:19

    • 35.

      En utilisant certains

      6:40

    • 36.

      Notation des objets

      8:48

    • 37.

      Présentation des prototypes

      4:08

    • 38.

      Plus de prototypes

      4:25

    • 39.

      Introduction des cours

      3:06

    • 40.

      Plus d’informations sur les cours

      4:16

    • 41.

      Utilisation des classes

      1:39

    • 42.

      Présenter des promesses

      3:18

    • 43.

      Travailler avec des promesses

      4:06

    • 44.

      Modules

      6:31

  • --
  • 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.

90

apprenants

--

projets

À propos de ce cours

Ce cours vous enseignera les bases d’ES6 dans le langage de programmation JavaScript.

Il y a beaucoup de contenu pour apprendre ES6, mais une grande partie de ces concepts n’explique pas pourquoi ces notions sont sous-jacentes. À l’aide d’exemples de code, ce cours vous enseignera les bases de l’ES6 et vous montrera comment les choses étaient faites auparavant. Ce faisant, vous pourrez travailler en toute quiétude sur des projets plus anciens et les mettre à jour.

Comprendre ES6 est une compétence qui vous aidera à trouver un emploi dans l’industrie aujourd’hui. C’est également très amusant de travailler avec ! Si vous souhaitez travailler avec des bibliothèques telles que React, c’est une compétence fondamentale qui fait partie de votre parcours d’apprentissage.

Suivre ce cours vous permettra de vous immerger rapidement dans la syntaxe et de vous familiariser rapidement avec ES6. J’utilise des exemples visuels et j’applique ces idées au jour le jour, de manière à vous rappeler rapidement les informations.

Nous aborderons les bases de la conclusion et de la perméabilité et... en boucles pour... et pour... Nous aborderons ensuite des sujets tels que la destructuration et l’utilisation de l’opérateur de propagation. Nous examinerons ensuite les méthodes d’aide des tableaux pour arrêter d’écrire des boucles et comprendre comment utiliser les cours ES6. Nous terminerons le cours en regardant les promesses.

Grâce à des vidéos ludiques et à des exemples de code, vous terminerez le cours en vous assurant que vous pourrez écrire ES6 par vous-même.

Que vous soyez relativement novice en programmation, en JavaScript ou que vous souhaitiez simplement vous baser sur des compétences existantes, ce cours vous permettra de vous doter d’une boîte à outils pour devenir un meilleur développeur.

Rencontrez votre enseignant·e

Teacher Profile Image

Emma Williams

Enseignant·e

Compétences associées

Développement Développement Web
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: Bonjour, bienvenue dans ce cours sur ES6 JavaScript. Javascript est l'un des langages de programmation les plus demandés aujourd'hui. Et les compétences ES6 sont très demandées. Si vous souhaitez travailler avec des bibliothèques telles que React, Learning, ASL est un élément essentiel de votre parcours. Au cours de notre parcours à travers ES6, à travers des exemples, nous commencerons par les bases telles que le travail avec let et const. Nous passons ensuite à des sujets tels que les fonctions et classes de flèche structurant D. Nous terminerons le cours en examinant les promesses. L'un des aspects déroutants lorsque vous apprenez ESX est de comprendre où il correspond à un code plus ancien. Ce cours, nous allons vous montrer deux exemples, comment les choses ont été faites auparavant et nous avons aidé à répondre au pourquoi derrière les changements et à la syntaxe. m'appelle Emma, et j'ai travaillé comme programmeur lors de la journée des industries. J'adore travailler avec JavaScript. J'adore aider les autres à apprendre la langue. J'espère que ce cours vous plaira. 2. laissez et const: Dans cette vidéo, nous allons regarder let and const. Javascript a trois façons de créer une variable depuis ES6, les deux premières sont en utilisant le mot-clé gauche ou const Latin comps a été introduit dans ES6. Avant ES6, la seule façon de créer une variable était d' utiliser la barre de mots clés. Vous pouvez donc toujours voir du code qui utilise cela et c'est correct. Mais à l'avenir, il est préférable de s'en tenir à différence de domaine const latéral entre l'utilisation de this ou const est que les variables créées avec le mot-clé constant ne peuvent pas être modifiées une fois qu'elles ont été créées. Si vous créez une variable et que vous savez que la valeur de cette variable ne changera pas, il est préférable d'utiliser const. exemples peuvent inclure les jours de la semaine ou de l'année. Nous allons créer quelques variables dans la console à l'aide de const. Nous allons commencer par créer une variable appelée days. Je vais lui attribuer un tableau contenant lundi, mardi, mercredi. Rappelons-nous des jours. Nous voyons le tableau de nos jours. Créons une autre variable en utilisant le code const mon âge. Ce qui lui a été attribué la valeur 100. Rappelons maintenant la variable d'âge. Nous pouvons voir que 100 ont été stockés avec succès dans la variable. Si vous savez que la valeur de la variable va changer, vous devez utiliser gauche lorsque vous déclarez la variable. Sinon, vous obtiendrez une conférence d'erreur, un exemple en changeant la valeur de mon âge à neuf ans. Nous obtenons une erreur de type non détectée de l'attribution du message à une variable constante. Nous allons maintenant créer une variable appelée Changer âge en utilisant et nous allons lui attribuer la valeur deux. Nous allons maintenant rappeler la variable. Nous pouvons voir que la valeur de deux a été stockée avec succès dans la variable. Essayons maintenant de le mettre à jour à trois. Nous disons donc que changer d'âge équivaut à trois ans. Rappelons maintenant la variable d'âge qui change. Nous pouvons voir qu'il a été mis à jour avec succès. 3. Portée: Bonjour. Dans cette vidéo, nous allons introduire la portée en JavaScript. Dans votre maison, il se peut que vous ayez des objets, peut-être dans la cuisine ou dans le couloir, accessibles à tous ceux qui y vivent. Ensuite, dans votre chambre, il se peut que vous ayez d'autres objets personnels que vous préférez utiliser uniquement par vous-même. Cet exemple illustre essentiellement le fonctionnement de scope en JavaScript. Il s'agit d'une définition des rôles, de la façon dont les variables, les objets et les fonctions sont accessibles lorsque le code est exécuté. portée en JavaScript définit le contexte actuel du code. Ainsi, au niveau de base, il existe deux étendues au sein de JavaScript, portée globale et la portée locale. En gros, la norme définit quelles variables sont accessibles et visibles lorsque le code est en cours d'exécution. Commençons par répondre à la question : quelle est la portée globale des programmes JavaScript a une portée globale, variables qui se trouvent à l'intérieur la portée globale ou accessibles, modifiables et visibles depuis n'importe où dans notre code. Les variables de la portée globale sont également disponibles pendant toute la durée de vie que notre programme exécute. variables déclarées en dehors d' une fonction ou d'un bloc en dehors de la portée globale, il est important d'être attentif lorsque nous déclarons des variables dans la portée globale de la raison pour laquelle nous le faisons, la déclaration de variables dans la portée globale peut consommer de la mémoire lorsque le programme s'exécute. Et l'instance de dénomination peut se produire lorsque des variables portant le même nom sont déclarées séparément dans différentes étendues de notre code. Allons de l'avant et écrivons du code. Nous commencerons par déclarer une variable à l'aide de laquelle nous appellerons notre variable globale. va initialiser cela avec la chaîne Hello. Prochaine. Ensuite, créez une déclaration de fonction, que nous appellerons une fonction. La fonction renverra simplement la valeur de notre variable globale. Enfin, nous allons invoquer cette fonction. Enveloppons cela dans un journal de console et nous allons exécuter le code. Nous obtenons la valeur de la variable globale renvoyée, qui est la chaîne Hello. Tout cela est possible parce que la variable est globale dans la portée globale. Il est donc accessible depuis n'importe où. Quelle est donc la portée locale ? Lorsque vous entrez dans une pièce de votre maison, vous entrez une étendue locale spécifique dans la programmation, chaque fois qu'une nouvelle étendue est créée à l'intérieur de la portée globale, par exemple, chaque fois que vous créez une fonction et puis une nouvelle étendue locale est créée, toutes les variables créées à l'intérieur de cette étendue locale ne seront accessibles qu'à partir de cette fonction. On pourrait penser à cela un peu comme dire que vous ne pouvez ouvrir et fermer une fenêtre que depuis l'intérieur de la pièce. Les fenêtres de votre maison, les paramètres de fonction sont également classés comme étant dans la portée locale. Si vous essayez d' y accéder depuis l'extérieur de la fonction, JavaScript générera une erreur. Depuis ESX, nous pouvons diviser la portée locale en deux parties, portée de la fonction et la portée du bloc. Lorsque nous utilisons des variables aujourd'hui, nous utilisons généralement left ou const, mais étant donné la quantité de code écrite avant A6, il vaut toujours la peine d'être familiarisé avec. Chacune de ces variables utilise des règles de portée différentes. Ce sont les suivants. Loin est la portée de la fonction, const est une portée de bloc et la gauche est portée de bloc. Commençons par répondre à la question, qu'est-ce que la portée des fonctions ? Mais lorsqu'une variable est définie à l'intérieur d'une fonction, on peut dire que la variable est étendue de fonction. Si vous essayez d'accéder à une variable locale depuis l'extérieur de la fonction depuis laquelle elle a été définie. Une erreur, en particulier une erreur de référence, sera générée lorsque vous exécutez le code. Les variables définies avec les mots-clés let et const se comporteront de la même manière dans étendue de la fonction que dans le bloc scape. Regardons un peu de code. Nous allons commencer par créer une déclaration de fonction appelée fonction somme. Dans cette fonction, nous allons créer une variable en utilisant notre variable locale. va initialiser cela avec la chaîne bonjour. Enfin, nous voulons renvoyer la variable locale à partir de la fonction. Maintenant, en dehors de la fonction, voyons ce qui se passe lorsque la console déconnecte la valeur de la variable locale. Nous allons exécuter ce code. Nous revenons à l' erreur de référence car nous essayons d' accéder à une variable à portée locale à partir de l'étendue globale. Répétons maintenant les mêmes étapes, mais cette fois, nous allons modifier la variable pour utiliser const comme constante. Laissez, euh, les deux blocs de chèvre, nous avons touché le même problème. Passons à l'examen de la portée du bloc. En JavaScript, un bloc est un morceau de code imbriqué à l'intérieur d'une paire d'accolades. Les instructions conditionnelles et les boucles sont tous deux des exemples de bloc. portée du bloc signifie que chaque fois qu'un bloc est créé en tant que nouvelle étendue locale. Lorsque nous créons une variable dans un bloc, cette variable est ensuite étendue à ce bloc. Cela signifie que les variables ne sont pas accessibles depuis l'extérieur du bloc. Si vous essayez d'accéder à une variable définie à l'intérieur du bloc de code depuis l'extérieur du bloc. Javascript déclenche une erreur, particulier une erreur de référence. Mais notez que la portée du bloc ne s'applique pas lorsque nous définissons des variables avec le mot-clé var. Regardons un peu de code. Nous allons commencer par créer une déclaration de fonction, et cette fois-ci, nous l' appellerons notre exemple de portée. À l'intérieur de cela, nous utiliserons une déclaration if. Nous dirons si c'est vrai. À l'intérieur du bloc, une variable sera déclarée à l'aide de var. Et nous appellerons celui-ci, initialiserons avec la chaîne que j'ai été créée en utilisant l'instruction after the if. Nous allons consoles consigner la variable. Exécutera ensuite également la fonction, ah, l'exemple de portée. Lorsque le code s'exécute, nous obtenons la chaîne de la variable imprimée sur notre écran. La raison pour laquelle cela fonctionne est que la barre a une portée de fonction, aucun tableau de portée de bloc ne s'applique. Essayons encore une fois. Mais nous allons changer la variable de var à utiliser. Nous allons également changer le nom de cette variable par deux. Mettons également à jour notre journal de console exécuter à nouveau ce code. Cette fois, nous obtenons une erreur de référence. Cela est dû au fait que LET est limité au bloc et ne peut pas être accessible depuis l'extérieur du bloc créé. Si nous voulions exécuter ce code, nous devrions déplacer notre journal de console dans le même bloc que la variable. Maintenant, nous obtenons la chaîne que j'ai été créée à l'aide de l'impression à l'écran. Sinon, nous pourrions mettre la gauche en dehors de la portée du bloc et entrer la portée extérieure de la fonction. portée lexicale est la façon dont une étendue de fonction peut accéder à des variables depuis une étendue externe ou parente. La fonction interne ou enfant est liée lexiquement à la fonction parent externe. Cela signifie qu'une fonction peut accéder à toutes les étendues de leur, puis jusqu'à la portée globale incluse. Jetons un coup d'œil à un exemple. Nous allons commencer par créer une déclaration de fonction appelée parent externe. À l'intérieur du corps de la fonction une variable appelée 1 est créée. vais initialiser cela avec la chaîne que j'ai été créée avec var. Nous allons ensuite créer une autre variable. Mais cette fois, nous allons utiliser la gauche. Nous allons initialiser cela avec la chaîne que j'ai été créée avec la gauche. Ensuite, nous allons créer une autre fonction appelée « enfant intérieur ». Dans le corps de cette fonction un journal de console sera créé. À l'intérieur, il y aura une variable, mais créera également un autre journal de console. Cette fois, nous allons mettre la variable en dehors de cette fonction, appellerons la fonction enfant interne. Ensuite, en dehors de la fonction parent externe, nous appellerons la fonction parent externe. Mettez la vidéo en pause et voyez si vous pouvez deviner ce qui sera imprimé sur la console. Maintenant, lançons ce code. Lorsque nous exécutons ce code, les deux journaux de la console sont imprimés sur la console. La fonction enfant interne tente d'accéder aux variables à partir de la portée externe incluse. Cela signifie que nous pouvons accéder aux valeurs de ces variables sans erreur. Nous pourrions également déplacer les variables vers la portée globale, ce qui fonctionnerait. Cela fonctionnerait également si nous modifions la variable déclarée à l'aide de led pour utiliser const. 4. C'est un grillage: Dans cette vidéo, nous allons regarder le hissage. Lorsque nous utilisons le mot hisser en anglais, nous décrivons l'action consistant soulever ou à tirer quelque chose. On peut dire qu'un drapeau est hissé sur un bâtiment ou sur sa voiture hissé hors d'une rivière. hébergement en JavaScript décrit lorsque variables et des fonctions déclarent le nom a été levé ou hissé en haut de leur portée locale avant l'exécution du code. Pour être clair, aucun code n'est physiquement déplacé, mais c'est la façon dont le compilateur JavaScript lit le code. Commençons par examiner un exemple de base. Par conséquent, dans notre éditeur de texte, nous allons commencer par créer un journal de console, qui affichera le résultat à partir d'une variable que nous n'avons pas encore créée, mais qui s'appellera MyDog. Dans la ligne suivante, nous allons créer cette variable, ce qui va utiliser var. On va dire bar, mon chien. Je vais lui attribuer le muffin à cordes. Maintenant, lançons ce code. Nous sommes indéfinis. hébergement est la raison pour laquelle nous n'obtenons pas d'erreur lorsque nous exécutons ce code, le JavaScript et tapez simplement la déclaration et les étapes d'affectation de la création de la variable. La déclaration est la VAR, partie de mon chien, et l'affectation est la méthode égale. La partie de déclaration est hissée en haut de l'étendue actuelle avant l'exécution du code et attribue initialement la valeur non définie. Cela signifie que la variable MyDog peut être utilisée avant d'être initialisée. Mais qu'en est-il de laisser et de const ? Nous avons examiné un exemple de cas où une variable est déclarée avec var. Voyons maintenant ce qui se passe lorsque nous déclarons une variable avec lead ou const. Lorsque vous déclarez une variable avec lead ou const, deux variables sont en fait toujours hissées. Cependant, la différence réside dans le fait que lorsque nous utilisons bar, la valeur indéfinie est attribuée à la déclaration initialement jusqu'à ce que la ligne où l'affectation que nous avons définie se produise. À ce moment-là, la variable se voit attribuer la valeur nous avons assignée avec let, la variable n'est initialement affectée aucune valeur. Si nous répétons l'exemple que nous avons utilisé avant d'utiliser gauche, nous pouvons voir comment cela fonctionne. Essayons cela dans notre éditeur de texte. Nous allons créer un journal de console qui affichera mon chien. Ensuite, en utilisant la gauche, nous allons créer la variable MyDog et lui attribuer le muffin à cordes. Maintenant, lançons ça. Nous obtenons une erreur de référence non détectée. Cette fois, lorsque le code exécute la déclaration, la partie qui indique laisser mon chien est hissée au sommet de la portée par le compilateur. Mais la variable est initialement non initialisée. Contrairement à la barre, quand il a été initialisé avec indéfini. Lorsque le code est exécuté, le code s'exécute, le journal de la console se produit avant que nous ayons attribué une valeur à la variable. Nous obtenons l' erreur de référence ci-dessus. Dissuader les variables avec const fonctionne de la même manière. La raison derrière cette situation est appelée zone morte temporelle. La zone morte temporelle décrit un état temporairement inactif dans lequel les variables ne peuvent pas être utilisées. Cela se produit parce que JavaScript compile le code avant d'exécuter le code. Si vous êtes à la caisse d'un supermarché, vous êtes admis entre avoir compilé vos produits d'épicerie, que vous avez probablement de l'espace prêt à accueillir à la maison. Cependant, vous ne les possédez pas encore physiquement, donc vous ne pouvez pas les utiliser tant que vous n'avez pas terminé la phase de paiement au supermarché. Finissons par quelques exemples. 5. pour ... et pour ...: Avant ESX, si nous voulions parcourir certaines données, comme un tableau, nous pouvions utiliser une boucle for. C'est toujours une bonne option pour nous, mais depuis ES6, nous avons des choix supplémentaires lorsque nous parcourons tout ce qui est itérable. conséquent, les chaînes sont des tableaux, par exemple, nous pouvons utiliser une boucle for of. Cela évite de devoir utiliser des indices pour incrémenter l'utilisation des variables comme compteur. Lorsque nous utilisons quatre de la variable elle-même, on pionne l'élément, pas l'index. Jetons un coup d'œil. Déclarez une variable appelée boissons. Attribuera à cela un tableau. À l'intérieur du tableau, nous ajouterons les chaînes. Cola, thé, portier et soda. Maintenant, utilisez une boucle for pour imprimer chaque élément du tableau. Nous utilisons le mot-clé pour et à l'intérieur des parenthèses, nous créons une variable appelée i. Nous disons que je consomme moins que la longueur du point. Ensuite, nous incrémentons i. À l'intérieur du corps de la boucle, nous consolons les boissons de journal de l' IA à l'aide de crochets. Sauvegardons cela et lançons le code. Toutes nos boissons sont imprimées sur la console. Revenons à notre code, commenterons notre boucle for. Nous allons maintenant l'implémenter à nouveau en utilisant une boucle for of. Nous utilisons donc le mot-clé pour et un ensemble de parenthèses à l'intérieur des parenthèses dira que je ne peux pas boire de boissons. À l'intérieur de la boucle. Nous disons journal de console, buvez. Sauvegardons cela et lançons le code. Nous faisons toujours imprimer chaque boisson sur la console car les boucles ne fonctionneront si vous souhaitez parcourir un objet. Si vous vouliez le faire, vous devriez utiliser pour n, Changeons notre tableau de boissons pour qu'il s'agisse d'un objet. Nous allons ajouter les boissons. Je vais également fixer des prix. Maintenant, utilisons-nous pour n. Nous en disons quatre. Ensuite, entre parenthèses, const, buvez, dans les boissons. À l'intérieur de la console duplex. Nous sauvegarderons cela et exécuterons le code. La clé est imprimée sur la console. Si nous voulions imprimer la valeur de chaque propriété, nous pouvons utiliser des crochets dans le corps de la boucle. Cette fois, nous disons boissons, qui est le nom de l' objet, crochets, boisson. Sauvegardons cela et lançons le code. Nous obtenons la valeur de chaque clé renvoyée comme note de côté lors de la chute et de la chute en boucles. Grâce à ESX, nous pouvons utiliser const pour la variable de la boucle. En effet, chaque fois que la boucle est itérée, une nouvelle portée est créée, ce qui signifie que nous pouvons utiliser des pistes ou du contenu dans ces boucles. Et la constante est agréable car nous ne modifions généralement pas la valeur de l'itérable. Cela ne fonctionnera pas dans une boucle standard. 6. Présentation de modèles littéraux: Bienvenue de retour. Dans cette vidéo, nous allons voir quels sont les littéraux de gabarits en JavaScript, quels sont nos littéraux de modèles. Eh bien, dans la version ES6 de JavaScript, des littéraux de gabarit ont été introduits avant ES6. Si nous avions une variable que nous voulions utiliser dans nos chaînes, nous devrions utiliser la concaténation. Jetons un coup d'œil à cela. Nous allons créer une déclaration de fonction qui pourrait imprimer une boisson. À l'intérieur de la fonction utilisant var, nous allons créer une variable appelée drink. Nous allons attribuer à cela la chaîne t. Revenons maintenant une chaîne de notre fonction. Nous dirons que ma boisson préférée est. Utilisez ensuite l' opérateur de concaténation pour ajouter un espace. Ensuite, utilisez à nouveau l'opérateur de concaténation pour ajouter la variable boisson. Appelons la fonction Print Drink à l'intérieur d'un journal de console pour enregistrer cela et nous allons exécuter le code. Nous recevons ma boisson préférée est T imprimée sur la console. Cela fonctionne donc. Mais les littéraux de modèle offrent un moyen propre d' interpeller ou d' injecter les variables ou expressions dans la chaîne, au lieu de devoir effectuer la concaténation. Un littéral de modèle est inclus dans les baptistes au lieu des guillemets doubles ou simples habituels. L'interpolation de chaînes décrit quand des variables sont injectées dans une chaîne. La variable que vous souhaitez interpeller est enveloppée dans des accolades bouclées, puis commence par un signe dollar. La variable elle-même est placée à l'intérieur des accolades. Examinons l'exemple précédent, mais cette fois, en utilisant un littéral de modèle, cela va changer notre variable pour utiliser la gauche. Bien que cela fonctionnerait avec le bar. Maintenant, changeons notre chaîne. Supprimera tout après la première chaîne, changera ensuite la chaîne pour utiliser coches arrière afin qu'il s'agisse d' un littéral de modèle. Maintenant, interpellons dans la variable boisson. Nous utilisons le signe du dollar et un ensemble d'accolades bouclées. À l'intérieur des accolades, nous ajoutons le nom de la variable que nous voulons injecter. Sauvegardons cela et lançons le code. Lorsque la fonction est appelée, nous obtenons la même valeur de retour. Mais notre code est beaucoup plus propre. 7. Plus de modèles littéraux: Une autre caractéristique utile des littéraux de gabarit est que nous pouvons couvrir l'autrichien sur plusieurs lignes. Avant ES6, vous devez utiliser concaténation de chaîne ou un caractère de saut de ligne pour atteindre cet objectif. Voyons un exemple rapide. Je dirigerais notre code. Ensuite, l'utilisation de var ajoutera une variable appelée notre chaîne. Attribuer à cette chaîne dira première ligne. Ensuite, nous ajouterons le nouveau caractère de ligne. Deuxième ligne. Le nouveau caractère de ligne, troisième ligne, le caractère de saut de ligne. Ajoutons maintenant un journal de console pour la variable progéniture. Nous allons enregistrer cela et nous allons exécuter le code. Nous voyons chaque partie de la chaîne imprimée sur plusieurs lignes. Nous avons des littéraux gabarits. Nous n'avons plus à nous inquiéter à ce sujet. Si nous voulions créer une chaîne multiligne, nous pouvons le faire en insérant la chaîne et coches arrière et en séparant les lignes, mettons à jour notre code. Nous allons commencer par supprimer tous les caractères de saut de ligne. Nous mettrons à jour notre variable pour l'utiliser. Ensuite, nous allons envelopper la ficelle dans des backticks. Sauvegardons cela et nous allons exécuter le code. Rien n'a changé. Nous obtenons le même résultat. Mais encore une fois, je vais coder est beaucoup plus propre. 8. Fonctions de flèche: Dans cette vidéo, nous allons examiner les fonctions et paramètres des flèches en JavaScript. Tout d'abord, prenons du recul et discutons des expressions fonctionnelles. Qu'est-ce qu'une expression de fonction ? Eh bien, une expression de fonction décrit quand une fonction est stockée dans une variable. Nous pouvons déclarer une expression de fonction nommée dont la fonction porte un nom. Mais généralement, une expression de fonction n'a pas de nom. Nous appelons cela une fonction anonyme. Les fonctions anonymes sont particulièrement utiles lorsque notre principale utilisation de la fonction consiste à transmettre la fonction en tant qu'argument à une autre fonction. La raison pour laquelle cela est possible est que les fonctions sont des objets en JavaScript. Lorsque vous appelez ou appelez une expression de fonction, vous utilisez le nom de la variable, non le nom de la fonction. Lorsque vous utilisez une expression de fonction, l'interpréteur JavaScript ne fera rien avec la fonction tant qu'il la ligne où la fonction est initialisée. Examinons un exemple d'expressions de fonctions. Nous allons créer une fonction qui prendra le nom d'un jeu sous forme de chaîne. Et à l'aide d'un littéral de modèle, il imprimera le nom du jeu à l'écran. Mais commençons par créer la variable pour contenir la fonction, que nous appellerons mon jeu préféré. Ensuite, nous utilisons le signe égal. Le mot-clé fonction définira le paramètre comme jeu. Dans le corps de la fonction, nous voulons renvoyer un littéral de modèle, ce que nous allons juste dire. Mon jeu préféré est. Ensuite, nous interpolerons le jeu. Appelle la fonction dans le journal de la console. Et nous allons passer le monopole de chaîne comme argument. Disons cela et donnons un coup de main. Lorsque nous exécutons la fonction, nous imprimons notre chaîne à l'écran avec le monopole du jeu que nous avons transmis comme argument dans lequel les fonctions de flèche correspondent. Es6 a introduit la syntaxe de la fonction flèche, ce qui signifie que nous pouvons omettre la fonction de mot-clé. Revenons à notre code et mis à jour en supprimant le mot-clé fonction ajoutera la syntaxe de la fonction flèche. Nous recevons toujours la même chaîne de caractères. Si nous n'avons besoin que de renvoyer une valeur de la fonction, nous pouvons le simplifier davantage et omettre les accolades et le mot clé renvoyé. Nous n'utilisons qu'une seule ligne de déclaration. C'est ce qu'on appelle une fonction de flèche à ligne unique. Revenons à notre code et mettons à jour cela. Il devient donc une fonction de flèche à ligne unique. Nous allons enregistrer cela et exécuter le code. Nous obtenons toujours la même valeur de retour. 9. Propriété objet shorthand: Dans cette vidéo, nous allons examiner le raccourci des propriétés d'objet. Imaginons que nous écrivions un programme qui nous oblige à modéliser des données sur certains vêtements. Pour ce faire, nous pouvons utiliser un objet. Voyons comment résoudre ce problème si nous le faisions avant ES6, nous commencerons par créer une déclaration de fonction, que nous appellerons créer une garde-robe. L'intérieur de la fonction créera quatre variables à l'aide de var. Et ils auront les vêtements et le nombre de ces articles que nous avons dans notre garde-robe. Commençons par créer une variable appelée hat. Nous allons définir cela comme égal à un. Créons une autre variable appelée « shots ». Nous allons fixer cette valeur à cinq. Nous allons créer une variable pour le sauteur. Nous allons fixer cette valeur à huit. Enfin, nous allons créer une variable pour les chaussettes, et nous allons définir cette variable sur deux. Ensuite, nous allons créer un objet littéral, que nous appellerons ma garde-robe. Il aura les mêmes clés que les variables ci-dessus. Et définissez chaque valeur sur les variables ci-dessus. Va mettre le chapeau à un chapeau, un short. Pour se présenter. Pull, pull, chaussettes. chaussettes. Retourne ensuite l'objet. Console consigne la valeur de retour de l'exécution de l'eau de création et la fonction exécute ce code. Nous obtenons chaque élément avec les valeurs que nous avons définies dans les variables items. Lors de la création d'ES6, raccourci des propriétés d' objet a été introduit. raccourci de la propriété Object nous permet de simplement transmettre le nom de la clé plutôt que de répéter le nom et la clé. Rien n'a changé dans la façon dont le code fonctionne sous le capot. Mais le raccourci nous aide à écrire moins de code. C'est ce qu'on appelle le sucre syntaxique. Prenons la fonction de création de garde-robe et regardons à nouveau. Mais cette fois, nous utiliserons le raccourci de propriété d' objet. Nous allons commencer par changer la fonction pour qu'elle devienne une expression de fonction ES6. mettrons ensuite à jour nos variables pour les utiliser. Ensuite, nous allons mettre à jour notre littéral d'objet pour l'utiliser à gauche. Nous pouvons également supprimer les paires clé-valeur et simplement transmettre les noms de variables. Relançons ce code. La sortie du journal de la console est la même, mais le code lui-même est beaucoup plus simple. 10. Objets de congélation: Bonjour. Dans cette vidéo, nous allons regarder le gel des objets. Es6 a introduit let et const pour la déclaration de variables. Lorsque vous déclarez une variable à l'aide de const, vous ne pouvez pas réaffecter la variable. Jetons un coup d' œil à un exemple de cela dans la console. Nous allons créer une variable à l'aide de const. Nous appellerons cela une valeur. Nous allons initialiser cela avec la valeur 1. Ensuite, nous allons essayer de modifier cette valeur par la valeur deux. Nous obtenons une erreur de type non interceptée fonction de l'affectation à une variable constante. Voyons un autre exemple. Cette fois dans notre éditeur de texte. Nous allons utiliser un littéral d'objet pour créer un objet à l'aide de CONST, et nous appellerons cela, notre objet, créera une propriété appelée animal. Un. Cela donnera la valeur, le chat à cordes créera une deuxième propriété appelée animal pour lui donner le chien à cordes. Enfin, nous allons créer une troisième propriété appelée Animal trois, qui donnera la valeur à la forme des chaînes. Plus tard. Nous allons essayer d'utiliser le signe égal pour réaffecter l'objet en tant qu'objet vide. Lançons ce code. Une fois encore. Nous obtenons une erreur de type non détectée. Essayons de comprendre pourquoi nous obtenons cette erreur plus profondément. Lorsque nous utilisons le terme mutable, nous décrivons quelque chose qui peut être modifié. Objets en JavaScript qui sont affectés à une variable à l'aide de const a mutable. Cela inclut les objets, les tableaux et les fonctions. Il est important de le comprendre car l'utilisation const empêche uniquement la réaffectation du nom de la variable, de l'identificateur des variables, non de l'objet lui-même. Si nous voulions changer la propriété de l'animal en une vache, nous pouvons procéder comme suit. Nous utiliserions le nom de l'objet, qui est notre objet. La clé de la propriété que nous voulons changer, c' est-à-dire animal. Ensuite, en utilisant le signe égal, nous définissons cette valeur égale à la vache à cordes. Lançons ça. Nous faisons imprimer l'objet R sur notre console et l'objet animal a été remplacé par une vache. Soyez clair, cela ne fonctionnerait pas avec l'un des types de données primitifs, tels que les chaînes, car les chaînes sont immuables. Jetons un coup d' œil à cela dans la console. Nous allons créer une variable à l'aide CONST et l'appellerons notre chaîne. Nous allons initialiser cela avec la chaîne Hi. Maintenant, nous allons essayer de changer le deuxième élément de la chaîne pour qu'il s'agisse de la lettre O. Nous allons donc dire notre chaîne , puis les crochets avec l'index. Console consigne notre chaîne. Rien n'a changé et la corde est toujours haute. Pour résumer, vous pouvez modifier ou muter l'objet lui-même, mais vous ne pouvez pas modifier le nom ou l'identificateur de la variable dans laquelle l'objet est stocké. C'est comme dire que vous pouvez modifier la déclaration de votre maison, mais vous ne pouvez pas modifier son adresse. Dans la vidéo suivante, nous allons voir comment arrêter de muter des objets. 11. Plus sur les objets de congélation: Bienvenue de retour. Comment arrêter la mutation d'objets ? Nous avons pétrifié que vous ne pouvez pas simplement empêcher les données d'un objet d'être mutées simplement en utilisant const. Vous pouvez cependant utiliser une méthode fournie par le gel du code JavaScript. Cette méthode fait partie de l' objet intégré standard de l'objet. Une fois que vous aurez utilisé cette méthode, vous ne pourrez pas modifier l'objet. Et si vous exécutez votre code en mode strict, une flèche sera lancée. La valeur renvoyée de la méthode sera objet, qui a été transmise à la fonction. La syntaxe est la suivante. Phrase de points d'objet, parenthèses, puis le nom de votre objet. Essayons de l'utiliser avec l'objet d'art créé dans la dernière vidéo. Une fois le littéral d'objet créé, nous utiliserons la méthode de gel des points d'objet et nous transmettrons l'objet. Sauvons ça et lançons ça. Nous recevons l'objet R qui nous est renvoyé. Mais maintenant, essayons de changer la propriété de l'animal pour qu'elle soit de nouveau une vache, comme nous l'avons fait dans la dernière vidéo. Nous allons enregistrer cela et réessayer d'exécuter le code. Rien n'a changé et l'objet d'origine est renvoyé. 12. Déstructurer des tableaux: Le but de cette vidéo est d'introduire un raid, la structuration et le JavaScript. Imaginez que vous visitiez un supermarché, que vous cueillez des articles et que vous les emballez dans des sacs. Lorsque vous rentrez chez vous, un par un, vous déballez ces objets et vous les rangez. Lorsque nous écrivons du code, nous pouvons utiliser la structuration comme moyen de décompresser, sélectionner certains éléments des structures de données, tels que les objets et les tableaux. Ensuite, nous pouvons placer ces éléments dans leurs propres variables indépendantes. Avant ES6, si nous voulions choisir certains éléments d'une structure de données, comme un tableau, nous devons utiliser l'index de l'élément, puis l' enregistrer dans une variable. Voyons comment nous aborderions cela. Nous allons commencer par déclarer une variable appelée Days et affectée à ce tableau et à ce tableau. Ce tableau remplacera les sept jours de la semaine en tant que chaînes. Ensuite, nous allons déclarer trois variables. Premièrement, deuxièmement. Troisième. Nous voulons obtenir les premiers deuxième, troisième éléments du Deseret. À l'intérieur du premier, en utilisant la notation entre crochets, nous obtiendrons le premier élément, l'élément à l'index 0. Le second recevra le deuxième élément. C'est à l'index d'un. Le troisième obtiendra le troisième élément, l'élément de l'index de deux. Ajoutons maintenant les journaux de console pour la première seconde, troisième variable, et nous allons procéder à cette opération. Nous obtenons les trois premiers éléments du tableau de la journée, l' imprimons sur notre écran. Bien que cette approche fonctionne, il existe un moyen beaucoup plus simple de résoudre ce problème. Et cela utilise une structuration radio. En utilisant la structuration, nous pouvons choisir les éléments requis en une seule ligne de code. Pour ce faire, nous créons un tableau. Et à l'intérieur du tableau, nous avons placé les noms auxquels nous souhaitons appeler les variables pour les éléments à attribuer. Ensuite, nous utilisons l' opérateur égal et le définissons sur le nom du tableau dans lequel vous souhaitez sélectionner les éléments. Les variables du tableau seront définies sur la valeur équivalente de l'élément dans le tableau initial fonction de la position de cet élément. Jetons un coup d'œil à l'exemple original, mais cette fois, en utilisant la structuration, nous avons encore nos jours d'avance. Mais maintenant, en utilisant la structuration, nous allons créer un tableau à l'aide de const. Nous allons définir cette valeur égale au tableau du jour. À l'intérieur du tableau, nous ajouterons les variables en premier, deuxièmement , en troisième lieu, ce sont les noms des variables auxquelles nous souhaitons attribuer nos éléments. Lançons à nouveau ce code. Nous obtenons la même valeur de retour. Il y a quelques caractéristiques supplémentaires d' une structure radio qui mérite d'être comprise. La structuration permet également de sauter un index et l'élément à l' aide d'une virgule. Si nous voulions choisir le premier, deuxième, le quatrième élément du tableau du jour. Nous utiliserions cette approche. Revenons à notre exemple et essayons ceci. Ajoute une virgule là où se trouvait notre troisième élément, puis ajoute une variable pour le quatrième élément. Ajoutons également un journal de console pour cette variable. Relançons ça. Maintenant, comme vous pouvez le voir, nous sommes imprimés jeudi à l'écran pour le quatrième élément. Une autre chose que nous pouvons faire avec une structuration de rayon consiste à utiliser l'opérateur rest pour collecter les valeurs restantes du tableau initial en une seule variable. Allons y aller. Nous supprimerons tout d'abord , sauf la variable. Et maintenant, utilisez l' opérateur rest pour collecter tout le reste dans une variable appelée jours restants. Mettez également à jour nos journaux de console. Ensuite, nous allons exécuter ce code. Cette fois, lundi est le premier élément. La variable jours restante contient désormais tout le reste du tableau, sauf lundi. 13. destructuring des objets: Bienvenue de retour. Nous allons introduire la structuration des objets. Commençons par répondre à la question. Quelle est la structuration ? Imaginez que vous visitiez un supermarché, vous choisissez des articles et des sacs Pac-Men. Lorsque vous rentrez chez vous un par un, vous déballez ces articles et vous les rangez. Lorsque nous écrivons du code, nous pouvons utiliser la structuration comme moyen de décompresser ou sélectionner certains éléments ou éléments de structures de données, tels que des objets et des tableaux. Ensuite, nous pouvons placer ces valeurs dans leurs propres variables indépendantes lorsque nous utilisons ces structures avec des objets, le nom des variables auxquelles les valeurs d'objet sont affectées est basé sur le nom de la propriété objet par opposition à l'index de l'élément. Lorsque nous effectuons une structuration prête, lorsque nous perturbons que vous soyez un tableau, nous utilisons des crochets. Mais lorsque nous structurons un objet, nous utilisons des accolades bouclées. Commençons par un exemple très basique. Nous allons créer une variable à l'aide de const, que nous appellerons l'objet R. Il s'agira d'un littéral d'objet à l'intérieur de l'objet qui aura deux propriétés. Le premier, nous utiliserons la clé, et elle aura la valeur 1. la seconde, nous utiliserons la clé, et nous aurons la valeur deux. Maintenant, nous pouvons utiliser la structuration va dire const, puis utiliser des accolades bouclées. Et nous allons définir cette valeur égale à l'objet. À l'intérieur des accolades bouclées ajouteront 12. Maintenant, consolons le journal 12. Nous allons enregistrer cela et nous allons exécuter le code. Nous obtenons les valeurs des 12 propriétés de notre objet. Lorsque vous sélectionnez les propriétés de l'objet que vous souhaitez sélectionner, la commande n'a pas d'importance. Si le nom de la propriété se trouve dans l'objet , une variable portant cette valeur sera stockée en mémoire avec le même nom. Jetons un coup d'œil à un exemple plus concret. Nous allons commencer par créer une nouvelle variable à l'aide de const. Nous appellerons ce chat, créera un autre objet littéral. Nous allons définir une propriété name et obtenir cette valeur de chaîne. Molly va alors définir une propriété propriétaire et obtenir mal cette chaîne. Vous êtes Fred qui bloque. Ensuite, nous allons définir la couleur, donnera à cela la ficelle brune. Nous allons définir une propriété d'âge et lui donner la valeur dix. Enfin, nous allons créer une propriété chatons, lui donnerons la valeur 0. Ensuite, nous pouvons utiliser une structure D pour obtenir le nom et le propriétaire. Nous allons donc commencer par utiliser un ensemble d'accolades bouclées. Et nous allons définir cela comme égal à notre objet, appelé chat. À l'intérieur des accolades bouclées placeront les noms des propriétés. Ajoutons des journaux de console pour ces derniers. Nous allons dire console.log, name, console.log. Sauvons ça. Et nous allons exécuter le code. Nous obtenons le Mali pour le nom imprimé à l'écran, et Fred bloque pour le propriétaire imprimé à l'écran. Dans la vidéo suivante, nous allons regarder cela un peu plus. 14. Plus de destructeurs d'objets: Bienvenue de retour. Que se passe-t-il avec les propriétés non définies ? Eh bien, si vous essayez de sélectionner une propriété qui n'existe pas dans l'objet d'origine, une variable sera créée avec ce nom, mais la valeur de la variable ne sera pas définie. Il n'y aura pas d'erreur générée moins étendre notre dernier exemple pour montrer cela. Supprimerait le nom et le propriétaire du destructeur. Pendant ce temps, nous ajouterons des pieds. Feet n'est pas une propriété de l'objet chat. Mais essayons de consoler le journal. Ceci. Je sauverai ça. Et nous allons y aller. Nous sommes imprimés à l'écran sans définition. Il n'y a pas de propriété feet dans l'objet chat, n'y a donc aucune valeur à attribuer à la variable. Examinons maintenant le changement de nom des propriétés. Si vous souhaitez nommer les variables, quelque chose de différent de celui de la propriété dans l'objet. Vous devez définir ce paramètre lorsque vous structurez la propriété à partir de l'objet. Pour ce faire, vous utilisez le nom de la propriété que vous souhaitez choisir parmi les deux-points de l'objet et le nom de la variable dans laquelle vous souhaitez stocker cette valeur. Voyons un exemple qui laisserait les pieds de la structuration. Cette fois, nous allons essayer d'accéder aux chatons, mais nous allons le renommer en enfants. On dira des chatons, des enfants du côlon. Ajoutons maintenant un journal de console pour enfants. sauverai ça et on va y aller. Nous recevons 0 imprimé à l'écran, ce qui correspond à la valeur de la propriété chatons à l'intérieur de l'objet chat. Tout comme lorsque nous effectuons une structuration de rayon, nous pouvons utiliser l' opérateur reste pour collecter tout ce qui reste dans une nouvelle variable. Examinons notre dernier exemple pour rassembler toutes les propriétés restantes dans une variable appelée enfants civils restants. Mais parlez-en à l'aide de l'opérateur de repos. Ajoute une variable appelée restante. Ajoute ensuite un journal de console pour la variable restante. Sauvons ça. Et nous allons exécuter le code. Nous voyons 0 pour les enfants retournés. Après cela, nous voyons toutes les autres propriétés et valeurs de l'objet chat, l'exception de la propriété chatons imprimée sur notre écran. 15. destructuring d'objets imbriqués: Dans cette vidéo, nous allons regarder le destructeur d'objets imbriqués. Dans la dernière vidéo, nous avons examiné le destructeur d'objets et nous pouvons également utiliser la structuration lorsque nous travaillons avec structures de données imbriquées telles que des objets imbriqués. Commençons par examiner la structuration d'un objet imbriqué qui est entouré d'un tableau. Nous allons créer une collection de chats, déclarerons une variable appelée chats et affectée à ce tableau. Ensuite, nous allons créer un objet. À l'intérieur de cet objet, le nom sera défini sur la chaîne Molly, la chaîne Fred chance en couleur. La chaîne brune, la valeur dix, et chatons les valeurs 0. Nous allons ensuite créer un deuxième objet. À l'intérieur de cet objet. Définissez le nom, l' ampoule sur Sally, la couleur sur le noir et les chatons sur 0. Créons un autre objet. Cette fois, nous allons définir le nom sur Poppy, phono, sur Alice Green. couleur. Taraudage. Trois chatons. 16. Plus de destructeurs d'objets imbriqués: Si nous voulions choisir le nom du chat dans le deuxième objet, c'est-à-dire Bob. Nous pouvons utiliser la structuration pour atteindre cet objectif, étant donné que l'objet est stocké dans un tableau, nous commençons par les crochets que le tableau utilise. Nous définissons cela comme égal au nom de la structure de données à partir de laquelle nous essayons de choisir les propriétés. Nous voulons accéder au deuxième objet. Ainsi, comme lorsque nous structurons des tableaux plats, nous pouvons utiliser une virgule pour ignorer un élément. Nous utilisons ensuite des accolades bouclées parce que nous voulons entrer dans l' objet et nous utilisons le nom de la propriété que nous voulons choisir dans l'objet, tout comme lorsque nous détruisons des valeurs d'un objet. Allons y aller. Nous utilisons donc const puis un ensemble de crochets. Nous définissons cela comme égal au nom de notre objet imbriqué, qui est le chat. À l'intérieur des crochets. Nous commençons par utiliser une virgule. Nous le faisons parce que nous voulons passer au deuxième objet. Ensuite, nous ajoutons un ensemble d'accolades bouclées. À l'intérieur des accolades, nous utilisons le nom de la propriété que nous voulons, qui est nom. Ajoutons maintenant un journal de console pour le nom. Nous allons sauver ça. Et nous allons exécuter le code. Bob renvoie Bob, qui est la valeur de la propriété name du deuxième objet. Ainsi, tout comme pour la structuration de l' objet, nous pouvons également donner à la variable un nom différent du nom de la propriété. Mettons à jour notre code pour y parvenir. Et nous utiliserons le nom du chat, le nom, le deux-points d' échelle après le nom, puis nous ajouterons le nom du chat. Changeons également notre journal de console en nom de chat. Nous allons enregistrer cela et nous allons exécuter le code. Bob revient toujours. Si nous travaillions avec un objet imbriqué entouré d'un objet, nous n'utiliserions pas de crochets lors de la structuration D. Nous utiliserions plutôt des accolades et le nom de l'objet dans lequel nous voulons choisir l'élément, suivi du nom de la propriété que nous voulons choisir. Mettons à jour notre structure de données, supprimerons les crochets, les remplacerons par des accolades. Ajoute également un avant le premier objet avant le deuxième objet et trois avant le troisième objet. Maintenant, dans notre restructuration changerions également les crochets en accolades, car nous travaillons maintenant avec des objets et des objets. Nous ajoutons ensuite la clé de l'objet, qui dans notre cas est deux, suivie d'un deux-points. Enregistrez ceci et exécutez le code. Bob revient toujours. Il s'agit du nom de la propriété dans le deuxième objet. 17. Déstructuration des paramètres de fonction: Bonjour. Dans cette vidéo, nous allons examiner les paramètres de la fonction structurante et JavaScript. Ces structures peuvent être utilisées entre parenthèses de la définition de la fonction, là où vous placez les paramètres. Vous effectuez cette opération afin de sélectionner les valeurs des arguments transmis à une fonction. Cela est très utile lorsque vous souhaitez uniquement utiliser certaines propriétés d'un objet au sein de la fonction. Cela ne fait aucune différence type de fonction que vous utilisez. Mais nous allons jeter un coup d'œil à un exemple qui utilise une fonction flèche. Donc deux d structurent un objet à l'intérieur des paramètres de fonctions. Nous plaçons un ensemble d'accolades à l'intérieur des parenthèses de la fonction. À l'intérieur des accolades bouclées, remplacez les propriétés de l'objet que nous souhaitons choisir. Nous allons commencer par déclarer une variable en utilisant const, que nous appellerons boissons, va attribuer à cela un littéral d'objet. À l'intérieur de cet objet va créer une propriété appelée cola. Prends ça. La valeur deux. Ajoutera de la limonade avec la valeur 1, le lait. La valeur trois. T. Avec la valeur deux. Café de valeur deux, et vin d'une valeur huit. Ensuite, nous allons créer une fonction flèche. Nous appellerons le prix des boissons chaudes. Le corps de la fonction retournera le total de l' ajout de thé et de café à partir des boissons. Objet. Pour choisir les propriétés du thé et du café, nous utilisons les accolades frisées dans les paramètres de la fonction, puis nous choisissons les propriétés du thé et du café. Appelons maintenant la fonction. Nous allons passer l'objet de boissons entier comme argument. Sauvons ça. Déplacez-vous dans le code. Nous en recevons quatre parce que T avait la valeur deux, et le café avait également la valeur deux. Ainsi, en les ajoutant ensemble, nous obtenons pour la prochaine vidéo, nous allons examiner la structuration d'un tableau à l'intérieur des paramètres des fonctions. 18. Plus de paramètres de fonction destructeur: Bienvenue de retour. Alors que la structuration à l'intérieur des fonctions, les paramètres sont le plus couramment utilisés avec des objets, mais peuvent également utiliser la même approche lorsque nous transmettons un tableau à une fonction. La seule différence est que dans les parenthèses de la fonction, nous enfermons les éléments que nous voulons choisir dans un tableau. L'ordre compte ici. Tout comme lorsque nous effectuons une structuration prête en dehors des paramètres de la fonction. Si nous voulons ignorer un élément, nous pouvons utiliser une virgule. Voyons un exemple. Nous allons commencer par déclarer une variable appelée noms. Attribué à ce tableau. À l'intérieur de la baie. Nous ajouterons les cordes, Frank, Ben , Tony et Pete. Créons maintenant une fonction flèche, que nous appellerons le nom d'impression. Cette fonction renvoie un littéral de modèle avec le deuxième troisième nom du tableau Names. À l'intérieur des parenthèses de la fonction. Nous avons arrêté d'utiliser une virgule car nous voulons passer au deuxième élément du tableau. Ensuite, nous déclarons les variables du deuxième troisième élément à stocker. Appelons maintenant la fonction de nom d'impression. Nous transmettrons l'ensemble du tableau de noms comme argument. Sauvegardons cela et nous allons exécuter le code. Luke et Ben reviennent. Les deuxième et troisième noms du tableau de noms. 19. Paramètres par défaut: Bienvenue de retour. Dans cette vidéo, nous allons introduire les paramètres par défaut. Si nous définissons une fonction qui nous oblige à utiliser certains paramètres, lorsque nous invoquons ou appelons la fonction, nous devons transmettre les valeurs des paramètres sous forme d'arguments. Jetons donc un coup d' œil à un exemple de base. Nous allons créer une déclaration de fonction appelée mon nom. La fonction prend deux paramètres, FirstName et LastName. À l'intérieur du corps de la fonction, un littéral de modèle sera renvoyé. Nous devons utiliser les coches arrière, interpeller les paramètres FirstName, LastName. Appelons maintenant la fonction. Nous transmettrons deux arguments, la chaîne Bob pour le paramètre FirstName et la chaîne du paramètre nom de famille. Sauvegardons cela et lançons le code. Bob MF revient. Cela fonctionne très bien, mais que se passe-t-il si nous oublions de transmettre l'un des arguments ? Regardons un autre coup d'œil. Nous allons supprimer le deuxième argument de l'appel de fonction. Nous allons enregistrer cela, réexécuterons le code. Cette fois, Bob indéfini est renvoyé. Nous ne transmettons pas un deuxième argument à l'appel de fonction. Lorsque la fonction s'exécute non définie, elle est renvoyée pour le deuxième paramètre. Si nous faisions des calculs mathématiques, cela causerait des problèmes plus importants, car nous ne pouvons pas utiliser non défini pour effectuer un calcul. Par conséquent, nous obtiendrions NaN pas un numéro renvoyé. Voyons voir, c'est en action. Nous supprimerons notre code. Nous allons créer une nouvelle fonction, que nous appellerons Awesome. Cela prendra deux paramètres, tau1 et tau2. À l'intérieur de la fonction retournera le total de addition par un et deux. Lançons la fonction. Mais ce qui ne transmet qu' un seul argument pour pow1, nous transmettrons la valeur 1. Sauvegardons cela et nous allons exécuter le code. Nous ne recevons pas de numéro renvoyé. Javascript ne peut pas ajouter de valeur non définie à un nombre, c'est pourquoi cela se produit. Comment pouvons-nous nous protéger contre cela ? Avant ES6, nous pouvions définir nous-mêmes des paramètres par défaut pour les fonctions. Si nous utilisons à nouveau l' exemple génial, nous pouvons voir comment cela fonctionne. À l'intérieur de la fonction géniale va créer une déclaration if. Utilisera le type d'opérateur pour vérifier l'égalité stricte. Indique si le paramètre Baotou est égal à non défini. convient de noter ici que le type d'opérateur renvoie une chaîne, c'est pourquoi, en utilisant une égalité stricte, nous devons vérifier si la chaîne pas définie plutôt que non définie. S'il est égal à non défini, nous allons définir le fichier sur la valeur trois. Sauvegardons cela et nous allons exécuter le code. Lorsque nous exécutons la fonction, nous en recevons quatre. Nous ne passons que l' argument pour val1. Val2 est défini sur la valeur par défaut de trois. Le total est égal à quatre. Nous comprenons maintenant pourquoi, dans la vidéo suivante, nous allons passer à la façon d'utiliser les paramètres par défaut ES6. 20. Autres paramètres par défaut: Bienvenue de retour. Par conséquent, depuis CS6, nous avons pu utiliser des paramètres par défaut, il suffit de définir la valeur par défaut du paramètre. Lorsque nous définissons le paramètre entre parenthèses de la fonction, si la valeur est transmise pour ce paramètre, lorsque la fonction est appelée , la valeur par défaut ne sera pas utilisée. Mais si aucun argument pour ce paramètre n'est transmis , la valeur par défaut sera utilisée. Test jetez un coup d'œil au dernier exemple, mais cette fois, nous utiliserons des paramètres par défaut utilisant le même code que l'exemple précédent. Nous allons définir le paramètre val2 pour qu'il utilise une valeur par défaut de trois. Nous pouvons ensuite supprimer l'instruction if du dernier exemple. Sauvegardons cela et lançons le code. On en a encore quatre. Nous ne passons pas d'argument pour le paramètre Baotou. La valeur par défaut de trois est donc utilisée et le retour total est quatre. Essayons encore une fois. Mais cette fois, nous allons passer un argument pour le paramètre Baotou. Nous allons passer en cinq. Sauvegardons cela et nous allons exécuter le code. Nous en avons six, c'est la valeur de retour. Comme nous ne transmettons aucun argument pour les deux paramètres, nous n'avons pas besoin de revenir aux des paramètres par défaut car les valeurs des arguments que nous transmettons dans lesquels on utilise un plus cinq équivaut à six. Nous pouvons utiliser des paramètres par défaut pour différents types de valeurs, y compris les chaînes et les tableaux. Revenons à notre code. Nous reviendrons sur un exemple antérieur. Nous allons changer notre fonction pour qu'on m'appelle mon nom. Les paramètres seront modifiés pour qu'ils soient FirstName. Et LastName modifie le corps de la fonction pour renvoyer un littéral de modèle. Nous allons donc utiliser des backticks. Interpellez les paramètres FirstName et LastName. Définissons un paramètre par défaut pour le nom de famille. Nous allons le définir comme égal à. Appelons maintenant la fonction Mon nom. Nous allons transmettre un argument pour le paramètre FirstName. Nous passerons à Bob. Nous ne transmettrons rien pour le paramètre du deuxième nom. Sauvegardons cela et lançons le code. Bob Murphy est tonique. Nous ne transmettons pas d'argument pour le deuxième paramètre. Le paramètre par défaut est utilisé. Si nous avions une fonction qui devait utiliser un tableau, nous pouvons l'utiliser comme paramètre par défaut, supprimons notre code. Nous allons créer une fonction appelée notre tableau. À l'intérieur des paramètres, un paramètre appelé R donnera à cela la valeur par défaut d'un tableau contenant un. 23 à l'intérieur de la fonction renvoie le paramètre r. Appelons notre fonction. Nous ne transmettrons rien pour l'argument. Sauvegardons cela et lançons le code. Nous obtenons le tableau de paramètres par défaut renvoyé contenant 123. 21. Répartition en fonctions: Bienvenue de retour. Dans cette vidéo, nous allons voir comment utiliser spread dans les fonctions JavaScript. Mais commençons par répondre à la question : qu'est-ce qui se répand ? L'opérateur de propagation a été introduit par ES6. Il se compose de trois points. En fonction de l'endroit et de la façon dont vous utilisez le spread, vous pouvez réaliser un certain nombre de choses. Les trois principales utilisations de la diffusion ou au sein fonctions, d'objets et de tableaux. La plupart des définitions de l'état de propagation, c'est-à-dire vous permettent d'étendre un itérable à un autre endroit tel qu'une variable. Un itérable est une structure de données laquelle vous pouvez parcourir une itération. Par exemple, lorsque nous parcourons chaque élément d'un tableau, nous effectuons une itération sur le tableau. Voyons pourquoi vous pourriez utiliser du pain. Javascript dispose d'un ensemble de méthodes attachées à l'objet mathématique intégré, ce qui permet de trouver le nombre minimum et maximal d'un ensemble de valeurs transmises. Lorsque nous utilisons ces méthodes. Ces méthodes et math.max et math.min. Si nous voulions trouver la valeur minimale à partir d'un ensemble de nombres, nous pourrions utiliser la méthode Math.min. Jetons un coup d'œil à la façon dont cela fonctionne. Nous commençons par l'objet mathématique. Nous appelons la méthode Min. Utilisez point et dites Min. À l'intérieur des parenthèses, nous passons quelques arguments, nous passerons en 10987. Lançons ça. Nous en recevons sept. Sous le capot. Javascript parcourt ces valeurs et renvoie la valeur la plus basse. C'est génial. Mais que se passe-t-il si nos valeurs sont stockées dans un tableau ? Essayons encore une fois. Mais cette fois, nous allons créer un tableau et le transmettre comme argument. L'utilisation de const se produirait une variable appelée valeurs affectées à ce tableau avec les valeurs 10987. Reprenons maintenant la méthode Min. Cette fois, nous transmettons des valeurs comme argument. Nous recevons NaN pas un numéro renvoyé. La raison en est que la fonction recevra l'ensemble du tableau sous la forme d'un seul argument. Il a besoin des valeurs du tableau en tant qu'arguments distincts. C'est ici que nous pouvons utiliser spread car le tableau sera divisé en éléments individuels. Essayons le même exemple, mais cette fois, en utilisant l'opérateur spread, appellera à nouveau la méthode principale. Cette fois-ci, utilisez l'opérateur de propagation. Nous transmettons des valeurs. Maintenant, nous en recevons sept. Si la propagation est utilisée entre parenthèses d' une fonction cool, en tant qu'argument, l' itérable transmis paramètres de la fonction sera divisé en arguments individuels. Lorsque nous utilisons spread avec notre exemple, la fonction reçoit quatre arguments distincts. 22. Plus de diffusion dans les fonctions: Bienvenue de retour. Dans la dernière vidéo, nous avons présenté l'opérateur de propagation. Nous sommes également en mesure d'utiliser le spread à l'intérieur de la fonction. Jetons un coup d'œil à ça. Si nous listons les paramètres seront utilisés à l'intérieur des parenthèses de la fonction et transmettront un itérable en utilisant spread. Lorsque nous appelons la fonction, nous pouvons accéder aux différents éléments. Jetons un coup d'œil à ça. Nous allons commencer par utiliser une déclaration de fonction. Pour une fonction appelée total. Cela prendra trois paramètres. Nous appellerons ça vite. Deuxièmement. Troisièmement, à l'intérieur du corps de la fonction. Nous allons les résumer ensemble. Après la fonction. Créons un tableau qui sera affecté à une variable à l'aide de contenu. Dans le tableau, placera les valeurs 123. Appelons maintenant la fonction totale dans un journal de console. L'utilisation de l'opérateur de propagation passera dans le tableau de voyelles. Sauvegardons cela et nous allons exécuter le code. Nous en obtenons six comme valeur de retour. Lorsque la fonction totale est appelée, le tableau de valeurs est transmis à la fonction totale en tant qu'argument. Il utilise l'opérateur de propagation. Le tableau est donc divisé en éléments individuels. Lorsque la fonction est exécutée. Le premier est défini sur un, le second est défini sur et le troisième est défini sur trois. Par conséquent, six sont retournés. 23. Présentation de la propagation dans les objets: Bienvenue de retour. Dans cette vidéo, nous allons examiner l'utilisation de spread dans les objets JavaScript. Commençons par une introduction rapide. Lorsque nous utilisons l' opérateur de propagation dans un objet, nous pouvons copier des propriétés un objet vers un autre objet, et nous pouvons combiner différents objets dans un objet de destination. Nous pouvons également aller plus loin et étendre l'objet de destination pour qu'il contienne les objets copiés ainsi que des propriétés supplémentaires. Jetons donc un coup d'œil à un exemple. Utilisation de const. Nous allons créer une variable appelée Alien. Nous allons attribuer à cette propriété une espèce avec la valeur de chaîne. Alien lui donnera également une propriété d'armes d'une valeur cinq. Ensuite, nous allons créer un autre objet que nous appellerons OVNI. À l'intérieur de l'objet OVNI, nous utiliserons l'opérateur de propagation pour copier l'objet extraterrestre. Ajouterait également une propriété legs avec la valeur cinq. Ajoutons maintenant un journal de console pour UFO. Nous allons enregistrer cela et nous allons exécuter le code. Lorsque nous exécutons le code, nous obtenons un objet qui possède toutes les propriétés de l'objet extraterrestre et de la propriété legs supplémentaire. Il y avait quelques éléments à garder à l'esprit lorsque vous utilisez l' opérateur de propagation avec des objets. Lorsque l'objet dans lequel vous étirez et que l'objet parent a des propriétés conflictuelles, convient de rappeler que la propriété sera écrasée. La valeur finale de la propriété sera la dernière qui était rouge lors de l'exécution du programme. Jetons un coup d'œil à ça. Ajoutons une propriété feat à notre objet extraterrestre. Nous obtiendrons cette valeur neuf. Ajoutons également une propriété feat à notre objet OVNI. Cette fois, nous allons donner à cela la valeur de six. Sauvons ça. Et nous allons exécuter notre code. Lorsque le code s'exécute, l'objet renvoyé possède la propriété pieds avec la valeur six. En effet, lorsque le code s'exécutait, UFO était le dernier objet à définir la propriété feet. 24. Étalement dans les objets: Lorsque vous travaillez avec l'opérateur de propagation et les objets, vous pouvez copier des objets copiés. Jetons un coup d'œil à un exemple. Nous garderons nos objets extraterrestres et OVNI identiques, mais nous ajouterons un autre objet appelé OVNI copié. À l'intérieur de cet objet en utilisant spread, nous copierons l'objet OVNI. Nous allons mettre à jour notre journal de console pour afficher l'objet OVNI copié. Sauvegardons cela et lançons le code. L'objet UF copié renvoie simplement une copie de l'objet OVNI. Nous obtenons donc les mêmes propriétés renvoyées lorsque nous utilisons un journal de console pour l'objet OVNI copié. Il convient de noter ici que l' opérateur de propagation avec des objets ne fait qu'une copie superficielle de l'objet. L'adresse de l' objet est copiée. Les deux objets ne seront pas strictement égaux car ils sont stockés par référence et non par valeur. Nous pouvons clarifier cela en modifiant notre journal de console pour vérifier si l'OVNI est strictement égal à l'OVNI copié. Sauvegardons cela et lançons le code. On se fait faux. Pour cette raison, les instances imbriquées de l'objet ne seront pas copiées. Jetons un coup d' œil à un exemple du fonctionnement de la copie superficielle. Après l'objet OVNI copié. Modifions les objets OVNI comme propriété pour qu'ils soient égaux à un. Nous allons mettre à jour notre journal de console pour imprimer l'objet OVNI copié. Nous allons également ajouter un journal de console pour afficher l'objet OVNI. Sauvegardons cela et lançons le code. Lorsque nous mettons à jour la propriété legs sur l' objet UFO et la console, consignez l'objet OVNI copié. Nous pouvons constater que la propriété legs de l'objet OVNI n'a pas été affectée. Lorsque nous déconnectons l'objet OVNI sur la console, nous pouvons voir qu'il s'agit maintenant d'un objet OVNI. Toutefois, si nous modifions la propriété dans un objet imbriqué, les deux objets seront modifiés. Jetons un coup d'œil. Ajoutons une nouvelle propriété à notre objet OVNI appelée journey. Cela fera de cela un objet. À l'intérieur de cela, nous allons définir une propriété de longueur. Nous allons donner la valeur de 9 000. Après avoir mis à jour la propriété UFO Legs, mettons également à jour notre propriété de longueur de voyage. Nous disons la longueur du point de voyage OVNI, et nous la fixerons à dix. Console ne consignons que l'OVNI copié cette fois. Sauvegardons cela et lançons le code. Lorsque le code s'exécute, nous pouvons voir que même si les jambes ne sont pas modifiées dans l'OVNI copié, la propriété length le fait. 25. Plus de propagation avec des objets: Nous connaissons maintenant l'opérateur de propagation dans les objets. Voyons comment cela fonctionne avec différentes structures de données. Vous ne pouvez répartir des objets que dans des objets. Vous ne pouvez pas étendre un objet dans un tableau. Nettoyons notre code. nous reste donc que l'objet extraterrestre. Maintenant, créons une variable à l'aide de const. Est-ce que notre tableau pourrait. Nous allons attribuer à cela un tableau. L'utilisation de spread va essayer de copier l'objet extraterrestre. Sauvegardons cela et lançons le code. Nous obtenons une erreur de type non capturée avec le message « alien » n' est pas itérable. Ce que nous pouvons faire, c'est étendre un objet dans un objet d'un tableau. Essayons donc ceci et corrigeons notre code. À l'intérieur de notre réseau. Nous allons enrouler l' opérateur à l'intérieur d'accolades bouclées. Sauvegardons cela et lançons le code. Cela fonctionne. Nous obtenons un tableau avec l'objet extraterrestre renvoyé. Vous pouvez également répartir un tableau dans un objet, mais vous obtiendrez des paires clé-valeur basées sur les indices des éléments. Supprimons tout notre code. Nous allons créer une variable en utilisant des lettres appelées const. À l'intérieur de ce tableau ajoutera a, B et C. Ensuite, créons un autre tableau appelé Alphabet. Nous allons attribuer à cela un objet à l'aide de spread. Nous allons copier des lettres. Ajoutons également un journal de console pour Alphabet. Nous allons enregistrer cela et nous allons exécuter le code. Nous recevons des paires clé-valeur renvoyées avec chaque lettre. 26. Étalement dans des réseaux: Bonjour. Dans cette vidéo, nous allons voir comment utiliser le spread dans les tableaux JavaScript. Maintenant que nous avons appris à utiliser l'opérateur de propagation avec des fonctions, voyons comment utiliser l'opérateur spread avec des tableaux. Lorsque vous travaillez avec des baies, si vous souhaitez faire une copie d' un tableau ou combiner plusieurs baies , l'opérateur de propagation est très utile. Lorsque vous utilisez l' opérateur de propagation dans un tableau. Il répartira le contenu dans un autre tableau. La ou les baies d'origine restent inchangées. Voyons un exemple de base. Nous allons commencer par utiliser const pour créer une variable appelée en premier. Nous allons initialiser cela avec un tableau contenant 13. Ensuite, nous allons créer une autre variable à l'aide du code codons. Deuxièmement, initialisez ceci avec un tableau contenant 456. Créons maintenant une variable appelée compte six. Nous allons initialiser cela avec un tableau. Mais à l'intérieur de ce tableau utilisera spread pour copier dans le rapide. Et aussi le deuxième effacement. Ajoutons un journal de console pour compter jusqu'à six. Nous allons enregistrer cela et nous allons exécuter le code. Nous obtenons un tableau unique contenant tous les éléments des premier et deuxième tableaux. Lorsque vous utilisez l'opérateur de propagation avec la hausse, il convient de noter que l'ordre est important en fonction de la façon dont vous souhaitez que les éléments du tableau soient classés. Nous pouvons également ajouter des éléments supplémentaires à ceux où nous utilisons l'opérateur de propagation. Jetons un coup d'œil à cela dans notre prochain exemple. Dans notre code, nous allons changer notre nombre en six tableaux, appelé nombre à sept. À l'intérieur du tableau, nous ajouterons la valeur sept. Mettons à jour notre journal de console enregistrer cela et nous allons exécuter le code. Cette fois. Nous obtenons les sept valeurs répertoriées dans le tableau de compteurs sept. Si vous utilisez spread pour copier les tableaux, ils ne seront pas égaux les uns aux autres car les tableaux sont stockés par référence et non par valeur. Il s'agit donc d'une référence à la baie stockée dans la mémoire de l'ordinateur. Ce n'est pas les valeurs des tableaux eux-mêmes. Mais cela ne s'applique pas aux structures de données imbriquées. Revenons à notre code et supprimons tout. Nous allons commencer par déclarer une variable à l'aide du code const. tableau initial attribuerait à ce tableau un tableau qui contiendra les lettres a, b et c. Ensuite, nous allons créer une autre variable, cette fois le tableau initial de copie de code. Nous allons attribuer à cela un tableau. À l'aide de l'opérateur spread, copiera le tableau initial dedans. Maintenant, en utilisant l'opérateur d' égalité stricte, comparons le tableau initial et le tableau initial de copie à l'intérieur d' un journal de console enregistrera cela et nous allons exécuter notre code. On se fait faux. Et c'est parce que les tableaux sont stockés par référence et non par valeur. Il s'agit d'une référence à la baie stockée dans la mémoire de l'ordinateur, non aux valeurs de la baie elle-même. 27. Présentation du paramètre de repos: Bienvenue de retour. Dans cette vidéo nous allons examiner l'utilisation des paramètres de repos, mais commençons par examiner les arguments de fonction. Lorsque nous créons une fonction, nous définissons souvent des paramètres à utiliser dans le corps de la fonction, nous transmettons les valeurs ces paramètres lorsque nous appelons ou invoquons la fonction, nous appelons ces arguments de valeurs. Jetons un coup d'œil à un exemple de base. Nous allons commencer par créer une déclaration de fonction appelée Add. Cela prendra deux paramètres par un. Et val2. À l'intérieur du corps de la fonction, le total de l'ajout par L1 et L2 sera renvoyé . Ensuite, nous appellerons la fonction. Nous allons en passer un. Et pour les arguments. Sauvons ça. Et nous allons exécuter le code. Nous obtenons cinq rendements est-ce que le total en ajoutant 14 ensemble ? Javascript fournit un objet appelé objet arguments , accessible depuis l'intérieur d'une fonction. L'objet argument ressemble à un tableau, mais il ne s'agit pas d'un tableau. Si vous ne pouvez pas utiliser de méthodes re moins de le convertir en tableau, l'objet arguments est une liste. Les éléments ont des indices, et nous pouvons donc passer en boucle sur les éléments à l'aide d'une boucle for-loop. Jetons un coup d'œil à l'exemple précédent. Au lieu d'additionner les paramètres, vous ajouterez un journal de console pour l'objet arguments. Sauvegardons cela et lançons le code. Cette fois, nous voyons l' objet arguments imprimé sur la console. Lorsque la fonction d'ajout est appelée, nous transmettons deux arguments. Nous pouvons les voir dans l' objet arguments imprimé à partir du verrou de la console dans la fonction. Si nous voulions accéder aux arguments, nous pouvons le faire en utilisant les indices des arguments. Essayons de mettre en œuvre cela. À l'intérieur de la console, log utilise les indices 01 pour accéder aux éléments. Maintenant, sauvegardons cela et lançons le code. Cette fois, nous pouvons voir les arguments que nous avons passés dans la fonction d'ajout 14 imprimés sur la console. Nous pourrions également utiliser une boucle pour parcourir les arguments, comme nous le ferions avec un tableau. Implémentons cela dans notre corps de fonction pour ajouter une boucle, donc nous utilisons le mot-clé complet. Utilisera la variable I, et nous la définirons à 0. Nous dirons que je suis inférieur à la longueur du point d' arguments, puis nous incrémenterons i. Chaque fois que la boucle s'exécute. Le corps de la boucle, nous consolerons les arguments du journal de I. Sauvegardons cela et nous allons exécuter le code. Chaque argument est imprimé sur la console, un puis quatre. Dans notre cas, nous pourrions ajouter des arguments supplémentaires à l'appel de fonction. Ainsi, même s'ils ne figurent pas dans les paramètres de la fonction, ils seront toujours imprimés sur la console. Ajoutons 56 autres. Enregistrez ça. Je suis en train de lancer le code. Tous les arguments que nous avons transmis sont imprimés sur la console. Il convient de noter que nous ne pouvons pas accéder à l'objet arguments lorsque nous utilisons une fonction flèche. Si nous essayons de le faire, nous obtiendrons une erreur. Voyons un exemple rapide. Nous allons donc changer notre fonction en fonction de flèche. Maintenant, sauvegardons cela et lançons le code. Cette fois, nous obtenons une erreur de référence indiquant que les arguments ne sont pas définis. Dans la vidéo suivante, nous allons passer au paramètre reste. 28. Utilisation du paramètre de repos: Bienvenue de retour. Es6 a introduit le paramètre reste. Cela nous permet de résoudre les mêmes problèmes que l'objet arguments, mais c'est beaucoup plus simple. La syntaxe du paramètre rest est la même que celle de l'opérateur de propagation. Nous utilisons donc trois points, mais cela fonctionne très différemment. Le paramètre rest collectera tout dans un tableau unique si nous voulons utiliser une fonction qui accepte un nombre quelconque d'arguments ou si nous avons une longue liste d'arguments à transmettre à une fonction telle que l'alphabet. Il est très utile d'utiliser le paramètre reste. Nous le plaçons à l'intérieur des parenthèses des fonctions à l'aide de trois points suivis d'un nom afin de pouvoir accéder au tableau depuis l'intérieur de la fonction. Jetons un coup d'œil à un exemple. Changeons notre fonction d' ajout de la dernière vidéo à une déclaration de fonction. Maintenant, utilisons le paramètre rest, appellerons des valeurs à l'intérieur des parenthèses des fonctions. Nous ajouterons également un journal de console pour les valeurs du corps de la fonction. Sauvons ça. Et nous allons exécuter le code. Lorsque le code s'exécute, nous obtenons un tableau. Il existe certaines différences avec le paramètre rest par rapport à l'objet arguments. Le paramètre rest renvoie uniquement les arguments restants qui n'ont pas encore été mis en correspondance avec le paramètre précédent. Par conséquent, si nous devions définir un paramètre pour la valeur 1, les valeurs absentes ne contiendront désormais qu'un seul élément. Jetons un coup d'œil à ça. À l'intérieur de la fonction d'ajout, les paramètres ajouteront la valeur 1 pour le premier paramètre. Gardons ensuite le paramètre reste pour le deuxième paramètre. Sauvons ça. Et nous allons exécuter le code. Cette fois. Lorsque le code s'exécute, nous n'en obtenons que quatre comme valeur renvoyée car l'argument 1 est défini comme valeur un paramètre. Par conséquent, le seul argument restant concerne si vous souhaitez définir paramètres et utiliser le paramètre reste, est important de considérer que vous devez définir les paramètres avant d'utiliser le paramètre rest, étant donné que le paramètre reste renvoyé correspond aux valeurs restantes. Si vous utilisez d' abord le paramètre rest , puis que vous définissez la valeur un paramètre, vous obtiendrez une erreur de syntaxe. Changeons notre code, montrons comment cela se produirait. Nous allons modifier l'ordre de nos paramètres. Le paramètre reste est utilisé en premier. Sauvons ça. Et nous allons exécuter le code. Nous obtenons une erreur de syntaxe non détectée, qui indique que le paramètre rest doit être le dernier paramètre formel. Enfin, nous sommes également en mesure d'utiliser le paramètre rest à l'intérieur d'une fonction de flèche. Contrairement à l'objet arguments, modifions notre code pour l'implémenter. Modifie la déclaration de fonction pour qu'elle soit une fonction de flèche qui modifiera les paramètres pour utiliser uniquement le paramètre reste. Sauvegardons cela et lançons le code. Cette fois, nous recevons tous les arguments que nous avons transmis lorsque le code s'exécute 14 sur notre écran. 29. Présentation pour chaque: Dans cette vidéo, nous allons présenter la méthode FoReach. Javascript dispose d'un ensemble de méthodes d'assistance de tableau introduites dans ES6. Si vous connaissez les bibliothèques telles que le soulignement ou le tiret bas, certaines de ces méthodes peuvent vous être déjà familières. Dans ES6, ils ont été introduits dans le langage JavaScript. bonnes méthodes d'aide nous aident à manipuler et à utiliser les données stockées dans un tableau. Dans cette vidéo, nous allons présenter l'une de ces méthodes qui est appelée pour chacun. Qu'est-ce que c'est pour chacun ? Eh bien, pour chaque fonction appelée une fois par chaque élément d' un tableau qui commence par un exemple très basique d'utilisation pour chacun, nous commencerons par déclarer une variable utilisant const donnera à cela le identificateur. Nos numéros vont initialiser cela à l'aide d'un tableau. Et dans le tableau, nous allons mettre quelques chiffres. Ensuite, nous utilisons la méthode FoReach. Nous appelons FoReach sur notre tableau de numéros. Dans les paramètres de la méthode, nous passons une fonction anonyme. Nous pouvons nommer le paramètre de fonction anonyme tout ce que nous voulons, mais il représente l'élément individuel. Nous appellerons le paramètre dans notre numéro d'exemple. À l'intérieur du corps, nous allons consigner la valeur du paramètre de numéro dans la console . Sauvegardons cela et lançons le code. Lorsque le code s'exécute, nous récupérons chaque élément du tableau de nombres impairs, l' imprimons sur notre écran. Récapitulons quelques points avant de passer à autre chose. Lorsque nous utilisons pour chacun, la fonction de rappel acceptée par la méthode est appelée une fois par chaque élément du tableau qui utilise la méthode FoReach. Il est généralement logique d'utiliser une fonction anonyme pour le rappel car le code ne sera pas réutilisé. Mais nous pourrions passer à la méthode une fonction nommée si nous le voulions. Voyons comment nous ferions cela, conserverons notre code actuel, mais après avoir créé le tableau de nombres impairs utilisera une déclaration de fonction, que nous appellerons numéro d'impression. Plus d'ensemble de paramètres numériques. À l'intérieur de la fonction, nous allons consigner le paramètre de numéro de la console. Maintenant, lorsque nous appelons chacun, nous transmettrons simplement le numéro d'impression car le paramètre supprimera tout le reste. Sauvegardons cela et lançons le code. Nous obtenons la même valeur de retour. En guise de note, nous passons une référence à la fonction pour, pour chacune d'elles. N'oubliez pas que nous n' utilisons pas de parenthèses lorsque vous transmettez la fonction comme celle-ci. Mais qu'en est-il des boucles ? Nous pourrions obtenir le même résultat que dans notre exemple en utilisant une boucle. Comparons quelques exemples. Nous allons créer une boucle for of après le tableau de nombres. Nous dirons donc que, à l'intérieur des parenthèses, une variable sera déclarée à l'aide de nums à gauche. Ensuite, nous parlerons des chiffres. À l'intérieur de la boucle, nous allons consoler les numéros des journaux. Sauvegardons cela et lançons le code. Nous obtenons le même résultat à la fois du cool aussi pour chacun et de notre boucle en utilisant à la fois une boucle for et une boucle for of fournit la même sortie utilisée pour chacun. Le choix de celui à utiliser se résume vraiment à ce que vous essayez de réaliser. Mais l'utilisation pour chacun d'entre eux est généralement moins sujette aux erreurs , car vous avez moins de configuration à vous inquiéter. L'utilisation de FoReach est souvent plus lisible. Dans la vidéo suivante, nous allons examiner quelques exemples supplémentaires d'utilisation pour chacun d'eux. 30. Utilisation pour chaque: Dans cette vidéo, nous allons examiner quelques exemples supplémentaires d'utilisation de FoReach qui utilisera le même code que l'exemple précédent. Mais cette fois, nous allons en ajouter un à chaque élément. De retour dans notre code. Nous disons simplement numéro plus un. Sauvegardons cela et lançons le code. Nous obtenons chaque élément de nos chiffres avec un élément ajouté à chaque valeur. Si nous voulions accéder à l'index de l'élément, nous pourrions simplement lui passer un autre paramètre après le paramètre number. Allons y aller. Nous ajouterons le paramètre d'index après numéro, puis nous allons consoler le numéro de journal et l'index. Sauvegardons cela et lançons le code. Nous obtenons chaque numéro à partir du tableau de nombres impairs imprimé, puis de l'index de chaque élément également. Nous aimerions peut-être obtenir la somme totale du tableau de nombres impairs en utilisant pour chaque fois que nous pourrions atteindre cet objectif. Allons y aller. Après avoir créé le tableau de nombres impairs, nous créerons une variable à l'aide de LED, que nous appellerons certains, qui initialisera avec les valeurs 0. Nous pouvons penser à cela un peu comme un tracker, qui conservera le total total de nos éléments au fur et à mesure que chaque élément est total. À l'intérieur de chacun, nous ajoutons ensuite le numéro qui représente l'élément actuel au soleil. Nous consignons ensuite le total de la somme, qui est le total de tous les éléments du tableau de nombres impairs ajoutés ensemble. Sauvegardons cela et lançons le code. Nous obtenons le total de tous les éléments additionnés pour chacun d'entre eux est particulièrement utile lorsque nous travaillons avec des données imbriquées. Voyons un exemple. Nous allons déclarer une variable appelée étudiants. Attribuerait à cela un tableau à l'intérieur du lieu d'arrivée trois objets. L'objet rapide que nous avons donné son nom à Anna à 50 ans. Dans le deuxième objet, le nom Pete sera défini à 20 ans. Le troisième objet va définir le nom. Api, jusqu'à 12 ans. Utilisera ensuite pour chacun des élèves. Nous disons donc les étudiants. Pour chacun d'entre eux. Nous passons au rappel. Et nous avons défini le paramètre comme étudiant. Nous allons consigner le nom de l'étudiant en consoles à l'aide de la méthode ToupperCase. Faites ensuite glisser ceci et exécutez le code. Chaque nom est imprimé à l'écran à partir de la structure de données des étudiants avec chaque nom en majuscules. 31. Présentation de la carte: Dans cette vidéo, nous allons regarder la carte. Que fait la carte ? Lorsque nous utilisons la carte, nous pouvons créer un nouveau tableau à partir d'un tableau préexistant. Nous transmettons une fonction de rappel, et cette fonction est appelée sur chaque élément du tableau. À l'aide de cette méthode, vous pouvez créer un nouveau tableau en effectuant quelque chose sur les éléments d'origine. Voici quelques exemples de ce que vous pouvez faire avec la carte : choisir certains éléments, simplement dupliquer le tableau. Bien que la propagation soit plus simple pour cela, ou manipuler les données du tableau d'une manière ou d'une autre. Il y a quelques points clés lorsque vous travaillez rapidement avec la carte, vous devez retourner quelque chose. Sinon, vous obtiendrez un nouveau tableau rempli de caractères non définis pour chaque élément. Vous devez également stocker l' appel à mapper dans une variable. Sinon, vous n'aurez aucune référence au nouveau tableau. Le tableau initial n' est pas modifié, mais un nouveau tableau est créé lorsque nous utilisons la carte. Examinons quelques exemples. Si vous aviez un tableau de valeurs, mais que vous vouliez doubler chacune des valeurs. La carte nous permet de le faire. Nous allons commencer par déclarer une variable appelée valeurs. Et nous allons attribuer à cela un tableau contenant dix, 20304050. Ensuite, nous allons déclarer une autre variable appelée doublée. Cela stocke la valeur renvoyée à partir de l'utilisation de mathématiques. Appelle la carte sur le tableau de valeurs. Nous disons une carte de points de valeurs. Ensuite, nous passons le rappel. Nous allons définir le paramètre de chaque élément comme étant une valeur. Nous retournons ensuite la valeur multipliée par deux. Consolons maintenant les valeurs du journal. Nous allons également doubler le journal de la console. Sauvegardons cela et lançons le code. Rien n'a été modifié dans le tableau de valeurs car la méthode ne mutera ni ne modifiera le tableau d'origine. Cependant, lorsque nous regardons doublé, qui est le tableau renvoyé à partir de l'utilisation de la carte, nous pouvons voir que les éléments du tableau de valeurs ont été doublés. Il convient de noter que nous passons une fonction anonyme est le rappel à la carte. Vous pouvez passer une fonction nommée ici. Mais comme nous ne l'utilisons qu'une seule fois, une fonction anonyme est souvent plus appropriée. Nous pourrions donc facilement obtenir le même résultat avec une boucle for-loop. Mais le code sera beaucoup plus compliqué et donc sujette à des erreurs. Mais jetons un coup d'œil à la façon dont nous faisons cela. Nous commenterons le premier exemple. Nous garderons le tableau de valeurs créera également une variable appelée doublée. Nous allons attribuer à cela un tableau vide. Ensuite, nous allons créer une boucle for-loop. À l'intérieur de la boucle, poussera chaque élément multiplié par deux dans le tableau doublé. Enregistrez ceci et exécutez le code. Nous obtenons la même sortie qu'avant, mais le code est un peu plus complexe. Dans la prochaine vidéo, nous allons revenir à la carte. 32. Utilisation de la carte: Bienvenue de retour. Dans cette vidéo, nous allons examiner quelques autres exemples d'utilisation de la carte. Nous pouvons utiliser la carte pour manipuler un tableau de chaînes tout aussi facilement que lorsque nous avons travaillé avec un tableau de nombres. Nous allons prendre un tableau de salutations majuscules et les renvoyer toutes en minuscules. Nous allons commencer par créer une variable appelée salutations. Je vais attribuer à cela un tableau contenant les chaînes majuscules. Par quoi de neuf. Ensuite, nous allons créer une autre variable appelée salutations formatées. Attribué à cela le résultat de l' appel de la carte sur le tableau de salutations. Nous disons une carte de points de salutation. Ensuite, nous passons le rappel. Nous allons définir le paramètre « salutation ». Ensuite, nous tournerons le message d'accueil en utilisant la méthode à deux minuscules. Ajoutons les journaux de la console aux salutations. Et aussi des salutations formatées. Enregistrera cela et exécutera le code. Rien n'a changé pour le tableau de salutations car ce tableau n'est pas muté. Le tableau de salutations formaté, qui est le tableau renvoyé par la carte, contient chaque message d'accueil du tableau de salutations, mais avec chaque chaîne en minuscules, si nous n'avions pas imbriqué la structure de données et souhaitait choisir l'une des propriétés, puis créer un tableau avec ces valeurs. La carte est également idéale. Jetons un coup d'œil à ça. Nous allons créer une variable à l'aide de const, que nous appellerons que les étudiants affecteront à cette variable et à la matrice. Ce tableau contiendra trois objets. Dans le premier objet, nous définissons une propriété name. Nous obtenons cette valeur. Anna fixerait également une propriété d'âge et lui attribuerait la valeur 50. Le deuxième objet que nous avons défini le nom de Pete et l'âge de 20 ans. Le troisième objet, nous avons défini le nom Abby et l'âge de 12 ans. Nous allons maintenant créer une variable en utilisant âges des étudiants du code const. Nous allons attribuer à cela le résultat de l'utilisation de la carte. La structure de données des étudiants. Nous définissons le paramètre du rappel en tant qu'étudiant. Ensuite, nous retournons la valeur de l'étudiant. Ajoutons un journal de console pour les âges des étudiants. Nous sauvegarderons cela et exécuterons le code. Nous obtenons un tableau contenant les âges de la structure de données des étudiants. Nous pourrions également renvoyer un tableau d'objets à partir de la carte. Nous allons à nouveau utiliser le tableau des étudiants. Mais le format des valeurs changera le nom en minuscules. Et nous en ajouterons un à chacun des âges des élèves. Modifions la variable d'âge des étudiants pour qu'elle soit mise à jour. Supprimons le retour. Nous allons modifier cela pour renvoyer un objet. À l'intérieur de l'objet, nous ajouterons le nom de la clé en minuscules. Nous allons définir la valeur de cela pour être étudiant. Nom du point, point deux minuscules. Nous allons également définir une autre clé pour être h plus une. Nous définirons la valeur de cette valeur comme point étudiant plus un. Modifions notre journal de console pour afficher les étudiants mis à jour. Enregistrera cela et exécutera le code. Nous obtenons un tableau contenant trois objets avec les propriétés que nous avons définies dans notre rappel lorsque nous utilisons la méthode de carte, nom en minuscules et l'âge plus un. J'ai discuté du fait de ne rien renvoyer à l'intérieur de la chauve-souris cool à la carte. Il entraîne le renvoi d'un tableau de valeurs non définies. Voyons un exemple de cela. Je dirigerais tout notre code. Nous allons créer une variable appelée lettres. Cela a été attribué à un tableau, qui contiendra les chaînes a, b et c. Créons une autre variable appelée majuscules. Cela permettra de stocker notre tableau renvoyé à partir de l'utilisation de la carte. Nous appellerons la carte des lettres. Nous allons passer le rappel. Nous allons définir le paramètre sous forme de lettre. Ensuite, on dira lettre point. Toupper case. Sachez que nous n' utilisons pas retour ici. Ajoutons un journal de console pour les lettres. Ajoutons également un journal de console en majuscules. Nous sauvegarderons cela et exécuterons le code. Nous obtenons le tableau de lettres comme prévu, car la carte ne mute pas le tableau d'origine. Cependant, pour les majuscules, nous obtenons un tableau renvoyé avec indéfini pour chaque élément. Nous n'avons pas utilisé le retour, donc cela est attendu. Ajoutons le retour à notre rappel. Enregistrera cela et exécutera le code. Cette fois, nous obtenons le tableau rempli de lettres majuscules. 33. Utilisation du filtre: Bienvenue de retour. Dans cette vidéo, nous allons examiner l'utilisation la méthode de filtrage en JavaScript lorsque nous travaillons avec des baies L' une des tâches courantes que nous devrons peut-être accomplir est de filtrer certaines données de la baie. Peut-être voulons-nous simplement renvoyer l'élément impair ou pair dans un tableau de nombres. Peut-être voudrions-nous que le tableau renvoie uniquement des chaînes contenant certains caractères lorsque nous avons ce type de scénario, la méthode de filtre de tableau peut être extrêmement utile. Comment utiliser la photo pour utiliser la méthode de filtre, nous passons à la méthode un rappel. Habituellement, il s'agit d'une fonction anonyme, bien que nous puissions transmettre une référence à une fonction, la fonction de rappel que nous transmettons agit comme une fonction de test et doit renvoyer une fonction booléenne si vraie ou fausse. Si l'élément réussit cette fonction de test et que la valeur est renvoyée, l'élément sera ajouté au tableau renvoyé. Si l'élément ne réussit pas la fonction de test , l'élément ne sera pas ajouté au tableau renvoyé. Le tableau d'origine n'est pas muté lorsque vous utilisez la méthode de filtre. Comme pour les autres méthodes de santé des rayons, nous pourrons peut-être atteindre résultat souhaité en utilisant une boucle for-loop. En général, la méthode de santé du tableau nous permet d'écrire un code plus lisible et extensible. Commençons par regarder un exemple qui renvoie les nombres pairs à partir d'un tableau de valeurs. Nous allons commencer par le faire avec une carte for-loop. Déclarer une variable à l'aide de const, que nous appellerons des valeurs, va initialiser cette variable avec un tableau. À l'intérieur de la baie, nous ajouterons quelques chiffres. Ensuite, nous initialisons une autre variable, que nous appellerons résultats. Nous utilisons ensuite une boucle for, qui parcourt le tableau de valeurs. Dans la boucle for-loop, si l'élément est égal, l'élément sera poussé dans le tableau de résultats. Ajoutons un journal de console pour le tableau de résultats en dehors de la boucle. Nous allons enregistrer cela et exécuter le code. Nous voyons que le tableau ne contient que les éléments pairs. Cela fonctionne, mais si nous utilisons la méthode du filtre , une partie du travail serait fait pour nous et nous aurions un code susceptible d'être moins sujet aux erreurs. Examinons le même exemple, mais cette fois, à l'aide de la méthode de filtre, nous utiliserons le même tableau stocké dans la variable de valeurs, mais nous supprimerons le reste du code. Ensuite, créez une autre variable appelée résultats. Cela stocke le nouveau tableau qui sera renvoyé à partir de l'utilisation du filtre. Nous appelons la méthode de filtre sur les valeurs et vérifions si la valeur est égale. Sauvegardons cela et lançons le code. Lorsque nous consignons les résultats de la console, nous recevons le même tableau que lorsque nous utilisons la boucle for. Il y a quelques éléments à prendre en compte lorsque vous utilisez cette méthode, il convient de rappeler que lorsque nous utilisons le filtre, le tableau d'origine ne change pas ne change donc pas. Nous pouvons comparer les baies d'origine et les nouvelles baies de l'exemple ci-dessus, et nous verrons qu'elles sont très différentes. Revenez à notre code et ajoutez un journal de console pour les valeurs. Nous allons enregistrer et exécuter notre code. Nous obtenons le tableau de résultats. Et maintenant, nous pouvons également voir le tableau de valeurs d'origine qui n'a pas été modifié. Nous pouvons donc nous référer à cela car il n'a pas été muté. Nous devons également nous assurer, lorsque nous remettons le froid dans la méthode du filtre, que nous retournons quelque chose. Sinon, le nouveau tableau recevra un tableau vide renvoyé. Supprimons les données renvoyées de notre code ainsi que du journal de la console des valeurs. Nous allons enregistrer cela et exécuter le code. Nous recevons un tableau vide car nous n'avons rien renvoyé . Nous pourrions utiliser un filtre sur un tableau de chaînes tout aussi facilement. Voyons un exemple de cela, retournera un tableau de chaînes contenant la lettre A. Revenons à notre code et supprimons tout. Nous allons créer une variable appelée noms. attribué à ce tableau. À l'intérieur du tableau , vous trouverez les cordes Sally, Bob, Lauren et Ted. Nous allons ensuite créer une variable appelée noms filtrés. Cela stocke le tableau renvoyé à partir du filtre. On dira donc des noms de filtre à points. Ensuite, nous allons passer un rappel qui définira un paramètre de nom. Ensuite, nous retournerons tous les noms qui incluent la lettre A. Nous disons donc nom. Le point inclut la passe dans la chaîne a. Ajoutons un journal de console pour les noms filtrés. Nous allons enregistrer et exécuter notre code. Nous obtenons un tableau contenant Sally et Lauren, car ce sont les éléments du tableau Names qui contiennent la lettre a. Enfin, examinons l'utilisation de la méthode de filtre sur une structure de données imbriquée nous allons prendre un tableau contenant des objets et renvoyer les objets dont la propriété scolaire est supérieure à 90. Nous allons commencer par créer une variable appelée résultats, et nous allons définir cette variable égale à un tableau. À l'intérieur du tableau, cinq objets seront créés. Le premier objet définira une propriété name, lui attribuera la valeur. Billy établirait également une propriété de score et lui attribuerait la valeur 90. Dans l'objet suivant définira un nom et un score de 100. Le prochain, nous nommerons Laura et lui donnerons un score de neuf. Ensuite, nous allons attribuer un nom à Alice avec un score de 100. Ensuite, dans le dernier, nous définirons le nom de peta avec un score de 98. Ensuite, nous allons créer une variable appelée passé. Nous allons définir cette valeur égale aux résultats. Le filtre de points utilisera une fonction d'erreur de ligne unique ici, puis renvoie implicitement un score de point inférieur à 90. Ajoutons un journal de console pour le passé. Nous allons enregistrer cela et exécuter le code. Nous obtenons un tableau contenant tous les objets où l' école était supérieure à 90. 34. Utiliser trouver: Dans cette vidéo, nous allons examiner la méthode find dans le passé avant ES6. Si vous souhaitez trouver un élément d' un tableau correspondant à quelque chose de spécifique, vous pouvez utiliser une boucle for-loop. Jetons un coup d'œil à la façon dont nous pourrions faire cela. Si nous voulions trouver la pomme à cordes à partir d'un tableau de chaînes, nous commencerons par déclarer une variable appelée fruits. Attribuera à cela un tableau contenant les cordes fausses, orange, citron, pomme. Kiwi. Ensuite, nous allons créer une variable en utilisant la gauche appelée fruit. Utilisera cela dans notre boucle for, va continuer à créer la boucle for-loop. À l'intérieur de la boucle, l'utilisation d'une instruction if vérifiera en utilisant une égalité stricte. Si le fruit est égal à la pomme. S'il est égal au fruit de la pomme à l'élément fruit, alors nous utiliserons la pause, car nous n'aurions plus besoin de continuer à faire une boucle. Ajoutons un journal de console pour les fruits. Je sauverai ça. Et nous allons exécuter le code. La variable fruit a été définie sur Apple car les fruits sont prêts contiennent la ficelle de pomme. Cela fonctionne, mais c'est une approche assez longue pour atteindre notre objectif de trouver l'élément pomme. La méthode d'assistance array find nous aide à obtenir le même résultat, mais beaucoup plus facilement, en utilisant la méthode find, nous pouvons renvoyer la valeur du premier et du premier élément dans un tableau donné qui correspond au résultat de la fonction de rappel que nous transmettons, la méthode renvoie ensuite cet élément. Lorsque nous utilisons find, la fonction de rappel doit renvoyer un booléen vrai ou faux. Lorsque nous appelons la méthode find, elle sera exécutée une fois par chaque élément du tableau sur lequel elle a été appelée. Mais lorsqu'il trouve une correspondance, il cesse de fonctionner et renvoie simplement la valeur de l'élément. Pour clarifier, même si le tableau que nous utilisons find on contient plusieurs correspondances, seul le premier élément renvoyant true sera renvoyé. Les autres éléments ne se sont même pas trompés. Réimplémentons l'exemple initial, mais cette fois en utilisant le tableau de fruits peep off fund, mais nous supprimerons tout le reste. Ensuite, nous allons créer une variable à l'aide de const. Code fruit. Attribuerait à cela le résultat de l'utilisation de la méthode find. Nous passons une fonction anonyme comme rappel. Dans défini. Nous allons définir un paramètre de fruit. Nous utilisons votre langue et vérifions si le fruit est strictement égal à la pomme. Ajoutons un journal de console pour les fruits. Enregistrera et exécutera notre code. Nous recevons Apple renvoyé car le tableau de fréquences contient l'élément apple. Le fruit à Ray ne contenait Apple que non défini, il sera retourné. Enlevons les pommes, ma gamme de fruits. Nous sauvegarderons et réexécuterons le code. Nous n'avons pas défini votre tendance, car Apple n'est plus dans la gamme de fruits. Si nous travaillions avec une structure de données imbriquée avec des objets contenant des utilisateurs, nous pourrions utiliser find pour choisir l'utilisateur qui réalise quelque chose. Voyons un exemple où nous avons trois utilisateurs, mais nous voulons renvoyer le nom de l'utilisateur rapide qui a obtenu un score de 0 lors d'un test, dirigerait tout notre code. Nous allons créer une variable appelée résultats. Et nous allons définir cela comme égal à un tableau. À l'intérieur du tableau, cinq objets seront créés. L'objet rapide va définir une propriété name. Et nous allons donner à cela la valeur du ventre. Mais aussi satisfaire votre propriété, obtiendrez la valeur 90. L'objet suivant définira le nom à tester. Note 100. Le prochain qui a mis le nom à Laura et lui donnera un score de neuf, enverra un nom. Alice avec un score de 100. Ensuite, dans le dernier, nous allons nommer Peter avec un score de 98. Créez ensuite une variable appelée gagnant. Nous allons définir cette valeur égale à la valeur de retour de l'utilisation de find. Nous disons que les résultats sont trouvés. Puis passez le rappel. Nous définissons le paramètre sur résultat, retournerons le résultat. Le score de résultat est strictement égal à 100. Ajoutons un journal de console pour le gagnant. Nom du point. Enregistrez ceci et nous allons exécuter le code. Le score du premier conteneur d'objets de 100 correspond à l'utilisateur tat. Nous consoles consignent le nom de cet objet. Nous recevons donc TED car nous utilisons ES6 car ce cours est à peu près ESX moins complet cette vidéo avec un exemple d'utilisation d' une fonction de flèche avec un retour implicite. ne pas utiliser le mot-clé retour mettra fait de ne pas utiliser le mot-clé retour mettra à jour l'exemple que nous venons de faire. Mettons à jour notre fonction gagnante. Supprimez les parenthèses. Le retour va changer la fonction en fonction de flèche. Sauvegardons cela et nous lancerons à nouveau le code. Nous obtenons toujours la même valeur de retour. 35. En utilisant certains et chaque: Dans cette vidéo, nous allons examiner la somme et toutes les méthodes d'aide de tableau. Ces deux méthodes d'aide ont été introduites dans ES6. Ces deux méthodes renvoient des valeurs booléennes, true ou false. Nous commencerons par regarder tous les points. Lorsque nous utilisons tous, nous transmettons une méthode de rappel, qui est généralement une fonction anonyme. La méthode de rappel doit renvoyer une valeur booléenne. Nous pouvons y penser un peu comme une méthode de test. La méthode sera exécutée une fois par chaque élément du tableau, selon le cas. Si tous les éléments réussissent la méthode de rappel de test , la valeur true sera renvoyée. Si un ou plusieurs éléments ne réussissent pas la méthode de rappel de test, false sera renvoyé. Voyons un exemple de base. Nous allons commencer par déclarer une variable à l'aide de const, que nous appellerons des noms, affectera à ce tableau contenant trois chaînes, API, Anna et Alice. Ensuite, nous allons utiliser tous les tableaux Names. Nous disons que les noms pointent chaque passe du rappel. Nous définissons un paramètre de nom. Le paramètre Name représente chaque élément du tableau Names. Nous indiquerons si l'élément de nom inclut la lettre A. Nous disons que le point de nom inclut. Nous transmettons la lettre majuscule a comme argument. Sauvegardons cela et lançons le code. Les éléments du tableau Names contiennent la lettre a. La valeur true est donc renvoyée. Comme nous travaillons avec ES6, mettons à jour la fonction pour qu'elle devienne une fonction flèche. Nous avons supprimé les accolades, le mot-clé retour et ajouté une fonction flèche. Sauvegardons cela et lançons le code. Rien n'a changé, donc nous revenons véritablement. Si nous avions des éléments dans notre tableau de noms qui ne contenaient pas la lettre a, nous serions renvoyés faux. C'est parce qu'il ne faut qu'un seul élément ne passe pas la fonction de test pour que tout ne passe pas. Nous allons ajouter le nom Bob au tableau Names. Sauvegardons cela et lançons le code. Nous recevons un faux retour. Si nous travaillions avec une structure de données imbriquée, chaque méthode peut être très utile pour évaluer certains éléments de données. Par exemple, si nous avions une liste de résultats de tests d' étudiants et que nous voulions savoir si tous nos élèves qui réussissent le test, nous pouvions les utiliser tous. Mettons en œuvre cela. Déclarera une variable à l'aide de const. Nous appellerons ça des résultats. Nous allons attribuer à cela un tableau contenant trois objets. Les objets contiendront le nom et la partition d'un étudiant. Le premier objet que nous avons défini le nom de Billy. Et un score de 90. Le deuxième objet que nous avons défini le nom pour toucher le score sur 100. Et dans le dernier objet, nom, Laura, score à 80, va maintenant déclarer une autre variable en utilisant const, que nous appellerons dead pass. Nous allons attribuer à cela le résultat de l'appel de tous les résultats de notre tableau de résultats. Nous disons des résultats. Tous les. Nous passons au rappel. Et nous allons définir un paramètre étudiant et vérifier si le score des points de l'étudiant est supérieur à 50. Ajoutons un journal de console pour did pass. Enregistrez ceci et exécutez le code. Qu'est-ce que les élèves de notre tableau de résultats obtiennent une note supérieure à 50 ? Nous recevons donc le retour de l'arbre. Si l'un des élèves avait obtenu un score inférieur à 50, nous obtiendrions un faux retour. Passons donc à certains. Lorsque nous en utilisons, nous transmettons une méthode de rappel, généralement une fonction anonyme, la méthode de rappel doit renvoyer un booléen. Comme pour tous, nous pouvons y penser comme une méthode de test. La méthode sera exécutée une fois par chaque élément du tableau, quelle chanson est appelée si l'un des éléments réussit la méthode de rappel de test que true sera renvoyée. Si aucun des éléments n'a réussi la méthode de rappel de test, false sera renvoyé. Pour clarifier, certains retourneront true si l'un des éléments a réussi la fonction de test, alors que tous retournent true uniquement si tous les éléments réussissent la fonction de test. Si vous ne cherchez pas tout pour réussir la fonction de test et seulement un seul élément, alors certains sont une méthode utile à utiliser. Examinons un exemple basique de certains vont supprimer tout notre code. Nous allons créer une variable à l'aide de CONST, et nous l'appellerons des âges. Qu'est-ce qui a été attribué à cela. Et déjà. À l'intérieur du tableau, vous placez les valeurs de 1 à 101. Créons maintenant une autre variable en utilisant const appelée supérieure à cinq, stockera dans ce résultat le résultat de l'utilisation de certains sur le tableau de l'âge est. Nous disons la somme des points d'âge, et à l'intérieur des parenthèses, nous définissons le paramètre âge. L'utilisation d'un retour implicite permettra vérifier si l'âge est supérieur à cinq ans. Ajoutons maintenant un journal de console pour plus de cinq. Sauvegardons cela et lançons le code. Un élément de l'âge du rayon est supérieur à cinq. Nous sommes donc véritablement retournés. Si nous modifions le tableau des âges pour qu'il ne contienne que des nombres inférieurs à cinq, nous deviendrions faux. Cela est dû au fait que rien à l'âge du rayon ne réussirait la fonction test. Donc, dans notre code, modifions la valeur dix par trois. Enregistrez ceci et réexécutez le code. Nous sommes maintenant faux. 36. Notation constructeur d'objets: Bonjour. Dans cette vidéo, nous allons regarder les constructeurs d'objets en JavaScript. Javascript offre plusieurs façons de créer des objets. L'un d'entre eux est appelé notation constructeur d' objets. Nous pouvons commencer par créer simplement un objet. Nous créons une variable pour stocker l'objet, puis nous utilisons le nouveau mot-clé et le constructeur d'objet pour le créer. Nous allons le faire dans notre éditeur de texte. Nous déclarons une variable appelée House, qui sera initialement non initialisée. Ensuite, nous utilisons le nouveau mot-clé et le constructeur d'objet pour créer l'objet. Si nous ajoutons une console journal de la maison, nous pouvons inspecter l'objet, sauvegarder le code et l'exécuter. Nous recevons un objet vide renvoyé. Actuellement, notre maison ne fait pas grand-chose. Nous pouvons ajouter certaines propriétés à l'objet. Pour ajouter une propriété à l'objet, vous pouvez utiliser la notation Dr. bracket, mais vous utilisez le nom de l'objet suivi de la propriété que vous souhaitez ajouter. Ajoutons certaines propriétés dans notre code à l'aide de la notation par points. Nous ajouterons des propriétés pour le nom de la maison, chambres et la date de construction. Il dira que le nom du point de maison est égal aux fenêtres de chaînes. Ensuite, nous dirons que les chambres de la maison sont égales à cinq. Enfin, nous dirons que le point de maison est égal à 1998. Maintenant, sauvegardons cela et inspectons à nouveau notre objet. Les propriétés sont désormais ajoutées à l'objet maison, mais ce n'est pas très dynamique. Nous voudrions peut-être ajouter une méthode pour renvoyer une certaine valeur. Dans notre exemple, nous utiliserons une méthode pour renvoyer le nom de la maison. Pour ajouter une méthode à un objet, nous utiliserons à nouveau la notation par points. Nous utilisons ensuite le mot-clé fonction suivi d'accolades. À l'intérieur des accolades, remplacez le code de la méthode. Allons y aller. Nous utilisons donc le nom de notre objet, qui est maison, suivi d'un point, suivi de ce que nous voulons appeler notre méthode , qui a GetName. Nous utilisons maintenant le mot-clé fonction. À l'intérieur de la fonction, la propriété name de notre objet sera renvoyée. Sauvegardons cela et lançons le code. Maintenant, lorsque nous inspectons à nouveau notre objet maison, nous pouvons voir que la méthode GetName a été ajoutée en tant que propriété à l'objet. Essayons d'utiliser la méthode. Nous obtenons la valeur du nom d' une maison qui nous est retournée. Nous pouvons mettre à jour les propriétés de notre objet à l'aide de la notation par points ou entre crochets. Essayons donc de changer le nom de la maison en chaîne. Et nous utiliserons la notation par points. On va dire le nom du point de la maison. Nous allons définir cela à la même manière. Sauvegardons cela et lançons le code. Nous pouvons voir que la valeur de la propriété name a été mise à jour. Nous pouvons supprimer une propriété à l'aide du mot-clé delete suivi du nom de la propriété que nous souhaitons supprimer . Essayons ça. Nous utilisons le mot-clé delete suivi du nom du point maison. Sauvegardons cela et lançons le code. y a désormais aucune propriété de nom dans notre objet. Utilisons la notation entre crochets pour ajouter la propriété en tant que fenêtres de chaînes. Cela peut également être fait avec la notation par points. Nous utilisons le nom de l'objet, les crochets à l'intérieur desquels nous passons une chaîne avec la clé de propriété que nous voulons ajouter. Nous passons donc en nom. Nous avons défini cela comme égal aux saules à cordes. Sauvegardons cela et lançons le code. Nous avons maintenant le nom de la propriété dans notre objet maison. L'approche ci-dessus fonctionne très bien. Mais il y aura des moments où vous voudrez probablement utiliser un objet plusieurs fois. Vous souhaitez peut-être représenter plusieurs utilisateurs. Dans notre cas, nous voudrions peut-être créer plusieurs maisons, mais utiliser des propriétés similaires l'aide de la notation constructeur, nous pouvons utiliser un objet pour agir comme modèle ou Blueprint pour d'autres objets. Créons une fonction maison. Pour ce faire, supprimerait tout notre code et créerait une déclaration de fonction. Nous appellerons cette maison. Nous utilisons une majuscule pour la fonction maison. On peut donc distinguer que la fonction utilise la notation constructeur. Cela n'a aucun impact lors de l'exécution du code, mais il s'agit d'une convention de dénomination utilisée en JavaScript. À l'intérieur des parenthèses, le nom des paramètres sera ajouté. Chambres. Construit. Dans le corps de la fonction, il faut utiliser ce mot-clé que chaque propriété et méthode appartient à l'instance individuelle de l'objet créé avec la fonction. Je dirai ça. Le nom du point est égal à nom. Les chambres sont égales à des chambres. Ce point est égal à construit ajoutera également notre méthode. Nous allons donc dire que ce point GetName est égal à la fonction. À l'intérieur de la fonction, ce nom de point est renvoyé. Nous sommes maintenant prêts à utiliser notre fonction et à créer une instance de l'objet. Nous allons le faire en utilisant le nouveau mot-clé, suivi d'un appel à la fonction qui crée l'objet. Dans notre maison de cas. Nous transmettons les propriétés des paramètres de la maison comme arguments à la fonction. Voyons un exemple. Nous allons créer une variable appelée manoir. Au départ, cela ne sera pas initialisé. Mais nous créons ensuite l'instance de l'objet maison à l'aide du nouveau mot-clé. Nous passons à la manière des cordes. Le paramètre name, la valeur cinq. Pour le paramètre de chambres 1998 pour le paramètre construit. Console consigne l'instance du manoir. L'objet a été créé avec les valeurs que nous avons transmises lorsque nous avons créé l'objet. Essayons de créer une deuxième instance de l'objet. Va créer une autre variable appelée Willow house. Cette fois, nous passerons dans la corde Willow pour le nom des chambres et 2 000 pour l'année de construction. Sauvegardons cela et lançons le code. Nous avons maintenant deux objets, le manoir et le dessous de la maison. Les deux objets représentent des maisons, mais les valeurs du nom, pièces et des propriétés construites sont individuelles aux objets spécifiques créés. Nous pouvons le confirmer lorsque nous utilisons la méthode GetName sur chacun de nos objets. Dans notre code, nous allons dire Willow House dot GetName. Et nous devons utiliser des parenthèses car nous voulons appeler la méthode. Ensuite, nous dirons le manoir point GetName. Enregistrez ceci et exécutez le code. Nous obtiendrons le retour pour le retour de l'objet de la maison de saule pour le manoir. Objet. 37. Présentation des prototypes: Dans cette vidéo, nous allons introduire des prototypes en JavaScript afin de pouvoir passer à autre chose et mieux comprendre les classes ES6. Commençons par discuter du JavaScript orienté objet. Javascript n'est pas un langage basé sur les classes et n' implémente pas de programmation orientée objet au sens traditionnel. Il fournit des fonctionnalités et des modèles qui nous permettent d'utiliser des concepts de programmation orientés objet. Nous appelons cela l'héritage prototypal. Quel est le prototype en JavaScript ? Car le concept central du prototype en JavaScript est qu' un objet peut hériter propriétés ou de méthodes d'un autre objet. Si vous envisagez un arbre généalogique, les personnes du bas se sont liées à une seule personne en haut. Vous pouvez suivre l'itinéraire jusqu'au sommet étape par étape. En JavaScript, vous pouvez penser qu'un prototype est un Blueprint, un modèle ou un objet de base contenant des méthodes auxquelles n'importe quelle instance de l'objet créé peut accéder. Si nous n'avions pas le prototype, nous devrions définir les méthodes sur chaque instance d'un objet, ce qui ne serait pas très efficace. Il mangerait beaucoup de mémoire. Il existe deux types de prototypes que nous devons comprendre la propriété prototype et le prototype de l' objet lui-même. Commençons par la propriété prototype. Lorsque nous utilisons des méthodes JavaScript telles que pop on a array ou inclut lorsque nous travaillons avec des chaînes, nous utilisons des méthodes intégrées dans JavaScript. Jetons un coup d'œil à cela visuellement dans la console. Nous pouvons commencer par accéder simplement à la propriété prototype sur le constructeur du prototype de baie. Nous tapons un prototype de points de réseau. Maintenant, lorsque nous inspectons cela, nous pouvons voir le constructeur. Nous pouvons voir toutes les méthodes. Créons maintenant un tableau et voyons comment afficher la propriété prototype à l'intérieur du tableau. Nous allons créer une variable à l'aide de const. Nous appellerons cela notre réseau. Ceci est déclaré et initialisé avec un tableau contenant les valeurs 123. Plus tard, nos tableaux inspectés lorsque nous voulons supprimer un élément de la fin d'un tableau, nous pouvons utiliser la méthode pop. D'où cela vient-il ? Moins il faut inspecter l'ARRA petit. Chaque objet en JavaScript possède une propriété prototype. Il s'agit d'une propriété interne qui est marquée par les doubles crochets qui la entourent. Lorsque nous sélectionnons la propriété prototype, nous pouvons voir les méthodes disponibles et, dans notre exemple, elles héritent du constructeur du tableau. Nous pouvons également utiliser une méthode get prototype. Et cela renverra la propriété prototype d'un objet donné. N'oubliez pas que les tableaux sont un type d'objet spécial. Il est intéressant de noter que vous pouvez trouver des exemples qui utilisent un soulignement, un trait de soulignement. Soulignement, soulignement. Il s'agit d'une caractéristique héritée et ES lint possède même une règle appelée no proton pour se protéger contre son utilisation. La propriété Underscore, Underscore, Underscore, Underscore expose le prototype interne de l'objet qu'il est préférable d'utiliser. Obtenez un prototype de. Essayons ça. Donc nous disons objet point, obtenez le prototype d'un puis nous passons la variable de notre tableau. Allons inspecter ça. Nous pouvons comparer cela avec les méthodes répertoriées sur le site Web MDM. Toutes les baies peuvent accéder à ces méthodes, mais elles ne les ont pas réellement comme propriétés sur l' effacement elles-mêmes. Ce sont les méthodes que chaque baie peut utiliser. Mais au lieu de les définir individuellement sur chaque tableau, les méthodes sont définies plutôt sur l'objet prototype. Cela n'est pas spécifique à une augmentation, mais également à d'autres objets intégrés dans JavaScript. Nous pouvons également l'utiliser lorsque nous créons des objets. Dans la vidéo suivante, nous allons regarder cela un peu plus. 38. Plus de prototypes: Bienvenue de retour. L'objet qui est la valeur de la propriété prototype, est le prototype de l'objet que nous inspectons. S'il n'existe pas, il le sera maintenant. Lorsque nous utilisons la méthode pop sur notre tableau, l'interpréteur JavaScript recherchera initialement la méthode sur le tableau. Lorsqu'il ne le trouve pas, il regardera ensuite le prototype. Nous appelons ce processus l' héritage prototypal , la chaîne prototype. Ce processus pourrait continuer et encore. Mais il vaut mieux ne pas créer une chaîne complexe car le débogage peut devenir vraiment déroutant. À l'aide de la chaîne prototype, vous pouvez stocker une fonction sur un seul objet et l'interprétation fonctionne jusqu'à cet objet s'il ne le trouve pas dans le premier objet Examinons un exemple dans un code. Déclarera la fonction constructeur appelée tracker de jeu. Permet de définir le nom et les paramètres de résultat. Nous allons définir ce nom sur le même nom. Et nous allons définir ce résultat de points. Résultat égal. Ce qui est stocké en mémoire est stocké en tant que fonction avec un objet. L'objet possède une propriété prototype, qui est un objet vide. Toutes les fonctions créées à l'aide de la piste de jeu. Un constructeur aura accès à la propriété prototype à l'intérieur de la fonction. Nous définissons le nom et le résultat à l'aide de ceci, ils font référence à l' instance actuelle de l'objet. Créons maintenant une variable appelée joueur un. Lorsque cette opération est exécutée, elle sera initialement désinitialisée, mais nous utiliserons ensuite le nouveau mot-clé et une nouvelle instance de tracker de jeu. Lorsque nous utilisons le nouveau mot-clé, la propriété prototype est définie, qui sera une référence à l'objet Game Tracker. Ajoutons le nom Bob, le résultat étant quatre. Ajoutons également un journal de console pour le joueur 1. Sauvegardons cela et lançons notre code. Si nous inspectons le joueur, on verra le nom et les propriétés des résultats. Essayons maintenant de trouver le constructeur du joueur 1. De retour dans notre code, nous ajouterons un journal de console. Et à l'intérieur de ça, on dira objet point, obtenir un prototype. Et nous allons passer le joueur 1. Sauvegardons cela et lançons le code. Nous obtenons le tracker de jeu en tant que constructeur. Utiliser le prototype. Nous pouvons également ajouter une méthode au prototype. ajouterai un pour commencer notre jeu. Nous disons le prototype de point de suivi de jeu dot Start. Ensuite, nous définissons cette valeur égale à une fonction car c'est une méthode à l'intérieur du corps qui retournera un littéral de modèle. Nous utilisons les tiques du dos, nous dirons bonjour. Ensuite, nous allons interpeller le nom. Nous disons donc ce nom de point. Après cela, nous dirons que le jeu est prêt. Nous allons maintenant inspecter à nouveau un objet du joueur. Nous sommes en mesure de constater que la fonction de démarrage est stockée dans le prototype. Nous pouvons maintenant utiliser la fonction de démarrage de notre joueur 1. Essayons ça. Dans un journal de console, le joueur indique qu'un point s'est arrêté. Parce que nous allons appeler la méthode start. Sauvegardons cela et lançons le code. Nous recevons la corde avec le nom de notre joueur renvoyé. 39. Présentation des cours: Maintenant familiarisé avec les constructeurs et les prototypes, examinons les classes ES6. Les classes sont essentiellement sucre syntaxique pour créer des objets. Cela signifie que sous le capot, tout fonctionne de la même manière que l'utilisation de la notation constructeur d'objets, mais elle est beaucoup plus lisible et plus facile à utiliser. Comme pour tout ce qui utilise du sucre syntaxique, il est toujours extrêmement utile et important pour comprendre ce qui se passe sous le capot. Lorsque nous utilisons la syntaxe de classe en JavaScript, nous n'avons pas à ajouter manuellement de méthodes au prototype. Nous utilisons plutôt un mot-clé appelé classe. Nous ajoutons un constructeur, puis nous ajoutons des méthodes. Décomposons ça et jetons un coup d'œil. Dans notre exemple, nous utiliserons une classe pour créer un chien. Ensuite, nous allons créer des instances de ce chien. Pour commencer à utiliser une classe, vous utilisez le mot-clé de classe suivi de ce que vous souhaitez que votre classe soit refroidie. Habituellement, le nom de la classe est majuscule. Nous pouvons donc dire que c'est un cours. C'est comme lorsque nous utilisons la notation du constructeur d' objets. Allons-y dans l'éditeur de texte. Nous utilisons le mot clé de la classe et continuons à créer notre classe de chiens. Ensuite, nous utilisons un ensemble d' accolades pour enfermer notre classe. Lorsque nous créons une classe, nous ajoutons ce qu' on appelle un constructeur. Un constructeur est une fonction. Il s'exécutera immédiatement chaque fois qu'une nouvelle instance de notre classe est créée. Le constructeur ressemble un peu à une fonction constructeur standard. Lorsque nous utilisons la notation du constructeur d'objet. Ajoutons ça à notre classe. De retour dans l'éditeur de texte. À l'intérieur des accolades de la classe, nous utilisons la fonction constructeur. Pour créer une nouvelle instance de la classe. Vous utilisez exactement la même syntaxe que lorsque vous créez une nouvelle instance à l'aide de la notation constructeur. Pour ce faire, nous créons un nom pour notre instance à l'aide d'une variable. Ensuite, nous utilisons le signe égal suivi du nouveau mot-clé, puis le nom de notre classe. Lorsque nous le faisons, le constructeur s'exécutera immédiatement. Créons un chien que nous appellerons coquelicot. Nous commençons par créer une variable à l'aide de const. Et nous donnons le chiot identificateur. Nous utilisons le signe égal. Ensuite, le nouveau mot-clé, suivi du nom de notre classe, qui est sombre. Ajoutons maintenant un journal de console. Pour Puppy. Enregistrera cela et exécutera le code. Nous voyons le chien. Et nous pouvons voir lorsque nous inspectons la propriété prototype que le constructeur a été défini sur chien, classe ne fait pas grand-chose actuellement. Dans la vidéo suivante, nous allons ajouter quelques propriétés à notre classe. 40. Plus sur les cours: Bienvenue de retour. Dans la dernière vidéo, nous avons introduit des cours dans ESX. Continuons avec cela et nous examinerons l'ajout de propriétés à notre chien, ajouterons le nom, l'âge et la race. Nous pouvons les définir dans le constructeur. Pour ce faire, nous ajoutons les paramètres à la fonction constructeur. Ensuite, nous pouvons ajouter les propriétés à notre instance de l'objet. Nous transmettons les valeurs des paramètres sous forme d'arguments. Lorsque nous créons l' instance de notre objet. Lorsque nous créons l'instance de notre objet à l'aide du nouveau mot-clé, cela se réfère automatiquement à l'instance de l'objet que nous créons. Mettons cela en œuvre dans notre classe. Nous commençons donc par ajouter le nom, l'âge et la race des paramètres du constructeur. Ensuite, nous définissons ce nom de point, deux noms égaux, ce point, l'âge à h, cette race à la race égale. Où nous créons l' instance de notre objet. Nous allons ajouter un chiot. L'argument du paramètre name. Pour le paramètre h, il en ajoutera deux. Pour le paramètre race, nous ajouterons l'appel de chaîne. Sauvegardons cela et lançons le code. Lorsque nous inspectons l' objet chiot dans la console, nous pouvons voir le nom, âge et les propriétés de race définis dans le constructeur. Ceci est fait parce que nous utilisons le nouveau mot-clé. À l'intérieur du constructeur. Nous disons que vous ajoutez un nom, âge et une propriété de race, et définissez ces propriétés sur les valeurs des paramètres. Les valeurs des paramètres sont transmises sous forme d'arguments lorsque nous appelons new with the dog class. Nous créons l'instance de coquelicot. L'un des principaux avantages de l'utilisation classes est que nous n' avons pas à dériver l'annonce, les méthodes utilisant le prototype. Pour ajouter une méthode, nous utilisons le nom de la méthode suivi de parenthèses et d'accolades. La méthode devient alors une méthode sur le prototype de chien, mais pas sur les instances individuelles. C'est comme lorsque vous ajoutez les méthodes à l' aide de la syntaxe du prototype. Mettons en œuvre une méthode qui retournera nom du chien à l'aide d'un littéral de modèle dans notre code. Après le constructeur, nous ajouterons la méthode MyDog. À l'intérieur du corps de celui-ci, un littéral de gabarit sera renvoyé. Cela dira que mon chien est code. Ensuite, nous allons intercaler dans ce nom de point. Sauvegardons cela et lançons le code. Nous obtenons notre objet. Lorsque nous examinons l' incidence dans le centre commercial, nous pouvons constater que la méthode MyDog a été ajoutée à la propriété prototype de l'instance. Nous pourrions créer une autre instance de notre classe, qui aura son propre ensemble de propriétés. Créons une autre instance, et nous l'appellerons le mien. Pour ce faire, nous allons créer une variable appelée mon nom. Nous utilisons le nouveau mot-clé, le nom de classe chien. À l'intérieur des parenthèses ajouteront Milo. Pour le nom. L'âge s'ajoutera cinq ans. Pour la race, ajoutera le parc. Ajoutons également un journal de console pour mineur qui enregistrera cela et exécutera le code. Nous pouvons voir que l' instance de myéline est en cours création et que le constructeur est réglé sur chien. Dans la vidéo suivante, nous allons voir comment utiliser notre méthode. 41. Utilisation des cours: Nous pouvons maintenant essayer d'utiliser notre méthode MyDog sur les deux instances. Pour ce faire, nous utilisons l'identifiant de l'instance d'objet, suivi d'un point, suivi de la méthode. Essayons ceci, ajoutera deux journaux de console. Dans le premier, on dira chiot point, puis on appellera MyDog. Le deuxième journal de la console indiquera milo point, puis utilise la méthode MyDog. Sauvegardons cela et lançons le code. Nous recevons les noms des deux chiens retournés dans la ficelle. Nous pourrions également appeler une méthode à partir d'une autre méthode de la classe. Si nous voulions le faire, nous l'utilisons simplement. Créons une autre méthode qui renvoie le nom et l'âge des instances adultes. Nous allons créer une autre méthode appelée info chien. À l'intérieur de cette méthode retournera également un littéral de modèle, injectera dans la méthode MyDog. Ensuite, nous dirons que c'est, puis nous injecterons dans la propriété de l'âge. Après ça, on dira des années. Modifions nos journaux de console pour utiliser la méthode d'information sur le chien. À la place. Nous sauvegarderons cela et exécuterons le code. Nous recevons les nouvelles cordes renvoyées avec le nom et l' âge des ténèbres. Et la méthode MyDog a été appelée avec succès à l'intérieur de la méthode Dog Info. 42. Présentation des promesses: Dans cette vidéo, nous allons présenter des promesses, mais commençons par répondre à la question : qu'est-ce qui est asynchrone ? Habituellement, lorsque vous entendez parler de promesses en JavaScript, vous entendez également le mot asynchrone. Mais qu'est-ce qui est asynchrone ? Eh bien, nous avons d'abord un synchrone. Synchrone signifie quelque chose qui est effectué étape par étape. Lorsque vous marchez, vous mettez un pied devant l'autre. Et vous ne faites pas les deux en même temps, sauf si vous sautez. Un autre exemple est d' attendre qu'une bouilloire bouille avant de rendre une tasse de thé asynchrone. autre côté, cela signifie que vous pouvez faire d'autres choses en arrière-plan sans que tout s'arrête et n'attende. C'est un peu comme dire que vous pourriez regarder télévision pendant que vous attendez que la bouilloire bouille, plutôt que de se tenir debout et de regarder la bouilloire qui l'attend. JavaScript est donc ce que nous appelons un langage à thread unique. Cela signifie qu'une seule chose peut se produire à la fois et à la fois, JavaScript asynchrone est la façon dont les tâches en arrière-plan, telles que les demandes aux serveurs, peuvent se produire sans que tout soit grincé. à un arrêt, attendant que la tâche unique soit terminée, cela signifie que les tâches asynchrones exécutées en dehors du flux principal du programme. Ce qu'il promet dans votre vie quotidienne. Vous promettez souvent aux gens quelque chose à l'avance si vous le faites réellement, peut-être que vous dites, je promets de nettoyer la vaisselle ou je promets d'acheter du lait. C'est essentiellement ainsi que les promesses fonctionnent en JavaScript. Lorsque vous utilisez une promesse, vous écrivez généralement code asynchrone et vous faites une promesse ou une transaction pour quelque chose qui va être fait. Une fois la promesse faite , la tâche est exécutée ou échouée. C'est comme dire que vous êtes satisfait ou que vous avez échoué à votre promesse d'acheter du fondu. Il y a deux parties à comprendre lorsque vous travaillez avec des promesses, la création de la promesse, puis comment utiliser la promesse. Commençons par examiner comment créer une promesse. Une promesse est une fonction constructeur, vous devez donc utiliser le nouveau mot-clé. Et la promesse doit être en majuscules lorsque vous en créez une , la promesse prend comme argument avec deux paramètres, résolution et rejet. Résolvez et rejetez des fonctions pouvant être froides Elles doivent donc être exécutées entre parenthèses, résoudre ou rejeter. Habituez-vous à déterminer ce qui se passe lorsque la promesse est exécutée. Examinons la syntaxe de base pour créer une promesse. Nous allons déclarer une variable en utilisant cond, ce que nous appellerons notre promesse. Nous utilisons ensuite le signe égal et le nouveau mot-clé. Ensuite, nous utilisons la promesse. Nous transmettons Resolve et rejetons comme paramètres. En dehors de cela, vous ajouterez un journal de console pour notre Promise. Sauvegardons cela et lançons le code. Lorsque nous inspectons la promesse, nous voyons l' état de la promesse dit « En attente ». Examinons donc les états Promise. Il y a trois États dont les promesses peuvent être en attente, respectées et rejetées. La promesse que nous avons créée ne résout ni ne rejette rien. Il restera indéfiniment dans l'état en attente est un peu comme quelqu'un qui vous attend pour aller acheter une fusion pour compléter une promesse que nous utilisons Resolve overjet. Résoudre signifie que la promesse réussit et que le rejet signifie qu'elle échoue. N'importe quel argument peut être transmis en résolution et en rejet. Mais souvent, lorsque nous travaillons avec des promesses, nous faisons des demandes de données. Il s'agit donc parfois d'un objet dont vous pouvez extraire des données. Dans la vidéo suivante, nous allons passer à la réalisation de la promesse. 43. Travailler avec des promesses: Bienvenue de retour. Continuons à regarder les promesses. Mettons à jour notre exemple pour montrer le résultat de la résolution puis du rejet de la promesse. Nous allons commencer par ajouter un rejet. Sauvegardons cela et lançons le code. Nous pouvons voir que l'état a été mis à jour pour être rejeté et nous obtenons une erreur. Changeons maintenant cela pour résoudre le problème. Enregistrera cela et réexécutera le code. Nous voyons maintenant la promesse que les États ont respectée. Passons maintenant à la mise à jour notre exemple pour qu'il représente mieux une demande. Nous ajouterons une variable en utilisant la gauche appelée Dead get milk. Nous allons mettre cela à vrai. Ensuite, nous ajouterons une instruction if et nous allons transmettre did get milk ajoutera solve dans le corps de l'instruction if, et nous transmettrons la chaîne d'argument. Nous avons eu le lait que nous utiliserons autrement. Définissez, rejetez. Cette fois, nous allons passer l'argument chaîne. Nous n'avons pas eu le lait. Sauvegardons cela et lançons le code parce qu'ils obtiendraient du lait est vrai. La promesse est résolue avec le message. Si nous fixons la mise à la force, la promesse sera rejetée. Changeons la variable de montage a été égale à false. Nous allons enregistrer cela et nous avons déplacé le code. Cette fois, nous voyons que la promesse a été rejetée et nous obtenons la chaîne que nous avons transmise en rejet. Nous pouvons les utiliser pour exécuter du code. Une fois la promesse résolue, il s'agit alors d'une méthode qui sera exécutée immédiatement après la réalisation de la promesse . Nous pouvons leur transmettre un rappel, qui contient le code que nous exécutons une fois la promesse remplie. Mettons à jour notre exemple pour le montrer, nous allons le remettre à vrai. Maintenant, continuons à utiliser la méthode then. Nous disons que je vais promettre Dot. Ensuite, nous définissons un paramètre pour le résultat, que nous appellerons des rayons. Ensuite, nous utilisons la syntaxe de la fonction flèche. À l'intérieur, nous dirons console.log. Reste. Sauvegardons cela et lançons le code. Lorsque la promesse est exécutée, nous obtenons le statut accompli, mais nous voyons également le paramètre rouge imprimé. Le paramètre reste est transmis à partir de l'argument que nous donnons à la méthode de résultat. Changeons l' argument que nous donnons à la méthode des résultats pour consolider notre compréhension de cela. Nous allons donc changer l' argument pour qu'il s'agisse d'un objet. Définissez le message clé avec la chaîne comme valeur dans le journal de la console R pour les rayons. Changeons ça pour qu'il s' agisse d'un message res dot. Sauvegardons cela et lançons le code. Le message est imprimé à l'écran lorsque la promesse est rejetée. Nous gérons cela en utilisant des prises. Catch fonctionne de la même manière que lorsque nous les utilisons pour résoudre la promesse. Les prises seront exécutées immédiatement après le rejet de la promesse. Voyons un exemple. Nous allons changer la variable « Dead get milk » pour qu'elle soit fausse. Après l'avoir utilisé, on dira « dot catch ». Définissez un paramètre d'erreur. Nous allons utiliser la syntaxe de la fonction flèche. Ensuite, nous ajouterons un journal de console en cas d'erreur. Sauvegardons cela et lançons le code. Cette fois, lorsque le code s'exécute, la promesse est rejetée. Le code et la capture se trompent. Et nous comprenons l'argument, nous passons à l'appel à rejeter imprimé sur la console. 44. Modules: Les modules sont un terme courant que nous rencontrons dans la programmation. Si nous regardons cela de manière quotidienne, vous pouvez le considérer un peu comme un morceau de lego ou un simple wagon de train. codage, en particulier lorsque nous créons une application, pour des raisons d'organisation, nous pouvons séparer le code dans des fichiers ou des modules distincts. L'une des principales raisons pour lesquelles nous agissons ainsi est que les responsabilités sont réparties en plusieurs parties distinctes. Cela rend le programme beaucoup plus sûr contre les erreurs et beaucoup plus facile et logique à utiliser. En résumé, un module est une partie ou un élément du code qui encapsule ou contient sa propre logique et ses propres responsabilités pour l'application ou le programme Les modules facilitent l'organisation du code et encouragent sa réutilisation, ainsi que sa maintenabilité Dans ES six, un système de modules a été introduit, qui a encouragé cette séparation et facilité la réutilisation du code Il y a deux concepts que vous devez comprendre. Exportation et importation. Lorsque vous créez un module, vous devrez probablement pouvoir importer dans une autre partie de l'application. Pour pouvoir l'importer dans une autre partie de l'application, il faut l'exporter. Lorsque vous commandez quelque chose depuis l'étranger, il doit passer par un processus en plusieurs étapes pour vous parvenir dans votre pays. Le fournisseur devra démarrer le processus en emballant l'article et en l'envoyant pour expédition. Cela peut être considéré comme le processus d'exportation. Plus tard, lorsque l'article arrive au port de votre pays, il peut passer par un processus douanier avant d'être autorisé à entrer dans le pays et de vous être envoyé via les services postaux de votre pays. Cela peut être considéré comme le processus d'importation. Nous pouvons maintenant considérer le processus dans le code. Lorsque nous créons un module, avant de pouvoir l'utiliser dans une autre partie de l'application, vous devez l'exporter. Ensuite, dans la partie de l'application où vous souhaitez utiliser le morceau de code ou le consommer, nous devrons l'importer afin qu'il puisse ensuite être utilisé dans ce fichier. Il existe deux types d'exportations, les exportations nommées et les exportations par défaut. Commençons par examiner les exportations nommées. Je vais créer un fichier appelé names. Dans ce fichier, je vais créer une variable pour créer le prénom et le nom de famille d'une personne. Je vais également exporter la variable. Je vais commencer par taper export pour exporter la variable. Alors je dirai constant. Utilisez un nom égal à. J'ajoute ensuite des parenthèses car je souhaite définir certains paramètres. J'ajouterai le premier paramètre appelé prénom, une virgule, puis j'ajouterai un autre paramètre appelé nom J'utilise une fonction flèche ici, donc je vais utiliser une flèche, puis je vais renvoyer une chaîne entrelacée. Je commence par un ensemble de baptis, puis j'utilise le signe du dollar et des bretelles bouclées. J'interpole dans le prénom. Je mets un espace , puis je répète le processus pour le deuxième nom. J'ajoute le signe 1$, un jeu d'accolades, et j'interpole dans le deuxième nom Dans le fichier, tout ce que nous voulons faire est de déconnecter la valeur renvoyée par la console. Je vais taper le journal des points de la console, un ensemble de parenthèses, et à l'intérieur des parenthèses, je vais dire le nom d'utilisateur pour appeler la fonction et un ensemble de Pour le premier nom, je vais passer l' argument John et pour le second nom D. Cela ne fonctionnera pas encore, et la raison en est que nous n' avons rien importé. Pour ce faire, en haut du fichier, nous devons utiliser le mot clé import. Ensuite, nous utilisons bretelles bouclées pour contenir le nom du produit que nous importons Nous importons le nom d'utilisateur. Nous l'ajoutons ici. Enfin, nous devons indiquer l'emplacement d'où nous l'importons. Nous disons « point forward slash name ». Essayons maintenant et exécutons la fonction. Lorsque le code s'exécute, je vois John Doe imprimé dans la console, ce qui nous permet de voir le résultat du nom d'utilisateur. À ce stade, vous devez avoir une idée des exportations nommées. Examinons donc les exportations par défaut, qui sont l'autre type d'exportation. Nous allons revenir au nom du fichier JS. Nous conserverons le code dont nous disposons, mais nous devrons supprimer le mot clé d'exportation. Au lieu de cela, après la fonction, nous allons taper le nom d'utilisateur par défaut d'exportation. Revenons maintenant au fichier point JS principal et nous verrons comment ajuster l'importation en conséquence. Nous allons conserver le journal de la console, mais nous allons supprimer la ligne qui importait l'exportation nommée. Nous allons plutôt dire importer le nom d' utilisateur à partir des noms. Exécutons à nouveau le code. Dans le terminal, nous pouvons voir que rien n'a changé, et le nom est toujours déconnecté. Cela nous prouve que nous pouvons utiliser à la fois des exportations nommées et des exportations par défaut. En résumé, les modules ES six nous permettent d'organiser et de réutiliser notre code, et en utilisant simplement l' exportation et l'importation, nous pouvons maintenir des opportunités de réutilisation du code simples. Exporter signifie que le code sera disponible ailleurs, et importer signifie que vous souhaitez utiliser une partie du code exportée. Les exportations nommées et par défaut sont les options dont nous disposons pour exportation. En général, les exportations nommées sont meilleures lorsque vous disposez d'un module doté de nombreuses fonctionnalités, car vous pouvez être sélectif quant à ce que vous importez. Lorsque vous disposez d'une fonctionnalité unique ou principale, exportations par défaut peuvent être plus appropriées.