36. Уроки, Курс React JS - про ООП поверхностно (зачем нам объекты)

Подписаться 182 тыс.

Просмотров 97 тыс.

50% 1

🚀Стань квалифицированным разработчиком за 9+ месяцев с трудоустройством в IT -INCUBATOR:
Front-end
it-incubator.io/front-end/?ut...
Back-end
it-incubator.io/back-end/?utm...
Поддержать меня можно на patreon / itkamasutra или оформив спонсорство на данном канале.
Помогайте друг другу вот здесь: t.me/reactjs_samurai
React JS - это про функциональное программирование! ООП и функциональное программирование - две разные парадигмы!!!
Тем не менее нет сегодня ничего точно-определённого)) React - он и про ООП и про ФП! Базовым (самым базовым) принципам ООП я вам в этом выпуске и поведаю, для того, чтобы мы перешли к реализации store - точной копии store из библиотеки Redux. Да, мы будем изобретать велосипед, для того, чтобы понять, что там сидит внутри Redux и как он работает!!! Самураи, фшух-фшух!
Файл: codepen.io/dimych-the-scripte...
it-ликбез и з тачилы, про ООП: • #6 ООП (it ликбез из т...
Весь цикл: • #1 Client (front-end) ...
Ещё про ООП: • Переход на ООП, пример...
Уроки по React JS: • Курс "React JS - путь ...
* Сайты:
it-kamasutra.com
it-incubator.eu
samuraijs.com
* Мы в соц. сетях:
itkamasutra
/ itkamasutra
telegram.me/itkamasutra
* Мои личные VK и Insta:
d.kuzyuberdin
/ it.kamasutra.dimych
#reactJS #практика #примеры #уроки #курс #ооп

Опубликовано:

8 фев 2019

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 723

@blok841 3 года назад

если Димыч начал прощаться, значит мы дошли до середины урока)))

@StarkElessar 2 года назад

Класс, тоже это заметил 🤣

@tevi6667 Год назад

ору🤣

@abkeyev.a.w Год назад

ахахахах

@user-wt8sq9om6c Год назад

😂😂😂

@user-ke5fn6sm8u Год назад

хахахаха

@georgebagiryan1716 3 года назад

попытка обратиться к приватным полям в Java: "вы кто такие? идите нахер!" попытка обратиться к приватным полям в JS: "ну не надо пожалуйста, вот тут черточка не видишь?"

@alekseyp.3766 3 года назад

В новых редакциях JS теперь тоже посылает, теперь там появились приватные поля,начинаются c #, например #content

@alekseyp.3766 3 года назад

@@dim3143 Не подскажу. Где-то встретил случайно именно про приватные поля. Да это es2020

@dimeliora 3 года назад

@@alekseyp.3766 только в этом уроке рассматривались защищенные (protected) поля, для них, увы, реализации на уровне языка пока нет)

@olenalevenets8117 3 года назад

@@dim3143 вот здесь описано про это, но как я понимаю это пока еще не работает... learn.javascript.ru/private-protected-properties-methods

@piligr1m_ua_ 3 года назад

@@dim3143 2021

@user-eu9pg1wq3c 7 месяцев назад

23.10.2023 прохожу 36 урок, начала проходить курс 14.10.2023. Пока все прекрасно, каждый урок я конспектирую. В 100 выпуске напишу что да как, возможно уже буду проходить собеседования. Желаю каждому кто смотрит этот курс удачи и сил

@elenakhilalova 7 месяцев назад

Если что данный комментарий - мой, я сменила свой аккаунт на ютуб

@user-hq4zq9gd3v 7 месяцев назад

Привет! Я тоже добрался до 36-го урока. Тоже хотел бы дойти до сотого. Думал что за давностью комменты здесь уже не актуальны.

@elenakhilalova 7 месяцев назад

@@user-hq4zq9gd3v Ура, мы вместе из 2023 года смотрим этот прекрасный курс, желаю тебе дойти до 100 урока, со всеми знаниями этого курса, главное старайся конспектировать материал и записывай все определения )

