Erreur de modification d'élément de tableau en JavaScript

Examinons l'erreur qui se produit lors de la modification incorrecte d'un élément de tableau. Supposons que nous ayons un tel tableau :

let arr = [1, 2, 3, 4, 5];

Supposons que nous ayons également une fonction qui prend un nombre en paramètre et renvoie le carré de ce nombre :

function func(num) {
	return num ** 2;
}

Utilisons une boucle for-of pour parcourir notre tableau et appliquer notre fonction à chacun de ses éléments :

for (let elem of arr) {
	elem = func(elem);
}

C'est à cet endroit que les débutants commettent souvent une erreur. Le fait est que la modification de la variable elem n'entraîne pas la modification de l'élément dans le tableau lui-même. Vérifions cela :

console.log(arr); // le tableau n'a pas changé

Le tableau ne change pas parce que la variable elem contient une copie de l'élément, et non une référence vers celui-ci. La modification de elem affecte la copie, mais pas le tableau lui-même.

Pour résoudre le problème, il faut modifier précisément les éléments du tableau :

for (let i = 0; i < arr.length; i++) {
	arr[i] = func(arr[i]);
}

console.log(arr); // maintenant le tableau a changé