Композиция или Наследование в JavaScript? 

Готовим набор навыков и знаний под Vue 3

Замечательные у вас уроки, огромное спасибо!

Спасибо, хороший материал. Отличная подача и понятные примеры. Жду ещё видео по тему чистого js.

Спасибо за очередной урок!

Очень хорошее видео с понятным объяснением и примером. Спасибо )

Спасибо. Показываете очень полезные и важные вещи.

Спасибо большое, рассказал интересно и доступно, жду подобные видео еще:)

Спасибо, очень интересно. Реально классно.

Спасибо большое! Действительно нереальная гибкость композиции!

Отличное видео. Сам примерно пол года назад узнал про композицию и стал местами использовать. Очень упрощает жизнь и заставляет иногда посмотреть на функционал с другой стороны

Как же это божественно, надо больше!:)

Еще не программирую на JS, но очень нравятся ролики, все детально разъяснено! Спасибо

Коротко и по делу. Спасибо за видео

Вот не знаю сколько прошло времени с тех пор как ты записывал свой курс для webformyself, но чувствуется рост скилла в подаче материала и тд))

Очень доступно и лаконично, спасибо)

Очень познавательно, спасибо!

Интересный урок, большое спасибо!

Владилен, спасибо огромное!

ура новое видео, только вчера думал "когда же новое видео" все уже посмотрел

Знания, которыми Вы делитесь, настолько ценны, что я просто в афиге от степени этой ценности! Огромное спасибо за Ваш труд!

Супер! Спасибо бро 🙏

5:45 О нет, обманул нас... Моя жизнь больше никогда не будет прежней)

Заинтересовался преимуществами Composition API во Vue3. Благодаря Вам стало всё понятно. Спасибо!

Очередная благодарнось 👍🏿🙏🏿🔥

Ты просто супер 👏🏻 большое спасибо

Очень интересно и полезно!

Спасибо большое! Супер!

Спасибо Владилен, все обучающие ролики топ)! Ваш ученик с Udemy.

И почему я не знал об этом канале раньше, Лайк и Подписка )))

было интересно, спасибо

Спасибо! Все супер!

Спасибо, отличное видео.

Очень интересно!

Как всегда топ!!!

Лично мне очень понравилось, спасибо.

самый годный контент на тему веб разработки

вообще круто! контент интересен))

Будет ли ролик про структуру, про то как писать api для связи с бэком?)

Лайк не глядя

Thanks for the useful information

Cпосибо Очень интересный материал, Хотелось по больше про , Functional Programming, pure functions, currying, recursion...

Хорошо назвал бэкендера 👍✌️

Огромное спасибо

Контент, безусловно и как всегда, очень интересен. Спасибо! А Елена рулит))) И все-таки, композиционный подход пока оставляет двоякое впечатление. С одной стороны, он дает новый уровень масштабирования, с другой, выглядит непривычно и как будто даже бессистемно. Видимо глаз, привыкший к ООП, не хочет принимать это)))))

Очень полезный ролик! Как раз сейчас обучаюсь JS, и написал основной функционал своего тестового сайта на классах. Я знал при этом, что вместо классов можно использовать так называемые билдеры, которые строят объекты как показано здесь. Но я не знал, что можно ими заменить классы и сымитировать наследование! Возможно, буду переписывать классы на билдеры, потому как они мне кажутся лучше. Проблема с классами в том, что создаётся слишком глубокое дерево, из-за чего увеличивается время вызова функций, и их становится сложнее отслеживать. С билдерами можно быть гибче. С другой стороны, классы дают более чёткую структуру и понимание проекта. К тому же у классов можно вызвать методы родителя через super(), что даёт лучший контроль над получаемым объектом. Также классы вполне можно расширить за счёт миксинов, что даёт те же возможности, что и композиция. В классах понятно, как работает this, а используется он довольно часто. В композиции с ним легко будет запутаться, потому что связности нет и постоянно нужно гадать, что это за this. Поэтому, даже не знаю, что лучше. Это абсолютно разные способы мышления, и, если честно, классы мне всё же нравятся больше. Благодаря им у меня получается кодировать очень просто, в отличие от композиции. В голове более ясная и понятная картина, когда есть классы, а это ускоряет разработку.

Отлично!

Спасибо большое

Спасибо!

Спасибо за то, что показали недостаток отсутствия в языке множественного наследования.

Офигенный видос

Спасибо большое за твои труды) годнота твоего контента превышает 100% качества) Thank you)

Класс! 👍

Спасибо за урок! Вопрос не по теме: тебе удобнее с мышью или трекпадом работать? Хочу знать к чему лучше привыкать.

Не обезательно избавлятся от классов для работы с композицями, можно просто расширять их миксинами: class Programmer {...} function canFrontend () {...} function canBackend () {...} class Fullstack extends Programmer {...} Object.assign(Fullstack.prototype, {canFrontend, canBackend})

Владилен Минин, расскажи про агрегацию пожалуйста, это как раз из этой темы.

Как альтернатива, пример композиции выполненной с помощью классов, более КЛАССический вариант (pun intended): class Engine { constructor(volume) { this.volume = volume; } start() { console.log(`${this.volume} liters engine says: wrum-wrum!`); } } class FuelTank { constructor(liters) { this.liters = liters; } use(liters) { this.liters -= liters; console.log(`${liters} liters of gas were used. ${this.liters} left in the tank`); } } class Car { constructor(make, engineVol, tankVol) { this._make = make; this._engine = new Engine(engineVol); this._tank = new FuelTank(tankVol); } start() { console.warn(`Starting your brand-new ${this._make} car`); this._engine.start(); this._tank.use(2); } } let car = new Car('Audiii', 8, 63); car.start();

