« Précédent Suivant »

Chaines et Tableaux

Les Chaines

Une chaine de caractère est une séquence de caractères. Pour Javascript c'est le type string.

Nous pouvons les écrire avec des simple ou des doubles côtes.

'Une chaine'
"Une autre chaine..."

Pour l'affectation c'est très simple:

const monNom = "Polo"

Ce type est notre premier type objet. De ce fait, nous avons accès à des méthodes. Par exemple, nous pouvons connaitre la longueur de la chaine:

"Bidule".length // 6
const nom = "Alexandre"
nom.length // 9

Vous pourrez trouver toutes les méthodes attachées aux string ici

Comme nous l'avons déjà dit le + sert à concatener les chaines:

"Bonjour "+" comment ça va?" // "Bonjour comment ça va?"

const nom = "Paul"
"Tu t'appelles "+nom // "tu t'appelles Paul"

Une autre façon de définir des chaînes consiste à utiliser des modèle littéraux, définis à l'intérieur de backticks (`). Ils sont particulièrement utiles pour rendre les chaînes multilignes beaucoup plus simples. Avec des guillemets simples ou doubles, vous ne pouvez pas définir facilement une chaîne multiligne: vous devez utiliser des caractères d'échappement.

Une fois qu'un modèle littéral est ouvert avec le backtick, il vous suffit d'appuyer sur Entrée pour créer une nouvelle ligne, sans caractères spéciaux, et elle est rendue telle quelle:

const chaine = `Hey
cette

chaîne de caractères
est génial!`

Les modèles littéraux sont également intéressants car ils permettent d'interpoler facilement des variables et des expressions dans des chaînes.

Pour ce faire, utilisez la syntaxe ${...}:

const variable = 'à tester'
const unPetitTest = `quelque chose ${var}`

// "quelque chose à tester"

à l'intérieur du ${}, vous pouvez ajouter n'importe quoi, même des expressions:

const encoreUnTest = `quelque chose ${1 + 2 + 3}` // "quelque chose 6"
const string2 = `quelque chose
   ${ (false) ? 'x' : 'y'}`  // "quelque chose y"

Tableaux

Un tableau est une collection d'éléments.

Les tableaux en JavaScript ne sont pas un type en soi.

Les tableaux sont des objets.

Nous pouvons initialiser un tableau vide de deux manières différentes:

const tab = []
const Array()

La première consiste à utiliser la syntaxe littérale du tableau. La seconde utilise la fonction intégrée Array.

Vous pouvez pré-remplir le tableau à l'aide de cette syntaxe:

const tab = [ 1, 45, 6 ]
const tab2 = Array.of(1,2,3)

Les tableaux peuvent contenir tout type d'éléments:

const tab = [ 12 , "test" , [ 1 , 2 , 3 ]]

On peut accéder aux éléments du tableau par leur indice:

const tab = [ 23 , 5 , "Coucou"]
tab[1] // 5
tab[2] // "Coucou" 

On peut initialiser un tableau en spécifiant sa longueur et en le remplissant avec par exemple des 0:

const grosTableau = Array[12].fill(0)

On peut également en connaitre la longueur et la modifier:

const a = [1, 2, 3]
a //[ 1, 2, 3 ]
a.length // 3
a.length = 2
a //[ 1, 2 ] 

Ajouter, Enlever, Joindre et Chercher

const tableau = [1,2,3,4]
tableau.push(5) // a devient [1,2,3,4,5]
tableau.unshift(0) // a devient [0,1,2,3,4,5]
tableau.pop(5) // a devient [0,1,2,3,4]
tableau.shift(0) // a devient [1,2,3,4]

Vous pouvez joindre plusieurs tableaux en utilisant concat():

const a = [1, 2]
const b = [3, 4]
const c = a.concat(b) //[1,2,3,4]
a //[1,2]
b //[3,4]

Vous pouvez également utiliser l'opérateur de propagation spread (...) de cette manière:

const a = [1, 2]
const b = [3, 4]
const c = [...a, ...b]
c //[1,2,3,4] »

Enfin, pour rechercher vous pouvez utiliser la méthode find() d'un tableau:

a.find((element, index, tableau) => {
   // retourne vrai ou faux
})

Renvoie le premier élément qui renvoie true. Renvoie undefined si l'élément n'est pas trouvé.

Une syntaxe couramment utilisée est:

a.find(x => x.id === mon_id)

La ligne ci-dessus renverra le premier élément du tableau qui a id === my_id.

findIndex() fonctionne de manière similaire à find(), mais renvoie l'index du premier élément qui renvoie true, et s'il n'est pas trouvé, il renvoie undefined :

a.findIndex((élément, index, tableau) => {
   // retourne vrai ou faux
})

exemple:

const array1 = [5, 12, 8, 130, 44];

array1.findIndex(x => x === 8) // renvoie 2

Une autre méthode est includes():

a.includes(valeur)

Renvoie true si a contient une valeur.

a.includes(valeur, i)

Renvoie true si a contient une valeur après la position i.


retrouvez toutes les méthodes des tableaux ici