JavaScript Паттерны. Шаблоны проектирования. 17 Примеров

Поділитися
Вставка
  • Опубліковано 3 лют 2025

КОМЕНТАРІ • 411

  • @VladilenMinin
    @VladilenMinin  5 років тому +34

    Ребят, у кого выдает ошибку
    static list = {
    ^
    SyntaxError: Unexpected token =
    Обновите версию NodeJS до последней

    • @denisdavydoff7863
      @denisdavydoff7863 5 років тому

      не работает на посл версии, браузер говорит я дебил, bad method definition

    • @user-ch76tcye4vvuu8
      @user-ch76tcye4vvuu8 5 років тому +1

      @@denisdavydoff7863 В браузере и не должно работать.

    • @pavelgramenitsky925
      @pavelgramenitsky925 5 років тому +1

      день убил, чтобы понять почему не работает, огромное спасибо за коммент

    • @fitnesshacker_
      @fitnesshacker_ 5 років тому

      Спасибо, помогло!

    • @АндрейКрестовников-б5ы
      @АндрейКрестовников-б5ы 4 роки тому

      Тоже хотел спросить про этот момент: по спецификации ES6 через static определяются только методы, не свойства. Это новая спецификация или что? Явно не работает в стабильной ноде, зачем вы это используете?

  • @VladilenMinin
    @VladilenMinin  5 років тому +150

    Creational Design Patterns
    Constructor 4:57
    Factory 10:15
    Prototype 20:09
    Singleton 23:31
    Structural Design Patterns
    Adapter 29:09
    Decorator 35:40
    Façade 41:26
    Flyweight 50:39
    Proxy 57:15
    Behavioral Design Patterns
    Chain of Responsibility 1:03:13
    Command 1:06:58
    Iterator 1:11:58
    Mediator 1:18:24
    Observer 1:26:00
    State 1:36:15
    Strategy 1:43:40
    Template 1:47:30

    • @denisdavydoff7863
      @denisdavydoff7863 5 років тому +24

      Ещё и тайминг сделал, вот ты машина

    • @VladilenMinin
      @VladilenMinin  5 років тому +28

      @@denisdavydoff7863 Думаю с ними удобно)

    • @user-ch76tcye4vvuu8
      @user-ch76tcye4vvuu8 5 років тому +9

      Не понял в чем принципиальная разница между фабрикой и фасадом? И там и там создается и возвращается объект указанного типа (вместо класса).

    • @SomeoneInNet
      @SomeoneInNet 5 років тому +1

      @@user-ch76tcye4vvuu8 в данном видео - никакой.Вместо паттерна фасад была реализована фабрика.

    • @ЕвгенийГаврилов-ю9о
      @ЕвгенийГаврилов-ю9о 5 років тому

      Спасибо!!! Очень круто

  • @rostyslav5334
    @rostyslav5334 5 років тому +191

    Господи, СПАСИБО, Владилен!!!!
    Нету такого контента на ютубе!

    • @VladilenMinin
      @VladilenMinin  5 років тому +25

      Я считаю важным свещать более продвинутые, тем не менее базовые темы)

    • @NazarLesyuk
      @NazarLesyuk 5 років тому +9

      @@VladilenMinin верно, продолжайте Владилен, я очень нуждался в объяснении патернов проектирования. Благодарю Вас!

    • @bitmainuser4028
      @bitmainuser4028 5 років тому

      да пздц, жлобы одни.

    • @karodar
      @karodar 5 років тому

      К книге Швец А. "Погружение в паттерны проектирования", отличное дополнение

    • @stanfarshtei1291
      @stanfarshtei1291 4 роки тому

      refactoringDOTguru ----> Тут ВСЁ есть!!!!!!!!!! НО конечно, не так как у Владилена.

  • @demidovmaxim1008
    @demidovmaxim1008 5 років тому +157

    В топ видео. Один из лучших преподавателей на мой сугубо личный взгляд, на просторах рунета. Огромное спасибо.

    • @VladilenMinin
      @VladilenMinin  5 років тому +8

      Благодарю за такой отзыв.
      Дает понимание, что выбранный вектор корректен)

    • @TakemuraGoro
      @TakemuraGoro 3 роки тому +1

      У него куча ошибок, не надо такому следовать.

    • @igorkugaudo8212
      @igorkugaudo8212 3 роки тому

      @@TakemuraGoro например?

    • @TakemuraGoro
      @TakemuraGoro 3 роки тому +3

      @@igorkugaudo8212
      Другая логика. В слушателе, он сделал какой-то узконаправленный код, который не универсальный.
      Ниже ссылка на вики, можно сравнить (внизу es6).
      С синглтоном вообще ужасное объяснение, слышал звон, не знает где он. Синглтон нужен, приминительно к бд (как у него), что бы не создавать лишних подключений. Про это ни слова. И так во всем. Код у него работает, конечно. но шаблоны - это прежде всего понимание задачи которую он решает, грамотное применение для оптимизации, не дублирования и так далее.
      ru.wikipedia.org/wiki/%D0%9D%D0%B0%D0%B1%D0%BB%D1%8E%D0%B4%D0%B0%D1%82%D0%B5%D0%BB%D1%8C_(%D1%88%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD_%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F)

    • @quantum-t
      @quantum-t 3 роки тому

      zabut pro “runet” kak pro strawni son

  • @technical777
    @technical777 3 роки тому

    Паттерны по программированию Constructor, Factory, Prototype, Singleton, Adapter, Decorator, Façade, Flyweight, Proxy, Chain of Responsibility, Command, Iterator, Mediator, Observer, State, Strategy, Template.
    Для меня это взрыв мозга, их нужно выучить или просто знать об их существовании, есть вещи которые просто не укладываются в голове.
    Владилен Спасибо Тебе.

  • @ДмитрийГришанов-ы4е
    @ДмитрийГришанов-ы4е 4 роки тому +11

    Обычно паттерны, это ты смотришь на статью и после нескольких строк кода отпадает желание читать.
    А изучить нужно)
    Здесь настолько очевидные примеры, написаные на es6, что инфа сама влетает в голову.
    Причем все подходы начинают казаться очевидными. Ловишь себя на мысле, что так логично делать.
    Правда, видео смотрел на 1.5 скорости, но это никак не минус)
    Спасибо!

  • @АлексейСурков-ю3н

    Спасибо Владилен за твои титанические труды. Ты крут

  • @romanmelnichenko1365
    @romanmelnichenko1365 4 роки тому +1

    Такой объем информации лучше делить на части. Смотрел два дня ))
    Спасибо за труд!

  • @ПавелЗ-ь3п
    @ПавелЗ-ь3п 5 років тому +7

    Видео от Владилена - это лучшей it контент на youtube! Спасибо!

  • @maximminchenko7633
    @maximminchenko7633 5 років тому +4

    Владилен! Выражающаю огромную признательность за твой труд! Лучший!

  • @davidbaghdasaryan2486
    @davidbaghdasaryan2486 5 років тому +44

    Вы лучший. 💪
    Можно еще про Алгоритмы сортировки

  • @seoonlyRU
    @seoonlyRU 2 роки тому +1

    чотко, спасибо))) с ходу жирный лайк от его величества кодера - СЕООНЛИ

  • @madfish5605
    @madfish5605 5 років тому +1

    ещё не досмотрел видос, не успел. Но материал усваивается и понимается весьма не сложно. Спасибо, на досуге досмотрю до конца обязательно

    • @VladilenMinin
      @VladilenMinin  5 років тому +1

      Обязательно досмотри)

  • @karfagen86
    @karfagen86 5 років тому +5

    Эх, где ты был лет 6 назад, когда я этого ничего не понимал... :(
    Мне на фоне интересно было послушать, спасибо за видео!

    • @VladilenMinin
      @VladilenMinin  5 років тому +3

      6 лет назад активно работал и сам узнавал про все это)

    • @stanfarshtei1291
      @stanfarshtei1291 4 роки тому

      @@VladilenMinin то-есть надо 6 лет что бы стать профи? :)

    • @frizar999
      @frizar999 3 роки тому

      @@stanfarshtei1291 надо практика, а не время. важно сколько ты вкладываешь часов в свое дело, а не лет.

  • @nikolai4100
    @nikolai4100 4 роки тому +1

    СПАСИБО, Владилен!!!! Прям супер как вовремя, все что нужно! Всех благ тебе

  • @igor_cojocaru
    @igor_cojocaru 5 років тому +143

    Понравилось как в твоём IDE автоматом выводит название переданных параметров в функции. Если кому интересно как так сделать в VS Code просто установите расширение JS Parameter Annotations.

    • @thisreal
      @thisreal 5 років тому +13

      если нужно изменить цвет названия этих параметров под вашу тему:
      то просто в settings.json добавьте нужный цвет:
      "workbench.colorCustomizations": {
      "jsannotations.annotationForeground": "#697098"
      },

    • @РоманВоловик-з3д
      @РоманВоловик-з3д 4 роки тому

      Все делает за вас редактор. Не понимаю почему это вам так нравится?

    • @nonbreakingspace
      @nonbreakingspace 4 роки тому +12

      @@РоманВоловик-з3д а тебе больше нравится печатать, чем программировать?

    • @РоманВоловик-з3д
      @РоманВоловик-з3д 4 роки тому +1

      Больше нравится пользоватся нормальным редактором!

    • @nonbreakingspace
      @nonbreakingspace 4 роки тому +14

      @@РоманВоловик-з3д а нормальный это какой? Который не экономит твое время путем автокомплита?

  • @ДмитрийС-ш9б
    @ДмитрийС-ш9б 4 роки тому +6

    Я то думал, что это просто способы решения каких-то задач, а их паттернами назвали?)
    Спасибо, было интересно!

    • @tuen8070
      @tuen8070 3 роки тому

      паттерны - это и есть способы решения каких-то задач.

  • @lllltheollll
    @lllltheollll 5 років тому +2

    спасибо огромное!!!
    давно ждал внятного разбора на эту тему

    • @VladilenMinin
      @VladilenMinin  5 років тому

      Приятного просмотра)

  • @евгенийшевченко-э6ц

    владилен часто в твоих видео встречаю "создаем что-то и оно будет стейтом...", вот хочется как-то по проще что ли, ну и было бы практичнее если бы ты разбирал на более живых примерах, в духе при работе в домом, но опять же на твой вкус и такие голые примеры тоже очень полезны, спасибо за контент)

  • @WebSP-q7e
    @WebSP-q7e 4 роки тому +5

    Спасибо за видео! Будет здорово, если на канале появится видео про утечки памяти, особенно про то, как их отследить)

  • @The14Some1
    @The14Some1 Рік тому +1

    Chain of responsibility, показанный тут, на самом деле является паттерном под названием "Builder". "Chain of responsibility" сам по себе подразумевает, что у нас есть разные классы, совместно выполняющие какую-то сложную задачу, и реализован механизм передачи данных от одного класса к другому по мере обработки данных.

  • @ДмитрийКаширин-о8п
    @ДмитрийКаширин-о8п 5 років тому +2

    Отличные уроки на темы которые давно надо было осветить в таком ключе. Такой контент беспорно очень тяжело готовить и объяснять. Я бы только предложил во время объяснения чего-либо давать чуть больше реальных примеров из жизни, где это можно было бы применить, давай больше кейсов чтоли.
    Такая проблема у всех, кто объясняет JS - часто примеры оторваны от реальности, пока сам 40 раз не напишешь - не поймешь.
    Т.е. я смотрю к примеру про прокси, да это круто и волшебно, но как встроить в текущую работу - не очень понятно. Тоже с паттернами, давно хотел ознакомится с ними подробнее и из видео к сожалению не очень понял, как мне здесь и сейчас использовать некоторые из них. А так все видео - 5 баллов и это лучший контент, что я видел на данную тему. На днях куплю курс по Fullstack разработке. Большое спасибо и успехов!

    • @ДмитрийКаширин-о8п
      @ДмитрийКаширин-о8п 5 років тому

      Было бы отлично увидеть паттерны для библиотек/фреймворков, начиная с Vue.js. Спасибо.

  • @kirillgavrilov9681
    @kirillgavrilov9681 4 роки тому +5

    Как обычно, спасибо за видео)
    Но Chain of responsibility - это явно что-то другое. На мой взгляд, в этом видеоролике просто показан fluent API в классе MySum, основанный на method chaining

  • @egolege
    @egolege 4 роки тому

    Огромное спасибо! Одна из самых основных тем, на мой взгляд.

  • @dan.gorbunov
    @dan.gorbunov 5 років тому +7

    Твоя продуктивность зашкаливает!)) Спасибо

  • @aleksey1965
    @aleksey1965 4 роки тому

    Владлен, у тебя талант! Смотрю только твои ролики, даже курс купил по Node JS)

  • @Дагестанец-ч2х
    @Дагестанец-ч2х 5 років тому +2

    Владилен, ты Бог Javascripta

  • @ЕгорШереметов-л4э
    @ЕгорШереметов-л4э 5 років тому +17

    Это очень круто, но хотелось бы более реальные примеры использования этих паттернов.

    • @dimalukashenko4865
      @dimalukashenko4865 Рік тому

      Никто не знает с чем столкнется в реальности. Все примеры уникальные, по опыту скажу, что далеко не всегда реальный пример может помочь в дальнейшем. Среди проектов куча легаси и костылей. Так что такие примеры как бальзам на душу.

  • @musoverda
    @musoverda 5 років тому

    Вы хорошо стартанули, Владилен. Если не остановитесь - через год Вы будете №1 на площадке UA-cam IT Russian )

  • @developer433
    @developer433 4 роки тому

    Отличное полезное видео, спасибо! (пара ремарок по английскому: vehicle - читается как "Виикл", light - свет, цвет будет color)

  • @olgaibragimova3913
    @olgaibragimova3913 5 років тому

    Видео отличное! То, что нужно, для подготовки к собесу. Удивили комменты в стиле "а где точка с запятой?" "а не говорите нам 'господа'" - вы правда из видео только это смогли подчерпнуть?! а че не спрашиваете 'почему отступ в 2 пробела, а не 4' ?
    Владилен, терпения Вам и не терять мотивацию для создания нового контента.
    Ну, и 1000 лайков на 16000 просмотров - камон, ребята, вам лень нажать на "пальчик"? Будьте щедрее на лайки)))

  • @alllligator
    @alllligator 2 роки тому

    Владилен, это нереально полезный урок для меня. Спасибо огромное!

  • @steel1004
    @steel1004 5 років тому +2

    Очередной годный ролик под конспект. спасибо бро!

  • @StanislavKadyrov
    @StanislavKadyrov 3 роки тому

    Огромное спасибо за видео! Как всегда все четко, понятно и доступно! Удачи и успехов!

  • @hub1347
    @hub1347 3 роки тому

    Эта тема настолько редкая, что заслуживает ЛайкШер даже без просмотра!

  • @johnbaretty9725
    @johnbaretty9725 2 роки тому

    Yo,Vladilen спасибо!

  • @daniilukraine3611
    @daniilukraine3611 5 років тому

    Думал смотреть долго , не буду ... Думал почитаю топ 10 паттернов и дело в шляпе , ну и примерчики посмотрю и все ... НО после первого паттерна я понял что нужно искать тетрадку и записывать все по его словам , потому что этот человек приводит жизненные примеры которые ну очень важны ! Удачи тебе Vladilen !

  • @alexanderzhalyuk8590
    @alexanderzhalyuk8590 3 роки тому

    Прекрасная работа! Спасибо огромное за проделанный труд!

  • @romanwebdev
    @romanwebdev 4 роки тому +1

    Очень вскользь, хотелось бы поподробней, с несколькими примерами. Либо хотя бы больше уточнений, например какие бывают декораторы, что декорировать можно не только класс. Но в целом очень круто, ничего подобного на русском не видел.

  • @alenalel1267
    @alenalel1267 5 років тому +2

    УУу что-то очень годное подъехало, в прочем как обычно :3

  • @viktorzimmermann7813
    @viktorzimmermann7813 5 років тому +2

    кстати было бы прикольно видео (там даже получилась бы серия видосов если многое охватывать) по алгоритмам и так же по юнит тестированию в частности Jest и Enzyme к примеру запилить... Народу понравилось бы точно

    • @VladilenMinin
      @VladilenMinin  5 років тому +2

      Будет такой материал

  • @СергейЛомако-п8о
    @СергейЛомако-п8о 3 роки тому +1

    Во Flyweight еще нужно использовать ограничение кеша до определенного размера, иначе можно сделать memory leak.

  • @OstPVk
    @OstPVk 4 роки тому +1

    Все ок, Единственное, просьба или уменьшить шрифт кода, или в качестве резюме показать весь код

  • @o.voytyn
    @o.voytyn 5 років тому +2

    Спасибо за твои видео, на ютубе много курсов по базовому ЖС а вот по такому продвинотуму намного меньше (если вообще есть), продолжай делать такие видосики) и еще по продвинотому ангуляру (практикум какой то), спасибою

    • @VladilenMinin
      @VladilenMinin  5 років тому

      По ангуляру в ближайшее время будет еще пара материалов)

  • @eydeveloper
    @eydeveloper 5 років тому

    Очень полезно для меня, как раз собирался изучить теорию по паттернам и затем практиковаться с одним проектом. Начал смотреть на другом канале, но проблема в том, что примеры слишком упрощённые и не понятно, где многие шаблоны вообще можно использовать. Спасибо за полезные видео.

    • @ИльяИваник-ф8ф
      @ИльяИваник-ф8ф 4 роки тому +2

      как новичок, могу сказать, что лично мне в данном видео тоже нихера не понятно, как это все может быть использовано в реальности.
      Зачем создавать 3 класса, а потом создавать 4й, который будет разруливать косяки первых трех, если ... можно было изначальн сделать просто 1 нормальный класс?))
      Зачем мутить какую-то дичь с observer, чтобы плюсануть циферку на 1?

  • @АндрейБороздин-ф7ъ
    @АндрейБороздин-ф7ъ 5 років тому +1

    Отличное видео! Такого подробного видео я не видел

  • @РусланАскаров-ч4р
    @РусланАскаров-ч4р 4 роки тому +1

    Спасибо большое за видео.
    Планирую курс по vue у вас приобрести.

  • @ReAgent003
    @ReAgent003 4 роки тому

    Очень крутое видео, часто сюда заглядываю чтобы освежить знания, спасибо!

  • @gazdhikhartumov1159
    @gazdhikhartumov1159 4 роки тому

    Лучшее объяснение паттернов в рунете

  • @Yevhenii_wnd
    @Yevhenii_wnd 4 роки тому +1

    Огромное спасибо за такой плезный контент! ПРОСЬБА: запиши видео по Reflect.

  • @igor_cojocaru
    @igor_cojocaru 5 років тому +1

    Спасибо тебе. Очень нужная информация

  • @vitaliksgaferg6252
    @vitaliksgaferg6252 4 роки тому +15

    Было бы очень интересно посмотреть в каком то реальном мини проекте или в процессе создании очередного велосипеда

  • @АсланКосшанов
    @АсланКосшанов 4 роки тому

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

  • @DanReksar
    @DanReksar 5 років тому +10

    Спасибо) Желаю скорее набрать 10к)

  • @НектоНеизвестный-л5ч
    @НектоНеизвестный-л5ч 5 років тому +1

    Это очень качественное и нужное видео. Спасибо

  • @biovawan
    @biovawan 4 роки тому

    Спасибо за видео!
    В 14_observer можно добавить отписку. Позволит в ручную удалить подписчиков вместе с уничтожаемым классом/компонентой. В результате - чистая память (или без утечек памяти, aka memory leak) без бесхозных подписчиков.

  • @powpowpow666
    @powpowpow666 5 років тому +1

    просто лучший 👍👍👍👍👍👍
    спасибо!)
    желаю обогнать Хауди Хо

  • @yevgenylevin8381
    @yevgenylevin8381 4 роки тому

    Супер контент Владилен ;)

  • @СергійБереза-ъ7с
    @СергійБереза-ъ7с 5 років тому +3

    спасибо за видео!
    14:50 - для чего указывать в 30 строчке ... || MemberFactory.list.simple , если до этого в 29 строчке для параметра type указали значение по умолчанию "simple"?

    • @VladilenMinin
      @VladilenMinin  5 років тому

      Если мы передадим строку, которой нет в фактори, например 'ffefs'. Тогда он не найдет и отдаст по умолчанию

    • @СергійБереза-ъ7с
      @СергійБереза-ъ7с 5 років тому +7

      тогда, получается, в 29 строчке нет необходимости задавать значение type по умолчанию.

  • @ilikecola378
    @ilikecola378 4 роки тому

    Совет всем кому трудно запускать простые скрипты js в консоли. Устанавливаем NodeJs, sublime text 3(размер инсталятора 10мб), ставим плагин для sublime который называется NodeJS(Preferences->Package Control->Package Install вводим NodeJs нажимаем инсталл) для удобного доступа к файлам можно использовать сайдбар(View -> Sidebar -> Show Sidebar) в который можно перетаскивать папки. Далее открываем из этого сайдбара нужный скрипт нажимаем ALT+R текущий файл скрипта запустится в консоли. Всем хорошего кодинга!

  • @wildemax
    @wildemax 3 роки тому +1

    Спасибо за видео, полезноно! Но все же ; лучше ставить в конце команд, меньше ошибок будет! Это как книгу писать без разделительных знаков!

  • @jocoders6560
    @jocoders6560 5 років тому

    Красавелла Владилен! Спасибо огромнейшее)))

  • @scorppetrovich8052
    @scorppetrovich8052 5 років тому

    Круто! Еще бы такой же урок по ООП в js es6 на примерах

    • @VladilenMinin
      @VladilenMinin  5 років тому +1

      Есть ролик на канале

  • @ДеткиеНочники
    @ДеткиеНочники 3 роки тому

    Интересно, спасибо за инфу!

  • @СергейКазанцев-ю7ц

    Здравствуйте Владилен, в Singleton (25:30) относительно - "Database.instance = this", в developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Classes нашел нечто подобное, "Статические (class-side) свойства и свойства прототипа должны быть определены за рамками тела класса: Rectangle.staticWidth = 20;" Но это не то что у Вас. Подскажите пожалуйста, где найти материал на тему, создать поле (свойство) класса использую имя класса, например - Database.instance ? Спасибо.

  • @denisdavydoff7863
    @denisdavydoff7863 5 років тому

    Ну тут жирный лайк, очень хорошая работа!

  • @ratnev
    @ratnev 5 років тому

    ...только не "Вехикл", плиз, а так просто обалденное видео. Спасибо огромное за такой труд!

  • @alexeygumenyuk8510
    @alexeygumenyuk8510 5 років тому

    Я думаю, было бы лучше, если бы ты сделал вместо одного большого видео целый плейлист по шаблонам проэктирования. Во-первых, было бы больше просмотров(суммарно) и удержание было бы выше. Во-вторых, можно было бы больше уделить внимания конкретному паттерну. В-третьих, было бы удобней юзерам, так как не пришлось бы перематывать или спускаться в коменты к тайммапу, чтобы вспомнить или узнать про конкретный паттерн. В-четвёртых, привлеклось бы больше новых сабов. Хотя, в последствии, времени на съёмку ушло бы больше)

  • @mariashamonova6636
    @mariashamonova6636 3 роки тому

    Спасибо за полезные видео!)

  • @alexbuki
    @alexbuki 5 років тому +1

    интересно посмотреть применяемые паттерны с vue js

  • @SlavaCh
    @SlavaCh 5 років тому +3

    О, как и заказывал, благодарствую!)

  • @Snegurjan
    @Snegurjan 4 роки тому +1

    Так нравится ,что Сенсей нас называет "Господа"))))

  • @fortuna184
    @fortuna184 2 роки тому

    спасибо большое за уроки

  • @bohdanartemenko
    @bohdanartemenko 4 роки тому

    В паттерне фабрика вроде же нельзя добавлять новые свойства как свойство "тип". Это вроде как будет похоже на билдер.
    Я не особо разбираюсь но я на такое переписал:
    class SimpleAccess {
    constructor(name) {
    this.name = name;
    this.cost = 50;
    }
    }
    class StandartAccess {
    constructor(name) {
    this.name = name;
    this.cost = 150;
    }
    }
    class PremiumAccess {
    constructor(name) {
    this.name = name;
    this.cost = 300;
    }
    }
    class MemberFactory {
    static #list = {
    'simple': SimpleAccess,
    'standart': StandartAccess,
    'premium': PremiumAccess,
    };
    userNumber = 0;
    create(name = `defaultUser${this.userNumber++}`, type = SimpleAccess) {
    switch (type) {
    case MemberFactory.#list.simple:
    return new SimpleAccess(name);
    case MemberFactory.#list.standart:
    return new StandartAccess(name);
    case MemberFactory.#list.premium:
    return new PremiumAccess(name);
    default:
    console.log('Sorry, we are out of types.');
    }
    }
    }
    const factory = new MemberFactory();
    const members = [
    factory.create('User1', SimpleAccess),
    factory.create('User2', StandartAccess),
    factory.create('User3', PremiumAccess),
    ];

    • @bohdanartemenko
      @bohdanartemenko 4 роки тому

      Прототип это что-то вроде этого:
      Когда мы можем делать кучу независимых копий уже существующего как бы дефолтного обьекта, что-бы потом при надобности просто менять поля его копий.
      class Motorcycle {
      constructor(color, weight) {
      this.color = color;
      this.weight = weight;
      }
      produce() {
      return new Motorcycle(this.color, this.weight);
      }
      }
      const prototypeMotorcycle = new Motorcycle('green', 180);
      const moto1 = prototypeMotorcycle.produce();
      const moto2 = prototypeMotorcycle.produce();
      const moto3 = prototypeMotorcycle.produce();
      _________
      Вот описание:
      The Prototype Pattern creates new objects, but rather than creating non-initialized objects it returns objects that are initialized with values it copied from a prototype - or sample - object. The Prototype pattern is also referred to as the Properties pattern. An example of where the Prototype pattern is useful is the initialization of business objects with values that match the default values in the database. The prototype object holds the default values that are copied over into a newly created business object. Classical languages rarely use the Prototype pattern, but JavaScript being a prototypal language uses this pattern in the construction of new objects and their prototypes.

    • @bohdanartemenko
      @bohdanartemenko 4 роки тому

      Singleton:
      // The first way
      // class Database {
      // constructor(name, password) {
      // this.name = name;
      // this.password = password;
      // if (!Database.instance) {
      // Database.instance = this;
      // }
      // return Database.instance;
      // }
      // getAccess() {
      // return (this.name === 'Valentino Rossi' ?
      // `${this.name} ${this.password}` :
      // 'Sorry you are not admin');
      // }
      // }
      // =============================================================================
      // The second way
      class Database {
      constructor(name, password) {
      this.name = name;
      this.password = password;
      if (Database.instance) {
      return Database.instance;
      }
      Database.instance = this;
      }
      getAccess() {
      return (this.name === 'Valentino Rossi' ?
      `${this.name} ${this.password}` :
      'Sorry you are not admin');
      }
      }
      const db1 = new Database('Valentino Rossi', '987654321');
      const db2 = new Database('John Doe', '1234567890');
      // console.log(db1 === db2);
      // console.log(db1.getAccess());

    • @bohdanartemenko
      @bohdanartemenko 4 роки тому

      Builder:
      class Computer {
      constructor() {
      this.case = 'Full tover';
      this.ram = 'kingston';
      this.psu = 'seasonic',
      this.graphics = 'rx580';
      this.motherboard = 'asrock z390 extreme4';
      this.cpu = 'i7 8700';
      }
      }
      class ComputerBuilder {
      constructor() {
      this.computer = new Computer();
      }
      addCooler(cooler) {
      this.computer.cooler = cooler;
      return this;
      }
      addSsd(ssd) {
      this.computer.ssd = ssd;
      return this;
      }
      updateCase(updatedCase) {
      this.computer.case = updatedCase;
      return this;
      }
      updateRam(updatedRam) {
      this.computer.ram = updatedRam;
      return this;
      }
      updatePsu(updatedPsu) {
      this.computer.psu = updatedPsu;
      return this;
      }
      updateGraphics(updatedGraphics) {
      this.computer.graphics = updatedGraphics;
      return this;
      }
      updateMotherboard(updatedMotherboard) {
      this.computer.motherboard = updatedMotherboard;
      return this;
      }
      updateCpu(updatedCpu) {
      this.computer.cpu = updatedCpu;
      return this;
      }
      build() {
      return this.computer;
      }
      }
      const buildedPc = new ComputerBuilder()
      .addCooler('Noctua nh-d15')
      .addSsd('Samsung 970 evo')
      .updateCpu('Ryzen 9 3950x')
      .updateGraphics('rx 5700xt')
      .updateMotherboard('asrock taichi x570')
      .updateRam('hyperx predator')
      .updatePsu('Seasonic ssr-750px')
      .build();
      // console.log(buildedPc);

    • @bohdanartemenko
      @bohdanartemenko 4 роки тому

      Adapter:
      class EuropeanSocket {
      constructor(voltage) {
      this.voltage = voltage;
      }
      switchOn() {
      if (this.voltage === 220) {
      console.log('💡 220v');
      } else {
      console.log('Voltage is incorrect');
      }
      }
      }
      class AmericanSocket {
      constructor(voltage) {
      this.voltage = voltage;
      }
      switchOn() {
      if (this.voltage === 110) {
      console.log('💡 110v');
      } else {
      console.log('Voltage is incorrect');
      }
      }
      }
      class SocketAdapter {
      constructor(socket) { // americanWrong object
      this.socket = socket;
      }
      switchOn() {
      switch (this.socket.voltage) {
      case 110:
      this.socket.voltage = 220;
      this.socket.switchOn();
      break;
      case 220:
      this.socket.voltage = 110;
      this.socket.switchOn();
      break;
      default:
      console.log('Wrong voltage');
      }
      }
      }
      const euroWrong = new EuropeanSocket(110);
      euroWrong.switchOn();
      const euroOk = new EuropeanSocket(220);
      euroOk.switchOn();
      const americanWrong = new AmericanSocket(220);
      americanWrong.switchOn();
      const americanOk = new AmericanSocket(110);
      americanOk.switchOn();
      const adapter = new SocketAdapter(americanWrong); // americanWrong that doesn't work without adapter
      adapter.switchOn();

  • @Shkur777
    @Shkur777 4 роки тому +2

    1:24:00 правильно произносить - Айгор :)
    На ускоренной не правильно можно услышать :)

  • @fairplay6113
    @fairplay6113 5 років тому

    материал просто супер, на вес золота, спасибо за работу! по BDD видео не планируется? на ютубе совсем по этой теме ничего нет, да и в рунете тоже.

  • @viktopxio3739
    @viktopxio3739 5 років тому +1

    ТОП КОНТЕНТ!!! Благодарю!

  • @havefunnoob
    @havefunnoob 2 роки тому

    15:20, 30 строка. Зачем нужен || MemberFactory.list.simple, если в параметрах и так передаётся этот тип по умолчанию?

  • @ressbill
    @ressbill 4 роки тому +1

    Как всегда Топ. НО. В Фасаде разве мы можем получить доступ к массиву, который заполняем через метод add?

  • @РусланСмирнов-м5э
    @РусланСмирнов-м5э 5 років тому

    Отлично, доступно и интересно. Хотелось бы услышать Ваше экспертное мнение по поводу PWA-приложений. Их роль, перспективы ну и по возможности примерчик. Спасибо.

    • @VladilenMinin
      @VladilenMinin  5 років тому

      Тему PWA буду отдельно освещать. Они сыроваты еще для полноценного использования из-за разных платформ и бразуеров

  • @strikerorion5290
    @strikerorion5290 3 роки тому

    Хорошее толкование.

  • @РусланМирзеагаев
    @РусланМирзеагаев 4 роки тому

    Владилен, спасибо за видео!
    Интересно было бы про паттерны в React и Express (если таковые есть)

  • @NotTheLastOne
    @NotTheLastOne 3 роки тому

    26:40 чем отличается Database от this ? почему ты используешь название класса внутри конструктора вместо this ?

  • @yabnku
    @yabnku 5 років тому

    спасибо за твои видео, они достаточно лаконичны и информативны, чтобы поддерживать себя в информационном тонусе.
    но, хочу обратить твое внимание на небольшой косяк -- ты часто используешь слова "допустим" и "например" не к месту, что сбивает с толку, поскольку после них подразумевается однозначное действие.

    • @VladilenMinin
      @VladilenMinin  5 років тому

      Согласен, благодарю за отзыв

  • @petrpozhoga2409
    @petrpozhoga2409 5 років тому

    Добрый день, а почему на 43:14 вы создаете метод (reply) заглушку, может лучше в методе add обернуть вызов метода reply в конструкцию try/catch ?

  • @CorleoneMikele
    @CorleoneMikele 5 років тому +1

    Спасибо, круто, супер, продолжай в то же духе. 👍

  • @maksimmaliauka3026
    @maksimmaliauka3026 3 роки тому

    Круто) Очередной лайк.

  • @Denis_Zh
    @Denis_Zh 4 роки тому +1

    на тайминге 14:44 вообще какой - то странный подход...тогда зачем параметр по умолчанию принимать в create ??

    • @ВладимирТайдонов-я6л
      @ВладимирТайдонов-я6л 4 роки тому

      Тоже не понял)

    • @ВладимирТайдонов-я6л
      @ВладимирТайдонов-я6л 4 роки тому

      А, вон там ниже чувак правильно написал. Типа можно тип передать что попало (например, "bruh"), и тогда надо фолбек как раз делать

    • @Denis_Zh
      @Denis_Zh 4 роки тому

      ​@@ВладимирТайдонов-я6л Хмм...ок

  • @editxvc
    @editxvc 5 років тому

    то что мне так не хватало, спасибо

  • @shilza8336
    @shilza8336 2 роки тому

    Спасибо! Отличное видео

  • @vana__f7570
    @vana__f7570 3 роки тому +1

    получается, что HOC из реакта это декоратор

  • @PlayMrGolem
    @PlayMrGolem 2 роки тому

    В шаблоне проектирования Адаптер не будет ли проще сделать NewCalc extends OldCalc, или это простой пример, и в реальности этого не применить?

  • @alexleshenko
    @alexleshenko 4 роки тому +1

    А тайп (type=“simple”) же есть по умолчанию, он если ничего не придёт и создаст simple инстанс и || избыточен)?

    • @kvaqich
      @kvaqich 4 роки тому

      А если придёт запрос на, к примеру, «advanced» подписку?

    • @ЭйЭй-ы1и
      @ЭйЭй-ы1и 3 роки тому

      @@kvaqich а если придет "абракадабра",?))) сначала нужно реализовать подписку, а потом ее юзать, Владилен просто не заметил видимо. (Поясняю, если подписка advanced то она будет simple, так почему сразу не поставить simple, а если нам нужна именно advanced подписка - мы ее реализуем, и тогда запись с примером || 'simple' опять не нужен). Как-то так))

  • @kirillgavrilov9681
    @kirillgavrilov9681 4 роки тому

    1:49:40 то чувство, когда backquote рядом с буквой Z 😭. Как всегда, полезное видео. Спасибо!

  • @doomymax577
    @doomymax577 5 років тому +1

    Спасибо тебе Владилен

  • @mishagarkach
    @mishagarkach 4 роки тому

    Взрыв мозга, особенно медиатор поразил :)

  • @webwork9804
    @webwork9804 4 роки тому +1

    Очень интересное видео! Спасибо! А composite pattern будет рассмотрен?

    • @driverwolf5972
      @driverwolf5972 3 роки тому

      Bridge, тоже интересно посмотреть

  • @ОксанаГаращенко-д5р

    попыталась в codesandbox воспроизвести пример с фабрикой, static list = {...} выдает ошибку - Support for the experimental syntax 'classProperties' isn't currently enabled.

  • @oinn6216
    @oinn6216 4 роки тому

    Спасибо за примеры.

  • @OpalGooDog
    @OpalGooDog 4 роки тому

    очень здорово!!!!Однозначно лайк и подписка!