Что такое декораторы в JavaScript
HTML-код
- Опубликовано: 17 май 2017
- Премиум уроки по созданию сайта:
webformyself.com/category/pre...
JavaScript очень гибкий язык и он позволяет пользоваться такими вещами, как декораторы. В данном уроке мы разберем, что это такое, зачем декораторы нужны и как ими пользоваться
Из урока вы узнаете, что такое декораторы в javascript, зачем они нужны и как создавать декораторы, используя чистый javascript.
Что такое декораторы в JavaScript - • Что такое декораторы в...
![Eminem - Houdini [Official Music Video]](http://i.ytimg.com/vi/22tVWwmTie8/mqdefault.jpg)
![DRAGON BALL: Sparking! ZERO - Fused Warriors Trailer [BUDOKAI TENKAICHI Series]](http://i.ytimg.com/vi/84p4Lvyfyes/mqdefault.jpg)
Поддерживаю комментарии ниже. По Learn.js тему не понял, как и задачи, которые там приведены. Считаю, что они перегибают с ними, учитывая, что некоторые изучают программирование впервые.
Но, благодаря автору данного видео в голове все прояснилось.
Огромное спасибо, лайк && подписка!)
Аналогично!
Плюсую
+++++
На learn.js примеры не всегда полностью раскрывают тему, а задачи наоборот дают иногда углублённые
Но кстати плюс небольшой, благодаря тому что не разъяснили полностью тему я ее изучил помимо лернjs на других источниках и познал лучше
Только после этого видео начал разбираться в декораторах. Кантора читал полдня, понять не мог.
вот у меня как раз пол дня прошло. гляну этот видос
Большое спасибо, наконец освоила тему после просмотра. Совет новичкам- обязательно пишите и тестируйте код во время просмотра, так проще запоминается.
По поводу времени, это оптимизация на уровне интерпретатора Chrome(V8), после первого вызова функции он не формирует заново стэк вызова, так как работа идет внутри одного скрипта в той же сессии.
Это Владилен=)))!
Я тоже сразу обратил внимание, искал долго эту тему у его и пришлось смотреть это.... а потом обрпдовался, т.к. он хооошо обьясняет
Владилен и тут тоже)
Хороший материал. Сначала я разбирал декораторы на лерн.жс, материал там сложнее подан, но подробнее. Тут понятнее и нагляднее.
Автор, спасибо тебе большое !!!
Спасибо! Было интересно!
спасибо! очень познавательно и доступно
Отличное видео, спасибо!
Благодарю за видео! Декораторы освоены
Спасибо, помог разобраться :-)
Spasibo drushiwe
Здравствуйте . А чем декоратор отличается от HOC ( компонент высшего порядка ) ?
Здравствуйте! А почему за один вызов fac() в консоль выводится результат действия двух функций? Разве на 23 строчке не должно было переопределение быть?
Разобрались с этим?
@@klubkov У меня такой же вопрос. И еще почему callCount в консоли идет раньше logResult'а?
@@TheTiznone Потому что сначала выполняется ф-я callCountDecorator, которая выводит в консоль кол-во вызовов, далее в ней же идёт вызов return func.apply(this, arguments); , что приводит к вызову logResultDecorator , который выводит результат в консоль самой первой функции fac.
Вот и получается, что сначала идёт вызов callCountDecorator далее=> logResultDecorator далее=> fac.
Эти оба декоратора как бы "оборачивают" самую первую функцию fac.
@@vosroix Меня смущало, что они обернуты как fac=>logResult=>callCount=>TimeDecorator, а выводятся в другом порядке. Но я разобрался, дело было в том, как внутри декораторов консоль логи стоят относительно func.apply, до/после. И, видимо, каждый последующий декоратор оборачивается поверх предыдущего, а не "переоборачивает" исходную функцию, что было бы важным уточнением для тупиц, типа меня
Спасибо
Почему сначала выводится результат функции callCountDecorator?
Вооо, тут теперь более-менее понятно стало. В учебнике читал, дак почти ни***я не понял,но задачи решить вроде смог, не знаю, то ли опираясь на примеры решил, то ли таки что-то понял.
Привет. Мы с тобой по одному учебнику учимся. ))) Я твои про обертки читал там, да и в других темах.
@@user-gf5tx3eg8o, дак это хорошо, что еще могу сказать. И как успехи, освоил тему сразу же? Я дак тупенький, из учебника только со второго раза начал понимать что-то более-менее, и то не все и сразу.
@@user-rj6ro3mp1p Я освоил только после просмотра этого видео. Потому что в учебнике я как-то тоже не с первого раза понимаю тему. Приходится муштровать её день-два. Зато помогает. ))) В нескольких источниках хорошо смотреть.
А ты не думай, что ты тупенький. У нас есть цель, мы учим. И тупенькими будут те кому в этой жизни ничего не надо. )))
@@user-gf5tx3eg8o, наверно твоя правда, по крайней мере будем на то надеяться😂
@@user-rj6ro3mp1p Москва не сразу строилась!🙋💪😁 Будем учить.
Извините, не понял почему именно в этом примере нельзя просто закинуть ...arg (то есть оператор расширения)?? На 8:50
видео от 2017 года, если не раньше... получить все аргументы функции можно было только с помощью псевдомассива arguments.
Много интересного взял с этого видео. Это для тестировки как я понимаю фича.
Не обязательно, зачастую можно увидеть декораторы во фреймворках. Например для расширения функционала базового класса чтобы получить частные случаи
Об этом чуть позже будут уроки
Почему fib(30) по времени больше fib(31). Мы сами кэшируем fib(30). В итоге fib(31) одна операция сложения, а именно сумма закэшированых результатов fib(30) и fib(29). Попробуйте убрать кэширование и будет правильное время выполнение. Возможно, не проверял.
Скажите, зачем this передавать в первом примере? Если там пустой контекст все равно. Корректно ли передать просто пустую строку?
строку func.apply( this, argument) можно прочитать так: эй apply возьми функцию func и вызови её как метод обекта this, а в параметры функции func подставь arguments, а т.к как this в данном случае равен window то функция func будет вызвана как метод обекта window, т.е func() или тоо же самое, что и window.func(). A теперь подставь вместо this пустую строку и прочита мое сообщение сначала, только вместо this и window подставь пустую строку )))))))))
@@kto-towse9378 Но ведь работает же и с пустой строкой.
@@kto-towse9378 - вы не до конца понимаете что такое контекст в javascript.
@@_renamed_ - в данном случае да, не имеет значения. Но если в будущем оригинальная функция факториала/фибоначи будет переписана так, что контекст будет как-то использоваться, то переписывать декораторы не придётся.
Наверно стоит упомянуть, что решение фиббоначи через рекурсию - это плохое решение задачи. Есть намного более оптимальный способ
А по теме видео, спасибо, в голове что-то проясняется
голос похож на Владилена Минина
@@webformyself а какой смысл ему было работать с вами? Почему он изначально не создал канал на котором выпускал бы подобные видео
можно было лог декоратор перенести ниже лога кеша и тогда все заработало бы
Т.к. браузер оптимизирует функцию, поэтому время выполнения меньше при последующих вызовах
А чем тогда декоратор отличатся от замыкания?
Шашенков Алексей декоратор это функция обёртка, замыкание это возможность языка, то есть инструмент для реализации
Замыкание - это функция вместе со всеми внешними переменными, которые ей доступны.
При выполнении функций действуют области видимости переменных, которые имелись на момент их определения, а не на момент вызова.
Здравствуйте! Вы снимали видео про парсинг сайтов с помощью php библиотеки phpQuery. Могли бы вы снять такой же урок только рассказать в нем как парсить содержание публикации. Помогите пожалуйста для меня это очень важно.
А её зачем перезаписывать не лучше в новую переменную???
performance.now is not a function
Stack:
не является функцией
стек:
Вот это у меня вывело ((((,что делать?
у меня тоже, нагуглил очень быстро
Владилен, ты ли это?
Не понял, зачем вызывать с через apply если контекст будет все равно один и тот же и тем более в функциях нет не одной переменной к которой можно было обратиться из контекста? В чем разница мы ведь не с объектами работаем?
Здесь apply вызывается не ради того, чтобы задать контекст, а для того, чтобы иметь возможность передать функции в качестве аргумента массив.
Apply принимает массив с какими-либо аргументами, грубо говоря, "достает" эти аргументы и передает их в функцию, у которой он был вызван (в данном случае у функции func).
Например:
func.apply(this, [1]) - в функцию func будет передан один аргумент "1"(равносильно func(1));
func.apply(this, [1, 2]) - в функцию func будут переданы аргументы "1" и "2"(равносильно func(1, 2));
функция тоже обект
БОльщую часть ролика время тратится на решение проблем функционала декораторов, а не на объяснение самих декораторов.
Да что же это такое!
Почему все эти декораторы называют по-разному? То - Обертки, то - Wrappers, то Функции- Обертки, то Декораторы.
Не путайте новичков!
А урок хороший :)
Спасибо!
Было бы странно, что человек интересуется паттернами js, не зная того, что такое факториал