Lỗi thay đổi phần tử mảng trong JavaScript

Hãy xem xét lỗi xảy ra khi thay đổi phần tử mảng một cách không chính xác. Giả sử chúng ta có một mảng như sau:

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

Giả sử chúng ta cũng có một hàm nhận một số làm tham số và trả về bình phương của số đó:

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

Hãy sử dụng vòng lặp for-of để duyệt qua mảng của chúng ta và áp dụng hàm của chúng ta cho mỗi phần tử của nó:

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

Đây là nơi người mới bắt đầu thường mắc phải một lỗi. Vấn đề là việc thay đổi biến elem không dẫn đến thay đổi phần tử trong chính mảng. Hãy kiểm chứng điều này:

console.log(arr); // mảng không thay đổi

Mảng không thay đổi vì biến elem lưu trữ một bản sao của phần tử, không phải tham chiếu đến nó. Việc thay đổi elem chỉ ảnh hưởng đến bản sao, chứ không ảnh hưởng đến chính mảng.

Để giải quyết vấn đề, cần thay đổi chính các phần tử của mảng:

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

console.log(arr); // giờ mảng đã thay đổi