@helga1907 6 месяцев назад

Удачи нам, новеньким на этом курсе. Надеюсь, что все у нас получится

@user-lc7to1yb3m 6 месяцев назад

Мы все справимся ;)@@helga1907

@Stiletto78 4 года назад

"...блин, тут Дмитрий написано... жестко" )))))))

@user-vl9te1cg3r 3 года назад

тоже поржал ))

@AnotherNiceNickName 3 года назад

Улыбнуло:)

@bonemark 2 месяца назад

3:10 ага 😅

@SerhiiD11010 3 года назад

после отметки 30 в плейлисте уроков я понял что чем больше ты думаешь что понимаешь, тем меньше ты понимаешь, ну вы поняли, да?

@romaniv1437 2 года назад

ну у меня почти так же, понимание приходить когда начинаешь писать код

@user-ml5vp6rp9n 4 года назад

Забавно, что "Кабзда как просто" теперь не кабзда как просто :-D

@sulmom78 4 года назад

кабзда как сложно

@lopsonbalzhinimaev642 4 года назад

Без какого то бэкграунда довольно сложно) Мне повезло я приступил к этому курсы уже имея знания по Javascript + C++

@user-jf2ic3up1k 4 года назад

А у меня на проекте mobx будет, а я привык к концепции уроков Димыча через redux)

@user-ml5vp6rp9n 4 года назад

@@user-jf2ic3up1k зато не заржавеет мозг. Если всегда мыслить одинаково, будешь как бревно, а здесь нужен гибкий ум. Поэтому радуйся, что научишься чему-то новому👍

@user-jf2ic3up1k 4 года назад

@@user-ml5vp6rp9n Согласен, всегда рад учить новое) Просто меня посадили на реактовский проект которые не с нуля неделю назад, до этого верстальщиком был вообще)) Чистые функции все-равно попонятней и debugger я полюбил, с mobx хрен поймешь потом что где творится через год)

@user-wj3rv9gj2v 3 года назад

"Тебе кажется, что ты просто присваиваешь значение, но там кроется целый мир"

@anonim-7934 3 года назад

Димыч: инкапсуляция - это *сокрытие* деталей ExtremeCode: покинул чат...

@ITKAMASUTRA 3 года назад

Понимаю о чем ты)) Но все хорошо: любая тема должна начинать раскрываться с касания, и уже потом с погружения))

@user-ld1gz1cr1j 3 года назад

АХхахах, да-да-да, тоже думал об этом.. Это жоска

@promotezor 3 года назад

Можете чуть подробнее, пожалуйста, или названия, куда копнуть

@geogoshan 3 года назад

Я здесь за этим комментом

@sergeyinozemcev1070 2 года назад

@@promotezor Инкапсуляция != сокрытие внутренней работы. В питоне нет возможности скрыть методы, однако инкапсуляция в нем есть. Обобщенно ООП и есть инкапсуляция. То есть сама возможность обобщить функции и переменные и сделать их как поля и методы какого-то объекта и есть инкапсуляция функций в методы объекта.

@vladdd2164 Год назад

2023 в ООП для приватных свойств используется #решетка, а не подчеркивание, и она ограничивает доступ извне, только через геттеры сеттеры

@maxpro7135 Месяц назад

Как же хорошо понимать ООП, не зря в университете учился )))

@anahitbabelyan1415 5 лет назад

прошу снимайте новое видео урок про observable, observer, action, component c примерами...... вы очень хорошо объясните!!!

@user-oq6ku8zf4q 2 месяца назад

Спасибо Димыч! Очень круто и понятно объясняешь. Учусь в Инкубаторе в среде, это просто находка. Спасибо что создал такую ОФИГЕНСКУЮ команду и платформу. Обучаясь в Инкубаторе, имея доступ ко всем предоставляемым ресурсам, точно можно сказать(словами одного известного в Инкубаторе человека)) ) - "Ещё не родился тот человек, который не смог бы стать программистом"!

@kaarabasbarabas 5 лет назад

