Что произойдет при изменении массива через одну переменную, если он был присвоен другой переменной?

В JavaScript объекты (включая массивы, функции и обычные объекты) являются ссылочными типами данных. Это означает, что переменная хранит не само значение, а адрес (ссылку) на место в памяти, где находятся данные. При присваивании массива другой переменной копируется именно эта ссылка, а не содержимое массива.

Как это работает

Рассмотрим пример:

let arr1 = [1, 2, 3];
let arr2 = arr1; // arr2 теперь ссылается на тот же массив
arr2.push(4); // Изменяем массив через arr2
console.log(arr1); // [1, 2, 3, 4] - arr1 также "видит" изменение

Обе переменные arr1 и arr2 указывают на один и тот же массив. Любая операция, изменяющая массив (мутация), такая как push, pop, splice или прямое присваивание по индексу, отразится при обращении через любую из переменных.

Где это применяется и какие есть подводные камни

Это поведение используется для передачи массивов в функции без создания копий, что может быть эффективно по памяти. Однако оно часто приводит к багам, когда разработчик неосознанно изменяет исходные данные. Например, при работе с состоянием в React или Redux неожиданные мутации могут вызвать проблемы с рендерингом.

Чтобы избежать таких ситуаций, нужно создавать копии массива:

• Поверхностная копия: let copy = [...arr1]; или let copy = arr1.slice();
• Глубокая копия (для вложенных объектов): let deepCopy = JSON.parse(JSON.stringify(arr1)); или с помощью structuredClone.

Пример с копированием:

let original = [1, 2, 3];
let independentCopy = [...original]; // Создаётся новый массив
independentCopy.push(4);
console.log(original); // [1, 2, 3] - исходный массив не изменился

Вывод: Понимание ссылочной природы массивов критично для написания предсказуемого кода. Всегда учитывайте, что присваивание не создаёт копию данных. Если нужно работать с независимой версией массива, создавайте явную копию подходящим методом.