JavaScript réalise un guide débutant

JavaScript réalise un guide débutant

Les tableaux JavaScript sont une structure de données fondamentale utilisée dans le développement Web. Ils permettent aux développeurs de stocker et de manipuler des listes de données dans une seule variable. Dans cet article, nous explorerons ce que sont les tableaux, comment les créer et comment les manipuler en javascript.

Qu'est-ce qu'un tableau?

Dans JavaScript, un tableau est une variable qui peut contenir plusieurs valeurs. Il s'agit d'un objet semblable à une liste qui permet aux développeurs de stocker et d'accéder aux données de manière ordonnée. Les tableaux peuvent contenir n'importe quel type de données, y compris les chaînes, les nombres et les objets.

Tableaux JavaScript

Créer un tableau

En JavaScript, les tableaux sont créés à l'aide de crochets [] et peut contenir n'importe quel type de données, y compris les nombres, les chaînes, les objets et même d'autres tableaux. Pour créer un tableau, vous déclarez simplement une nouvelle variable et vous attribuez à un tableau à l'aide des crochets.

Pour créer un tableau en JavaScript, nous pouvons utiliser la syntaxe suivante:

// Syntaxe LET ArrayName = [Value1, Value2, Value3];
12// Syntaxle ArrayName = [Value1, Value2, Value3];

Ici, ArrayName est le nom du tableau, et Value1, Value2, et Value3 sont les valeurs que nous voulons stocker dans le tableau. Par exemple:

// Définir un tableau Soit Fruits = ['Apple', 'Banana', 'Orange'];
12// définir un arraylet fruits = ['pomme', 'banana', 'orange'];

Cela crée un tableau appelé fruits qui contient trois chaînes: «pomme», «banane» et «orange».

Nous pouvons également créer un tableau vide et y ajouter des valeurs plus tard:

// Définir le tableau EMTPY LET Numbers = []; // insérer des valeurs aux nombres de tableau.push (1); Nombres.push (2); Nombres.push (3);
1234567// Définir les numéros de l'arborat EMTPY = []; // insérer des valeurs aux nombres de tableau.push (1); nombres.push (2); nombres.push (3);

Cela crée un tableau vide appelé nombres et ajoute les numéros 1, 2 et 3 à l'aide de la méthode push ().

Accéder aux éléments du tableau

Nous pouvons accéder aux éléments individuels dans un tableau en utilisant leur index. En JavaScript, les index de tableau commencent à 0. Par exemple, pour accéder au premier élément du tableau des fruits, nous pouvons utiliser la syntaxe suivante:

// Imprimer l'élément du tableau à la console index 0.log (fruits [0]);
12// Imprimer l'élément de tableau à l'index 0Console.log (fruits [0]);

Cela ferait une «pomme» à la console. Nous pouvons accéder aux deuxième et troisième éléments de la même manière:

// Imprimer l'élément du tableau à la console index 1,2.log (fruits [1]); // Console «banane».log (fruits [2]); // 'orange'
123// Imprimer l'élément du tableau à l'index 1,2Console.log (fruits [1]); // "banane.log (fruits [2]); // 'orange'

Modification des éléments du tableau

Nous pouvons modifier les valeurs dans un tableau en y accédant en utilisant leur index et en leur attribuant une nouvelle valeur. Par exemple, pour modifier le deuxième élément du tableau des fruits en «poire», nous pouvons utiliser le code suivant:

// remplacer l'élément de tableau à l'index 1 fruits [1] = 'Pear'; console.journal (fruits); // ['pomme', 'Pear', 'Orange']
123// remplacer l'élément de tableau à l'index 1Fruits [1] = 'Pear'; console.journal (fruits); // ['pomme', 'Pear', 'Orange']

Cela changerait le deuxième élément du tableau des fruits en «poire».

Méthodes intégrées du tableau JavaScript