с каждым видосам, судям по лайкам - нас все меньше и меньше!( но димыч крут в любых ситуациях!

@ITKAMASUTRA 5 лет назад

Простые вещи заходят легче! Дальше люди сливаться будут! Хотя очень буду стараться не гнать и режим разжеванности никуда не девать!!!!

@andreyvolkov3117 4 года назад

Просто в курсе про JS уже было про ООП (основы)

@vityaost 2 года назад

3:10 его могли назвать girl... Блин, тут Дмитрий написано, жеска)) Димыч, ты лучший!! Не устану повторять! Устроюсь на работу, кончится война - прилечу в Грузию - пожму руку)

@user-li8hl1vr1x 5 лет назад

Отличное видео. Про this, если кому не понятно, я долго не понимал как им пользоваться, но я сформулировал определение, которая мне помогло понять как это работает - Так вот this нужен для того, например у вас есть функция(действие), которая используется разными объектами и вы пишите внутри нее this.свойство_или_еще_что-то, так вот это действие будет сделано для того объекта в контексте которого вы вызвали этот this, ну как-то так. Например внутри конструктора очень часто пишут this.name = name, this.age = age и соответственно в аргументы приходит имя и возраст - constructor(name, age){...}; и потом у вас есть много объектов с пользователями и им в скобках(аргументах) вы передаете(пишите) имя и возраст например user.('Vasya', 23); все это дело попадает в конструктор и слово this будет иметь ссылку на объект user, т.к. this будет находится в контексте этого объекта, и добавит ему свойства, которые передали и так будет со всеми user1 или user2 и т.д., а конструктор 1. По этому внутри объекта тоже пишут this и оно имеет ссылку на этот объект, т.к. находится в его контексте, , может кому-то поможет.

@TheZionjke 4 года назад

а если еще проще, то this это всегда то что перед точкой :)

@PACEMAKER76 Год назад

this это указатель на контекст. он говорит, что вот эта хрень, на которую указывает this имеет отношение только к этому объекту , а не к какому-то другому)

@user-li8hl1vr1x Год назад

@@PACEMAKER76 Круто, что кто-то пишет коменты под старые видосы. На самом деле про this можно говорить 2 часа и на собесе 90% людей отвечают на этот вопрос не правильно, особенно если задать доп. вопросы: что такое контекст, откуда он берется, в чем разница scopeб контекста и лексического окружения и т.д. Дальше можно спросить сколько видов контекста бывает и т.д.

@nataliusta9785 Год назад

Ликбез из тачилы про ООП обязателен к просмотру! Это шедевр😁 Спасибо,Димыч!!!

@user-mq7nd5pq9q Год назад

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

@maksimlapin2031 5 лет назад

Бомби дальше, пожалуйста, мне помогают твои уроки, спасибо тебе большое!

@stanislavk.6066 4 года назад

ты все понимаешь???

@moonscript6153 Год назад

как успехи??

@thedzonip1ay531 2 года назад

Самое легкое объяснение ОПП, Димыч ты крут!

@olexandrpoberezhniak1283 Год назад

какую же эйфорию ловишь когда сделал дз, и оно работает

@sha_lapai7230 Год назад

+++

@sergeyistominov5880 2 года назад

Поддержу автора плюсиком для лучшего ранжирования =)

@is_eliseeva Год назад

Дмитрий, поражаюсь, какой Вы умный и как умеете хорошо объяснять! это третье видео от разных предподавателей, в котором рассказывается про ООП. очень понятно и доступно! спасибо!

@kickmastery8888 Год назад

А первые два которые?

@ClaymoreTV047 Год назад

(Дмитрий, поражаюсь, какой Вы умный и как умеете хорошо объяснять! это третье видео от разных предподавателей, в котором рассказывается про ООП. очень понятно и доступно! спасибо! ) ----- ты кто такой о_О ... я понял процентов 10% с третьего просмотра....лан будем копать спасиб Димыч)

@some_name 5 лет назад

Классный стиль преподавания! Спасибо за видосы 👍

