У всех нас есть такая модель, что переменная - это блок, содержащий какое-то значение, например. пусть a содержит 10.

Позвольте задать вам простой вопрос. Что такое переменная?

Возможно, вы ответили, что переменная - это ячейка в памяти, которая содержит какое-то значение, и вы представили себе что-то, как показано ниже.

Но достаточно ли этого? Должны ли мы оставить это здесь?

Нет, чтобы лучше понять концепции переменных, объектов, ссылок и т. Д. В javascript, мы должны копнуть немного глубже, чтобы узнать, как это на самом деле работает.

Посмотрите на иллюстрацию ниже и попытайтесь понять, чем она отличается от приведенной выше.

Переменная - это просто ссылка на значение в памяти. Представьте себе это как нить, идущую из одной точки в другую. Итак, a не 10, а просто указывает на 10 в памяти.

Обратите внимание на следующие утверждения:

let a = 10;

a = 20;

Так изменится ли значение a? Нет, это то же самое, просто указание на новое значение. Иллюстрация поможет вам лучше понять это.

Теперь перейдем к всемогущим объектам в JavaScript.

Прочтите следующий пример кода:

А теперь попробуйте представить, как этот объект будет храниться в памяти. Подсказка: попробуйте распаковать пиццу.

Выполнено? Итак, давайте посмотрим, как это на самом деле представлено.

Ваша модель может выглядеть почти так же, за исключением того, что объект "ингредиенты" вложен в объект "пицца", но это не так.

Объекты не могут быть вложены в память, поэтому сам объект-ингредиент представляет собой отдельную сущность, на которую ссылается объект «пицца».

Но вопрос в том, зачем вам это вообще нужно?

Попробуйте прочитать приведенный ниже код и найдите его вывод.

Странный? В обеих ваших пиццах по 300 г сыра. Чтобы понять это, достаточно взглянуть на эту иллюстрацию.

Помните, я говорил вам, что ингредиенты - это отдельная сущность, на которую ссылается объект pizza. Итак, когда мы создали newPizza, мы ссылались на ту же самую сущность, а при изменении значения в newPizza изменили саму сущность. Но обе пиццы по-прежнему ссылались на один и тот же объект ингредиентов.

Так как это исправить? На самом деле все очень просто.

Поэтому вместо того, чтобы ссылаться на предыдущий объект «ингредиенты», мы создали новый, который сам по себе является отдельной сущностью. Взгляните на иллюстрацию ниже.

«Я надеюсь, что эта статья помогла вам понять, как базовые вещи обычно работают под капотом, и в будущем вы легко сможете распаковать JavaScript.