Les tableaux JavaScript ont plusieurs méthodes intégrées qui nous permettent de manipuler leur contenu. Une fois que vous avez créé une table.

  1. pousser()
  2. Le pousser() La méthode ajoute un ou plusieurs éléments à la fin d'un tableau et renvoie la nouvelle longueur du tableau.

    // Ajouter les nouveaux fruits d'élément de tableau.push («raisin»); console.journal (fruits); // [«pomme», «poire», «orange», «raisin»]
    123// Ajouter un nouveau tableau d'éléments.push («raisin»); console.journal (fruits); // [«pomme», «poire», «orange», «raisin»]

  3. populaire()
  4. Le populaire() La méthode supprime le dernier élément d'un tableau et renvoie cet élément.

    // Retirez les fruits des derniers élément de tableau.populaire(); console.journal (fruits); // ['pomme', 'Pear', 'Orange']
    123// supprimer les derniers éléments de tableau.pop (); console.journal (fruits); // ['pomme', 'Pear', 'Orange']

  5. changement()
  6. Le changement() La méthode déplace tous les éléments de droite à gauche. Qui supprime le premier élément d'un tableau:

    // Shift Array Element de droite à gauche Fruits.changement(); console.journal (fruits); // ['Pear', 'Orange']
    123// Shift Array Element Droite aux gauche.shift (); console.journal (fruits); // ['Pear', 'Orange']

  7. Unhift ()
  8. Le Unhift () La méthode ajoute un ou plusieurs éléments au début d'un tableau et renvoie la nouvelle longueur du tableau.

    // Shift Back Elements de gauche à droite et // Ajouter un nouvel élément de tableau à Index 0 Fruits.Unhift («banane»); console.journal (fruits); // [«banane», «poire», «orange»]
    1234// Shift Back Elements de gauche à droite et // Ajouter un nouvel élément de tableau à l'index 0Fruits.Unhift («banane»); console.journal (fruits); // [«banane», «poire», «orange»]

  9. épissure()
  10. Le épissure() La méthode peut ajouter, supprimer et / ou remplacer les éléments dans un tableau. Il prend au moins deux arguments: l'indice pour commencer à apporter des modifications, et le nombre d'éléments à supprimer. Des arguments supplémentaires peuvent être fournis pour ajouter des éléments au même indice. La méthode renvoie un tableau des éléments supprimés, ou un tableau vide si aucun éléments n'a été supprimé.

    // poussant un nouveau tableau à des fruits d'index spécifiques.Splice (1, 0, «raisin»); console.journal (fruits); // [«banane», «raisin», «poire», «orange»]
    123// poussant un nouveau tableau à des index spécifiques.Splice (1, 0, «raisin»); console.journal (fruits); // [«banane», «raisin», «poire», «orange»]

    Ici le épissure() La méthode insère le «raisin» de chaîne dans le tableau des fruits à l'index 1, poussant l'élément d'origine à l'index 1 et les éléments ultérieurs par un index.

  11. tranche()
  12. Le tranche() La méthode renvoie un nouveau tableau contenant une partie d'un tableau existant. La partie est spécifiée par les index de démarrage et de fin, qui sont passés comme arguments à la méthode. L'indice de départ est inclusif et l'indice de fin est exclusif. Si aucun argument n'est passé, la méthode renvoie une copie de l'ensemble du tableau. Le tableau d'origine n'est pas modifié.

    // Copiez une gamme d'éléments dans un nouvel tableau, laissez NewArray = Fruits.tranche (1, 3); console.Log (newArray); // [«raisin», «poire»]
    123// Copiez une gamme d'éléments dans un nouvel arraylet newArray = Fruits.tranche (1, 3); console.Log (newArray); // [«raisin», «poire»]

    Ici le tranche() La méthode crée un nouveau tableau appelé 'NewArray' qui contient les éléments du tableau des fruits de Index 1 jusqu'à, mais sans compter, index 3.

  13. Indice de()
  14. Le Indice de() La méthode renvoie l'indice de la première occurrence d'un élément spécifié dans un tableau:

    // obtient le numéro d'index par valeur dans le tableau Let index = fruits.indexof ('Pear'); console.log (index); // 1
    123// Obtenez le numéro d'index par valeur dans l'index Arraylet = Fruits.indexof ('Pear'); console.log (index); // 1

    Ici le Indice de() la méthode renvoie l'index de la chaîne 'poire' dans le tableau des fruits, qui est 1.

Conclusion

Les tableaux JavaScript sont une puissante structure de données qui permet aux développeurs de stocker et de manipuler des listes de données dans une seule variable. Ils sont largement utilisés dans le développement Web et sont un concept fondamental pour comprendre. Dans cet article, nous avons exploré comment créer et manipuler des tableaux en JavaScript, ainsi que certaines des méthodes de tableau les plus couramment utilisées. Avec ces connaissances, vous devriez être bien équipé pour travailler avec des tableaux dans vos propres projets JavaScript.