@ITKAMASUTRA 5 лет назад

Пожалуйста, Юра!

@meadchen5243 3 года назад

Хорошо запомнила момент, как муж-программер долго бился на какой-то задачей и потом выдал "Ни*** себе, работает". После урока и после того как получилось переписать state на store была примерно такая же реакция.) Пошла смотреть след.урок, почему же оно работает)

@Stas1983ful 3 года назад

Первый человек, который на русском объяснил, для чего слово this !!! :)

@olexandrkozirskiy6917 Год назад

Просто крутяк урок! Дійсно корисний контент. 25,02,2023

@3PuY 5 лет назад

Пошёл наводить порядок в коде)

@user-tf6jz7hj9d 3 года назад

Классно, ооп - это очень интересно! Попробовал реализовать store сам. В общем, получилось довольно гладко, быстро и всё заработало... пока дело не дошло до функционала - добавления постов и печати в textarea - там всё порушилось. Я debugger'ом отсмотрел функции и понял, что this в функциях стал ссылаться на объект profilePage, вместо store. Долго соображал как пофиксить и вспомнил, что мы что то подобное реализовывали в курсе "js ну вообще с нуля", когда делали slider. Ввёл в store переменную that и при инициализации state = { getState( ) } прописал this.that = this внутри getState, прокинул через props'ы в MyPosts и передал в функции обновления textarea и добавления постов that в качестве атрибута. Вот такую круговерть придумать пришлось, мозг поломать :))) Теперь мне прям очень интересно посмотреть следующий выпуск и понять как это было сделать намного проще... )) Пойду смотреть...

@user-tf6jz7hj9d 3 года назад

@@Catofood Да :) В итоге под чутким руководством Димыча всё оказалось гораздо проще! Но покумекать своим котелком тоже было полезно :))

@is_eliseeva 9 месяцев назад

03.09.2023 день 27. спасибо за урок! #ООП

@UnwarO 3 года назад

Таааак, вроде врубился, ндеюсь уже на скорую остановочку повторение для закрепления!) Best of the best, летим дальше!)

@user-ng7dd7fm6f 5 лет назад

Димон ты прям радуешь))

@user-wq1lz5ut5c 4 года назад

Всё супер! понимание постепенно приходит. Двигаемся дальше!!!

@antongorbenko3346 2 года назад

"реакт редакс знать будешь крууто-о-о-о айти ка айти ка камасутра-а-а, всем привет меня зовут Димыч и это мой авторский курс реакт жс путь самурая *вших* *вжих* *вжух*"Эх Димыч Димыч, мне 15 лет , второй раз прохожу твой курс(в первый раз на +- 70 забросил и ушел пробовать С# , надоело компоненты клепать). Но в этот раз нстроен серьёзно , уроки летять реактивно . Спасибо тебе, курс супер. P.S Это приветствие я на всю жизнь запомню 😁

@dariaminakova5220 4 года назад

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

@vladim1 4 года назад

Спасибо, как всегда включился свет. Летим!

@user-zk5ok6wn2l 5 лет назад

Круто. Все шикарно. Хотел бы ещё больше узнать об ооп

@user-tp4fn2dl9w 4 года назад

Талантище! Спасибо большое за уроки! 🔥

@user-nj6rg8we9u 3 года назад

На данном этапе уже начинаешь видосы более тщательно смотреть, чтобы мозг понял что все "кабзда как просто". Это круто. Спасибо, Дима. Всем, кто страдает на этом видео посмотрите что такое сеттеры и геттеры, посмотрите it-из тачки про ООП, и пересмотрите данное видео. Все встанет на свои места.

@demka9796 3 года назад

С каждым днем , проходя все новые уроки, понимаю насколько я мало знаю ) Но как же круто узнавать столько нового! Спасибо тебе огромное!

@user-iw5pq9lt4f 5 лет назад

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

@dr4kess 10 месяцев назад

-его могли назвать girl -блин тут Дмитрий написано... жёстко

@is_eliseeva 9 месяцев назад

