Деструктуризация объектов. Фундаментальный JavaScript
ฝัง
- เผยแพร่เมื่อ 30 ก.ย. 2020
- Извлекать значения из объектов приходится чаще, чем из массивов, и процедура эта несколько более замысловатая. Разбираемся со всеми нюансами деструктуризации объектов, включая переименование переменных и получение вложенных структур.
#деструктуризация #javascript
__
Мои курсы по вебу с купонами:
✅ mishanep.com/
📢 Заказать консультацию можно здесь pcgramota.com/courses/konsult...
![[38] Cookie vs LocalStorage vs SessionStorage | [Подготовка JS разработчика к интервью]](http://i.ytimg.com/vi/pmd8D_YZ0BE/mqdefault.jpg)
Сори, что вмешиваюсь, но есть просьба, когда даете примеры в темах, каждый раз сопровождайте их, пожалуйста, проверкой в консоли, чтобы наглядно было видно какой дает результат каждый пример, не только на словах, но и в консоли. Спасибо)
Спасибо за обратную связь. Учту.
Спасибо за отличное объяснение!!!
Очень круто, спасибо!
Спасибо за видео ❤
Классные уроки👍
Оставляю комментарий как того и ожидал Михаил))
Отлично 👍
Огонь!
спасибо
Михаил, спасибо еще раз за прекрасный урок! У меня вопрос: почему система не увидела неиспользованный ключ "b: 10" (строка кода nr.6), а в ...tail записала только "b: 2"?
Потому что ключ b со значением 10 является вложенным для ключа c (строка 4). А ключ с участвует в деструктуризации.
Здравствуйте! Подскажите пожалуйста чем можно заменить такую запись const { poster: {data: {attributes: {formats: {thumbnail: {url}}}}} } = movie; Хочется какое-то более оптимизированное решение, чем каждый раз писать такую длинную деструктуризацию
Ramda.js предоставляет отличный хэлпер path, куда можно передать список вложенных ключей и получить значение. А так, всегда можно пойти по пути дата-процессинга и предварительно обрабатывать полученную структуру, приводя её к более простой.
@@mishanep спасибо за ответ, а можно подробнее про дата процессинг? Может материалы какие-то или уроки есть?
@@annielindenberg8580 дата-процессинг в данном случае это конвертация данных. Вы пишите функцию-хэлпер, которая перебирает одну структуру данных и возвращает другую - упрощенную, часто с меньшим количеством полей. Но главное соответствующую api фронтенд приложения.
Их можно писать как угодно. Мне нравится использовать для этого методы из ramda.js, по которой у меня есть отдельный плейлист.
@@mishanep спасибо большое, посмотрю
Здравствуйте!
Подскажите, пожалуйста, в случае записи:
let a, b;
( {a,b} = obj )
Я правильно понимаю, что обязательно должно быть совпадение имён переменных и названий ключей нашего объекта?
Да, но извлекая ключ по его названию, ему можно задать другое имя
( { propName: myCustomName } = obj )
@@mishanep Cпасибо!
Но разве в данном случае не создается переменная myCustomName?
То есть, нам не нужно её заранее объявлять?
Извиняюсь за беспокойство, сейчас протестировал, объявлять переменную всё равно нужно!
Спасибо большое!
вернулся к этим видео, но так и не решил свою проблему. столкнулся с тем что мапил массив обьектов в реакте, и у каждого el возвращал компонент, условно , в который деструктурировал в провсах все его свойства. то есть, , но как выяснилось, в пропсах сидит [object object]. мучался долго, и по итогу так и не понял в чем же дело. причем, если поиспользовать эти пропсы в компоненте, то всё работает корректно
Павел, если будет ссылка на пример в песочнице, то проще будет ответить что-то по существу.
Вот ты правильно сказал что диструкторизация очень тяжело дается, но не совсем в том контексте... Деструкторизация тяжело дается JS-у и повсеместно её не получится использовать, так как она дает очень жесткий удар по скорости выполнения кода. Я когда вижу джуна который для вытаскивания 1-2 значений использует деструкторизацию, обычно заварачиваю пулл реквест целиком с пометкой - очень медленный код. А вот так что-бы конкретно бесит, это использование её вместо, параметров функции - function hello({id, name, age}) {} hello({id: 1, name: "BadAss", age:-1}); Вот этим страдает дофига упоротых тапков которые насмотрятся видосов по реакту, а потом начинают вот жестко так говнокодить!
А чем вы аргументируете, что из за деструктуризации код становится очень медленным?