Только ли объекты хранятся по ссылке

Хранение данных в JavaScript: по ссылке и по значению

Нет, утверждение, что только объекты хранятся по ссылке, не совсем верно, хотя оно отражает распространённое упрощение. В JavaScript механизм передачи данных зависит от типа данных, и это разделение часто описывают как примитивные типы (хранятся и передаются по значению) и ссылочные типы (хранятся и передаются по ссылке). Однако, если говорить точно, в JavaScript всегда передаётся значение, но для ссылочных типов это значение — и есть ссылка на объект в памяти. Давайте разберём детально.

Примитивные типы (передача по значению)

Примитивы в JavaScript: string, number, boolean, null, undefined, symbol, bigint. При работе с ними копируется само значение. Изменение одной переменной не влияет на другую.

let a = 10;
let b = a; // Копируется значение 10
b = 20;
console.log(a); // 10, осталось неизменным
console.log(b); // 20

Ссылочные типы (передача значения-ссылки)

К ссылочным типам относятся: объекты ({}), массивы ([]), функции (function(){}) и другие. При присваивании или передаче в функцию копируется не сам объект, а ссылка на него. Несколько переменных могут указывать на один объект в памяти.

let obj1 = { name: 'Alice' };
let obj2 = obj1; // Копируется ссылка на объект
obj2.name = 'Bob';
console.log(obj1.name); // 'Bob', изменение отразилось и тут!
console.log(obj2.name); // 'Bob'

Нюансы и важные аспекты

1. Не только объекты: Массивы и функции технически тоже объекты, поэтому они тоже хранятся и передаются через ссылку.
2. Изменение vs переприсваивание: Важно различать изменение свойств объекта и переприсваивание переменной.

   let arr1 = [1, 2];
   let arr2 = arr1;
   arr2.push(3); // Изменение объекта: arr1 тоже изменится
   console.log(arr1); // [1, 2, 3]
   
   arr2 = [4, 5]; // Переприсваивание: arr2 теперь ссылается на новый массив
   console.log(arr1); // [1, 2, 3] — arr1 не изменилось
   

3. Поверхностное и глубокое копирование: Для создания независимых копий объектов нужно копировать их структуру.

   // Поверхностное копирование (неглубокое)
   let original = { a: 1, b: { inner: 2 } };
   let shallowCopy = { ...original };
   shallowCopy.b.inner = 99; // Изменение вложенного объекта затронет original!
   console.log(original.b.inner); // 99
   

4. Сравнение: Примитивы сравниваются по значению, объекты — по ссылке.

   let num1 = 5, num2 = 5;
   console.log(num1 === num2); // true, одинаковые значения
   
   let objA = { id: 1 };
   let objB = { id: 1 };
   console.log(objA === objB); // false, разные ссылки в памяти!
   

Итог

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