очень смешной момент!

@user-sj4oy1el5y 3 года назад

Часа 2 прокидывал пропсы из stor'a. Димыч ты крейзи ) скукожил меня этим заданием ). Лойс, как обычно )))

@narinemkrtchyan1087 4 года назад

Спасибо за интересные и идеальные уроки!!!

@spacerider9426 3 года назад

Спасибо за твой труд! Смотрю дальше!

@alexanderbratskov9281 4 года назад

Много узнал того, что уже знал, только с понятной стороны, супер!! спасибо!!!))

@angelikakozlova6056 3 года назад

супер мега интересно) спасибо большое) двигаемся дальше)

@ruslankomlykov9207 4 года назад

Фух, подзапустил я что то обучение)) Но ничего, буду наверстывать, лайчинский и респект, как всегда!! )) Спасибо

@BorderInVais 4 года назад

Супер. Голова просто взрывается от всяких идей:)

@e.p_yan 4 года назад

очень хорошо объясните Дмитрий. спасибо за ваш труд!!!

@dendenowich4199 Год назад

Спасибо за урок)) 16.07.22. Плывем дальше!

@volodya_kod6 Год назад

Спасибо, очень интересно, летим дальше

@user-np9mq5xc7j 2 года назад

Спасибо. Идем дальше!

@frost1437 3 года назад

Спасибо за труд. Все очень доходчиво, лучший!

@Snegurjan 3 года назад

Спасибо за лучшие уроки по React Redux

@darjat.1069 4 года назад

Спасибо огромное, наконец-то идеальное объяснение. Поняла, что ничего не понимала, хотя казалось, что всё понятно. Но теперь стало действительно понятно.))

@denvanrain8793 3 года назад

Спасибо тебе огромное, Друг!!! Очень интересное видео получилось о ООП!

@horror981 Месяц назад

После полного изучения C# в ООП. Объяснение про this выглядит забавным и про private поля. Надо было просто сказать есть паблик и прайвет поля. Но в объектах паблик полей быть не должно и любые обращения через гетер и сетер. Просто надо было отдельно про паблик и прайвет\ отдельно про гетер и сетер\ отдельно про this. было бы попонятней для тех кто в ООП не силён, а вообще нужно с классов объяснять тогда сразу смысл появиться так как в клас то передать не чего нельзя, можно только в объект класса, по этому и поля в классак только приватные=)

@evgeniy7603 4 года назад

С ООП все понятно. Доступно объясняешь. Продолжай дальше 💪👍

@GrourDenis 2 года назад

Спасибо за ликбез по ООП!

@MikhailKuklenkov 11 месяцев назад

Урок однозначно полезен, Дима)

@user-pz6kr7px3i 2 года назад

Спасибо большое за курс) Учу React с удовольствием)

@ctumyji9737 4 года назад

Круто! Спасибо, пойду на практике оттачивать :)

@Evgeny.. 3 года назад

С ООП знаком, все было понятно! Спасибо!

@semial 3 года назад

Спасибо за урок))) Помучался немного и получилось)))

@varvarashcherbyna2632 4 года назад

спасибо большое за такое доходчивое объяснение .) большой тебе респект )

@noiseless6800 4 года назад

С ООП сталкивался когда C# учил, не знаю зачем он мне был нужен просто так сложилось. К подходу ООП отношусь как к стандартному, для больших проектов считаю незаменим, хотя большие проекты и не делал никогда. Хорошо понял _variable, так как в шарпе есть модификатор private. Геттеры, сеттеры тоже на ура зашли т.к знаком. Курс отличный, главное до конца дойти. На собесе, дали тестовое задание на React, пока что понимаю что только часть смогу реализовать. Что в бошке творится, как просил)))

@ITKAMASUTRA 4 года назад

Супер, что есть ДРУГАЯ база! Круто сравнивать!!!👍

@ArtLokos 5 лет назад

Много перебрал книжек по программированию, видеоуроков, курсов и интерактива, но только после просмотра этого видоса НАКОНЕЦ-ТО до меня дошло что такое THIS и как его правильно использовать : - ))))

