0 added
0 removed
Original
2026-01-01
Modified
2026-02-26
1
<p>Значением свойства объекта может быть всё, что угодно, включая другой объект или массив:</p>
1
<p>Значением свойства объекта может быть всё, что угодно, включая другой объект или массив:</p>
2
<p>Все то же самое можно определить сразу при создании объекта:</p>
2
<p>Все то же самое можно определить сразу при создании объекта:</p>
3
<p>В этом случае обращение к вложенным элементам происходит по цепочке:</p>
3
<p>В этом случае обращение к вложенным элементам происходит по цепочке:</p>
4
<h2>Печать на экран</h2>
4
<h2>Печать на экран</h2>
5
<p>В console.log() встроено одно ограничение. Если в объекте есть другие объекты на глубине больше второго уровня вложенности, то при выводе такого объекта на экран вместо объектов отобразится строка [Object], а вместо массива - [Array].</p>
5
<p>В console.log() встроено одно ограничение. Если в объекте есть другие объекты на глубине больше второго уровня вложенности, то при выводе такого объекта на экран вместо объектов отобразится строка [Object], а вместо массива - [Array].</p>
6
<p>Для вывода таких объектов можно воспользоваться функцией преобразования в JSON:</p>
6
<p>Для вывода таких объектов можно воспользоваться функцией преобразования в JSON:</p>
7
<h2>Проверки в глубину</h2>
7
<h2>Проверки в глубину</h2>
8
<p>При работе с вложенными объектами резко усложняется задача проверки существования ключей. Приходится строить цепочку из условий до нужного свойства. Представьте, что нам нужно добраться до 4 уровня вложенности и мы не уверены в том, что существуют все промежуточные объекты:</p>
8
<p>При работе с вложенными объектами резко усложняется задача проверки существования ключей. Приходится строить цепочку из условий до нужного свойства. Представьте, что нам нужно добраться до 4 уровня вложенности и мы не уверены в том, что существуют все промежуточные объекты:</p>
9
<p>Так будет выглядеть решение в лоб. Однако, есть более удобный способ, речь о котором ниже.</p>
9
<p>Так будет выглядеть решение в лоб. Однако, есть более удобный способ, речь о котором ниже.</p>
10
<h3>Оператор опциональной последовательности</h3>
10
<h3>Оператор опциональной последовательности</h3>
11
<p>Если задача состоит в том, чтобы извлечь данные, а не просто проверить их существование, то можно пойти другим путем. В Javascript встроен<a>оператор опциональной последовательности</a>(optional chaining), который позволяет извлекать вложенные данные без проверок:</p>
11
<p>Если задача состоит в том, чтобы извлечь данные, а не просто проверить их существование, то можно пойти другим путем. В Javascript встроен<a>оператор опциональной последовательности</a>(optional chaining), который позволяет извлекать вложенные данные без проверок:</p>
12
<p>Этот оператор никогда не приводит к ошибке. Он работает на любых типах данных и всегда возвращает либо undefined, либо значение указанного свойства, если оно существует.</p>
12
<p>Этот оператор никогда не приводит к ошибке. Он работает на любых типах данных и всегда возвращает либо undefined, либо значение указанного свойства, если оно существует.</p>
13
<p>Оператор не меняет общий подход работы с ключами в объектах. Этот же пример с динамическим ключом:</p>
13
<p>Оператор не меняет общий подход работы с ключами в объектах. Этот же пример с динамическим ключом:</p>
14
<h3>Оператор нулевого слияния</h3>
14
<h3>Оператор нулевого слияния</h3>
15
<p>С помощью<a>оператора нулевого слияния</a>, можно не только получить значение цепочки любой вложенности, но и определить значение по умолчанию для него.</p>
15
<p>С помощью<a>оператора нулевого слияния</a>, можно не только получить значение цепочки любой вложенности, но и определить значение по умолчанию для него.</p>
16
<p>Значение по умолчанию возвращается только в том случае, когда слева undefined или null. В этом смысле данный оператор совсем не похож на логическое сравнение ||:</p>
16
<p>Значение по умолчанию возвращается только в том случае, когда слева undefined или null. В этом смысле данный оператор совсем не похож на логическое сравнение ||:</p>
17
<h3>get (lodash)</h3>
17
<h3>get (lodash)</h3>
18
<p>Пример выше перегружен символами и выглядит достаточно сложно. Как альтернативу можно использовать функцию get() библиотеки Lodash.</p>
18
<p>Пример выше перегружен символами и выглядит достаточно сложно. Как альтернативу можно использовать функцию get() библиотеки Lodash.</p>
19
<p>get() особенно удобен в случае динамических ключей. В таком случае вторым аргументом можно передать массив ключей:</p>
19
<p>get() особенно удобен в случае динамических ключей. В таком случае вторым аргументом можно передать массив ключей:</p>
20
20