Błąd zmiany elementu tablicy w JavaScript

Przyjrzyjmy się błędowi występującemu przy nieprawidłowej zmianie elementu tablicy. Załóżmy, że mamy taką tablicę:

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

Załóżmy również, że mamy funkcję, która przyjmuje liczbę jako parametr i zwraca kwadrat tej liczby:

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

Za pomocą pętli for-of przejdźmy przez naszą tablicę i do każdego z jej elementów zastosujmy naszą funkcję:

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

W tym miejscu początkujący często popełniają błąd. Chodzi o to, że zmiana zmiennej elem nie prowadzi do zmiany elementu w samej tablicy. Przekonajmy się o tym:

console.log(arr); // tablica nie zmieniła się

Tablica nie zmienia się dlatego, że w zmiennej elem przechowywana jest kopia elementu, a nie referencja do niego. Zmiana elem wpływa na kopię, ale nie na samą tablicę.

Aby rozwiązać problem, należy zmieniać właśnie elementy tablicy:

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

console.log(arr); // teraz tablica się zmieniła