@linuxlifepage 4 года назад

Привет! Как успехи?

@user-vl9te1cg3r 3 года назад

Только что оставил такой же комментарий))

@user-wj6ue7nt5g 2 года назад

Немножко вздохнул прям) а то прошлые видосы вынос мозга) Спасибо за уроки! Летим дальше!

@slaincore 3 года назад

Я прям кайфанул от того на сколько ты круто обяснил все в этом уроке!

@ivanmiarkulau8320 3 года назад

спасибо за объяснение фундаментальных вещей в программировании, что такое ООП надо понимать, летим дальше учить ReactJS!)

@user-ik1lz1ul4y Год назад

Димарик привет с 2023!!! дай Бог здоровья тебе и твоим близким !!! спасибо за курс

@mousecarrot8401 3 года назад

Так понятно изложено, что аж приятно делать задания

@shamilsalakhutdinov5519 4 года назад

читал учебник, где это объяснялось на примере машины, круто было освежить инфу в голове, спасибо!)

@marynaserhiichuk7780 2 года назад

наконец то понятно зачем нужно нижнее подчеркивание. Лучшее объяснение. Браво )))

@yourbadapple 3 года назад

Спасибо большое за видео!

@cikada3398 5 лет назад

Все супер, спасибо за старания)

@videoX6 5 лет назад

Спасибо! Отличный урок ))

@sergeev_rs 3 года назад

Посложнее, но так даже интереснее. Димыч спасибо,курс огонь!!!

@user-cy4cz7zx4m Год назад

Спасибо за уроки

@Snegurjan 3 года назад

Димыч, спасибо что отправил на 36 видео из 53,реально стало понятнее 👍

@SvetaSveta-ms4hi 4 года назад

Супер курс ! Лучший во всем ютубе ! Огромнейшее спасибо!👌👍

@boribooger 4 года назад

Объясняешь очень доходчиво!

@tim7703 Год назад

Спасибо за Ваш труд! Иду дальше :)

@Amourphys 2 года назад

Спасибо вам большое, что растолковали ООП в реакте

@travelingtheworldH 3 года назад

Решил пройти курс, чтобы освежить знания Спасибо большое за старания)

@alexnikolaienko3478 2 года назад

Прекрасное начало. Очень интересно и надеюсь мне OOP легко зайдет.

@rovshen.public 3 года назад

Вот это уже удобная тема, код чище, запутаться уже вариантов меньше! Спасибо за этот курс

@user-vo1fu2sh7n 4 года назад

Димыч, спасибо за хорошую подачу!!! Все объяснил четко! Сам зарефакторил код, все получилось!

@over_the_top_404 Год назад

Димыч, спасибо! Летим дальше!

@user-tf1rn7qq2p 3 года назад

Большое реактивное спасибо, Димыч!

@andriizhyvotovskyi7944 3 года назад

Тема важная и дается не легко. Нужно еще будет почитать про this.

@alexandera7398 Год назад

Бегу смотреть следующий видос 🔥

@linuxlifepage 4 года назад

Спасибо! Все очень понятно и просто

@oconnor4417 Год назад

Отлично разъяснил как всегда, лучший !

@sanbuz Год назад

Большое спасибо за видос !

@antonmaklakov 3 года назад

Офигеть, чисто видос начался с лёгкого объекта, потом с сеттерами,observer'ами и прочим.Сложный видеоролик в плане наращивания понимания материала, но интересный.

@crypto4elik Год назад

на середине понял, что надо оборачивать стейт в стор :) и радуюсь

@sergei9101 2 года назад

Этот и прошлый урок реально помогли обзервер патерн прочуствовать. Спасибо!

@kriptonVIP 3 года назад

Благодарю Дмитрий! Очень рад что попал именно на этот курс по обучению React, после него формируется реальная база понимания, сложных вещей простыми словами,! Чувствую в другом месте ушло бы гораздо больше времени на понимание этих вещей!