Immutable. Неизменяемость данных JavaScript
HTML-код
- Опубликовано: 1 окт 2024
- Широко применяется во frontend разработке в том или ином виде. Концепция настолько сильна, что просочилась в angular через NGRX. Этот менеджер хранилища часто используется в приложениях с большим количеством данных и сложной логикой обработки этих данных.
Основной принцип, если нужно что то добавить в объект или массив, то копируй с добавлением. После чего копию нельзя будет изменять.
В уроке я показал как копировать массив или объект согласно принципу неизменяемости данных.
презентация docs.google.co...
JavaScript
Спасибо, в конце для меня была новая информация. Никогда об этом не задумывалась. Действительно лучше вернуть сразу то, что покороче
В коде более разумным кажется был бы метод some, а не filter
Использовал фильтр как типичное решение, вариантов больше чем один, спасибо за дополнение
Реальный случай, который был у меня. На проекте был (и есть) словарь. Реализован он в translate-сервисе. Есть там список стран: { ru: [ name: 'Россия', description: 'Российская Федерация' ], ...другие страны }
И вот надо из определённого дропбокса/списка убрать одну из стран. Ну я её убираю от туда. А сам файл-словарь - он же для всего приложения один! И, получилось, что во всём приложении из словаря пропала эта страна. Очень непросто было: 1) выявить эту ошибку; 2) понять + вспомнить как я убирал одну из стран.
Короче, потом когда удалял или добавлял что-то в словаре, то всего копировал изначальный объект.
Такие файлы должны быть под git и тогда видно какие изменения были сделаны
Без git жизнь гораздо труднее
@@grommaks Весь проект естественно в гите. Я говорил о том, что я удалил поле из словаря, который находится в памяти браузера.
@@VasyaFF не правильно сначала понял, хороший пример ошибки с мутацией данных 👍
Может быть я чего-то не понял. Но что это за if (array === newArray) это где так массивы сравнивают?
Массив это объект, так сравнивают ссылки на объекты
В иммутабельном коде так сравнивают, мемоизированные функции, такие как селекторы в redux / ngrx не пересчитываются если массив остался старым, даже если он мутировал
Спасибо, Максим, за оперативность) Это я так невнимательно смотрю)) действительно, там же ссылка будет идти на один и тот же объект при сравнении.
Привет! Расскажи, пожалуйста, о фул стек разработке. То есть стоит ли из фронта переходить в фул стек. Просто я думаю, что происходит распыление. Человек не становится экспертом в какой-то то области, а делает всю работу на "хорошо", а не "отлично". В чем плюшки?)
Интересная тема :) расскажу)
я может где-то что-то не понял, но почему a === [...a] выдает false, в чем разница с вашим описанием работы в ролике?
На какой минуте у меня?
По описанию должно быть false, так как новый массив создан
9-00 , либо я что-то не допонял) @@grommaks
Там иф, если не нужно добавлять то вернется a без копирования
Макс, спасибо. Очень интересно объяснил
structuredClone()
Я думаю, в проверке на существование элемента логичнее было использовать метод "find" вместо "filter + getLength".
Совершенно верно :)
Но стоит помнить, если нет вебпака, то метод find не поддерживается на IE11...это все вордпрес, опенкард и мадженто проекты 😁
@@grommaks тоже не видел ничего подобного
или фильтр присвоить в переменную, или if внутри фильтр
смотрится не очень
2:48 Не факт, что мы съедим всю память браузера, там есть сборщик мусора. Immutability используется в основном для безопасного программирования, чтобы другие части проекта не заафектили состояние и это не привело к последствиям
Если будут 1000 елементов и все будут числа или строки...и мы будем копировать их несколько раз по цепочке, то мы создадим N массивов с этими данными. Сборщик мусора соберет их если ссылка убита, тут да...
Ничего не понял но очень интересно
Насколько я помню, оператор {...} не делает глубокого копирования, поэтому будет ли так, что свойства emails будут у них одинаковые, у старого и нового объектов?
Спред оператор не делает глубокое копирование, при иммутабельном подходе это именно то что нам нужно, если email не мутирует то мы можем его переиспользовать во всех копиях где email не должен меняться
@@grommaks спасибо! Отличные видео на канале!
Здорово, очень понравилось! Автору большое спасибо) Хотелось бы побольше подобных тем относительно оптимизации и лучших практик
Спасибо за обратную связь 😎 такие тематики мне тоже нравятся, буду чаще такое делать 😁