Подтверждаю. Контент интересен. Лайк.

Спасибо за труд. Все понятно и полезно особенно для фаната Vue. Жду уроки Vue 3

Вот добрался наконец... Прикольная задумка. Чем то Vuex напоминает. Там же тоже mapGetters, mapAtions, etc... подобным образом же разворачиваются, если я правильно всё понял. Плохо, что ещё один лайк влепить нельзя ))

Привет, Владилен! С большим удовольствием смотрю твои уроки! А теперь вопрос :) : не проще ли (и нагляднее/понятнее) применить наследование Programmer -> Frontend -> Backend , потом const fullstack = new Backend и вызываем то, что нужно? Понимаю, что backend тоже будет доступно все, но ведь можно дергать только то, что надо. Я не умничаю, а просто учусь :). Твоя искренняя поклонница :)

Напомнило setState из React

нормуль!

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

Это один из часто используемых в программировании паттерн Стратегия.

Спасибо за замечательные видео. Сам я от фронта очень далек, но зачем так сложно? В JS можно и так: class Programmer { constructor(name, prop={}) { this.name = name; this.add(prop); } code() { console.log(`${this.name} is coding...`); } add(prop) { Object.entries(prop).forEach(([key, value]) => this[key] = value); } } function angular() { console.log(`${this.name} is create Angular app...`); } function vue() { console.log(`${this.name} is create Vue app...`); } function node() { console.log(`${this.name} is create Node JS app...`); } function react() { console.log(`${this.name} is create React app...`); } const Oleg = new Programmer('Oleg',{react,angular}); // Oleg знает react и angular Oleg.add({node,vue}); //Выучил node и vue Oleg.vue(); И никакого дублированния кода.

Композиции - супер!!! Те же классы, только в процедурах! )) Если честно, мне такой подход понравился больше, чем классы, и он мне кажется более универсальным. Спасибо, Владилен, за такой контент!

А композиционный подход можно использовать в рамках классов ?

Delightfully!

В классическом ООП композиция достигается за счет ДЕЛЕГИРОВАНИЯ, а не построения объекта за счет вызова нескольких функций, наращивающих функционал. Во многих туториалах/статьях показывают похожие примеры (как здесь) и выдают это за ТРУ композицию, но это не так. Кто интересуется (или не верит) загляните в "Design Patterns: Elements of Reusable Object-Oriented Software" от 1994 года. Раздел Delegation примерно на 20 странице. p.s.: не поймите неправильно. Мне очень нравятся многие видосы Владилена (кроме этого)

для этой цели лучше использовать примеси или обернуть в декоратор

спасибо

composition over inheritance это хорошо очень хотелось бы от тебя курс по ramdajs очень не хватает на рускоязычно ютубе

Класс

A common composition pattern in JavaScript is using object composition. It combines the power of objects and functional programming. Всегда пытался понять, как такой подход правильно называется в мире программирования, теперь знаю - Композиция :)

12:07 Олег на все берется смело...

Прикольненько

Второй вариант можно реализовать через prototype?

Ждем контент по вью !!!

Чем композиция может выделиться на фоне миксинов ?

как ты ставишь обратные ковычки на маке в пхпсторме? :)

Больше видео о архитектуре

Ролик супер! Жаль, что не могу 50 claps поставить, как на Медиуме :)

Привет) Подскажи плиз. Начал учить реакт. Берут сейчас в большую фирму, входит в топ моей страны, но по началу будет поддержка легаси и нужно будет учить ангулар. Реакт продолжать учить, или в таком случае будет намного правильней сделать весь упор на ангулар? Кстати спасибо, готовился к собеседованию по твоим роликам и успешно его прошел)

А как можно по-другому решить подобную проблему наследования в классах без использования дублирующего кода?

Владилен даже на отдыхе качественно пилит)

👍👍👍👍👍

Но ведь это больше похоже на миксины. И есть проблема с тем что можно переопределить метод уже имеющийся в объекте. В то время как вью компощине апи не имеет такой проблемы

Владилен, а не кажется ли вам, что это подозрительно сильно похоже на смесь паттернов фабрика и стратегия?

Почему в классах точно так же не вынести функцию за пределы класса и в методе просто ее использовать? Или как ООП справляется с такой задачей?

Тоже самое можно сделать с наследованием, просто немного извратится

спасибо за урок конечно но по мне так в ООП понятно что происходит а тут мне страшно становится) не понимаю ещё такой синтаксис const programmer = { name } и это тоже непонятно как работает function myfunct ( { name } ) { } сама передача параметров с фигурными скобками озадачила как это работает ?

проблему с наследованим можно было бы решить с помощью трейтов или интерфейсов, но к сожалении в жс пока нет полноценного ооп... (

Приватные поля немного по-другому выглядят: v8.dev/features/class-fields

Похоже немного по замыслу на HOC.

Спасибо!)

Привет))). Такая любовь к фронтендерам. Все с именами людскими, одни фронтендеры - нонейм)))

Будет ли ролик про принципы Solid

Это примерно как интерфейсы и класы в java?

Комментарий для продвижения видео)))))

Будут видео про паттерны разработки?