Урок 6. JavaScript. Объекты с Object.create. Что такое getters, setters

  Переглядів 216,895

Владилен Минин

Владилен Минин

4 роки тому

Получить профессию Frontend разработчика -
bit.ly/3uUCgWD
Подробнее узнать об обучении в Result School -
bit.ly/39Z20qb
Бесплатный курс HTML & CSS - bit.ly/3wAomt9
Сделать 5 проектов на JavaScript - bit.ly/43ebXYl
Я в соц сетях:
Telegram: t.me/js_by_vladilen
VK: vladilen.minin
Instagram: / vladilen.minin
Мои паблики по JavaScript:
Telegram: t.me/result_school_it
VK: result.school
Instagram: / result.scho. .
JavaScript cообщества:
Discord: / discord
Telegram: t.me/js_by_vladilen_chat
Roadmap по каналу:
vladilen.notion.site/Roadmap-...
Урок 6. JavaScript. Объекты с Object.create. JS getters, setters
В ролике я расскажу про гибкую настройку объектов в JavaScript.
Вы узнаете про PropertyDescriptors, getters, setters и про цикл for in
Так же поговорим про метод hasOwnProperty
Сложный JavaScript простым языком:
• Урок 1. JavaScript. Чт...

КОМЕНТАРІ: 265
@user-xt9cm9my7x
@user-xt9cm9my7x 4 роки тому
Я так понимаю, что через несколько уроков у меня будут уже все данные на Владилена. В этом ролике вот год рождения получил, а там и до паспортных данных не далеко ) Большое спасибо за уроки!
@romko-romario
@romko-romario 3 роки тому
Очень понравилось видео! Но два важных уточнения : 1) 13:28 Чтобы итерировать по собственным свойстам объекта, отсеивая свойства прототипа(-ов), не обязательно проверять внутри цикла, является ли свойство собственным, а можно воспользоваться встроенным методом Object.keys(), который возвращает итерируемый объект (а именно - массив) из собственных перичесляемых свойств объекта. Например: for(let i of Object.keys(person)) { console.log(i, person[i]); } 2) 7:15 В случае если значения дескриптора writable равняется false, а configurable - true, значение ключа возможно не только удалять, но также и переназначать - правда, с помощью оператора "=" это действительно сделать невозможно, но зато возможно с помощью метода: Object.defineProperty(). Например: Object.defineProperty(person, 'name', {value: 'Maxim'}); или Object.defineProperty(person, 'name', {value: 'Maxim', writable: true, configurable: false}); // (результат этих двух строчек кода будет один и тот же, так как если значения дескрипторов не переназначать, сохраняются их прежние значения, а не дефолтные).
@s.konstantin
@s.konstantin 4 роки тому
Все понятно и доходчиво. Учусь во основном на твоих уроках! Нет воды, все по теме. Спасибо тебе за труд!
@VladilenMinin
@VladilenMinin 4 роки тому
🙏
@borik9125
@borik9125 3 роки тому
Пытался прочесть в рифму, увы, тщетно )
@nuttyNat
@nuttyNat 3 роки тому
@@borik9125 хокку жи
@SlavaSanin
@SlavaSanin 4 роки тому
ЛУЧШИЙ ЛЕКТОР ПО ПРОГРАММИРОВАНИЮ В ИНТЕРНЕТЕ!!! СПАСИБО!!!!!
@SENATOROV
@SENATOROV Рік тому
Лучший? заходи ко мне!)
@AleksandrGolrichtGlrcht
@AleksandrGolrichtGlrcht 2 місяці тому
😂😂😂😂😂
@okyskaa
@okyskaa 4 роки тому
Очень сложные темы доступно раскрыты, глубоко и в то же время максимально сжато. Спасибо большое. Смотрю по одной теме в день. Повторяю. Это обязательно поможет на собеседовании. Да и на проектах будет меньше конфуза.
@Vlad-em1bx
@Vlad-em1bx 4 роки тому
Отличное объяснение! Спасибо Вам за труд!
@user-cq7gz8ln9t
@user-cq7gz8ln9t 3 роки тому
Самые лучшие лекции по JS. Спасибо!
@user-gx7kf9um9x
@user-gx7kf9um9x 4 роки тому
Чувак, очень круто, спасибо, быстро, понятно, очень ценно, поскольку не основы, а глубина! Спасибо!
@gentleman94
@gentleman94 3 роки тому
Владилен, шикарно, спасибо огромное) такой пул информация в кратчайшее время, не мог не прокомментировать)
@armanscription1428
@armanscription1428 Рік тому
Очень полезные видео, действительно не каждый препод на ютубе говорит про эти темы, спасибо большое за твои старание!
@user-xd6bq6te4x
@user-xd6bq6te4x 3 роки тому
Timecodes: 0:52 - Object.create() 3:14 - for...in 4:32 - Property Descriptors 8:10 - getters, setters
@user-ju7eg8vq1r
@user-ju7eg8vq1r 3 роки тому
Очень полезный контент. Огромное Вам спасибо!
@Kavrizhka
@Kavrizhka Рік тому
Спасибо за полезную информацию!👍👍
@user-md5mw1tp3e
@user-md5mw1tp3e 4 роки тому
Спасибо большое! Очень познавательное видео.
@lolashepota4050
@lolashepota4050 3 роки тому
It is very understandable and useful content. Thank you very much!
@user-lv4dn6bc9l
@user-lv4dn6bc9l 3 роки тому
Спасибо, очень полезный контент!!
@lumeaceaiuluisrl6343
@lumeaceaiuluisrl6343 3 роки тому
Спасибо! Как всегда, супер!)
@Pr0xytube
@Pr0xytube 4 роки тому
Спасибо за хорошие уроки)
@Ziraman13
@Ziraman13 4 роки тому
спасибо за науку и пусть тебе твое учительство принесло больше пользы ))
@SvetaSveta-ms4hi
@SvetaSveta-ms4hi 4 роки тому
Спасибо Вам огромнейшее!!!
@nataliavardazaryan3981
@nataliavardazaryan3981 2 роки тому
Спасибо тебе за труд!
@owl5456
@owl5456 Рік тому
спасибо большое Владилен Минин
@oleggribkov238
@oleggribkov238 3 роки тому
Очень все доступно и понятно)
@user-qg1wi9ce8r
@user-qg1wi9ce8r 4 роки тому
Всем все понятно и доходчиво в комментариях ),а я один походу все уроки по 4 раза пересматриваю и практикуюсь, что бы уловить суть? Владилен спасибо за уроки и курсы на юдеми :)
@mediontamginskii5889
@mediontamginskii5889 4 роки тому
Не ты один такой) Мне вот тоже приходится по паре раз пересматривать, читать, гуглить другие видео смотреть!
@serjsamoilow8711
@serjsamoilow8711 3 роки тому
я тоже нифига не вкуриваю с первого раза. для себя решил что буду просто хавать всю инфу подряд (и обязательно записывать все, что действительно важно, а очень важные моменты держу всегда под рукой). а потом на практите все подтяну. я так хтмл и цсс учил, прочитал 3 книги, вроде все понял, а перешел к практике и впал в ступор. в итоге пока сам не написал несколько сайтов - не разобрался, но база, которую получил из книг в виде общей теории - очень сильно помогла. надеюсь так же изучить js. вообще трудно что-либо изучать, когда не понимаешь, где это использовать на практике. например я понятия не имею, как мне на практике пригодится object create, если я могу использовать обычное создание объектов через object = {}, и оно сможет решать мои потенциальные задачи, но перейдя к практике, уверен, найду применению этого урока. p.s.: хотел поделиться методом своего обучения. если кто дочитал до конца - поделитесь плз как учитесь вы.
@antonb6831
@antonb6831 4 роки тому
Спасибо, хорошее объяснение. Оказывается, геттеры и сеттеры это не так страшно)
@izograph
@izograph 3 роки тому
да еще и полезно!
@GordonBreazz
@GordonBreazz 4 роки тому
Отличный урок, спасибо
@mrMarseleene
@mrMarseleene 3 роки тому
охеренные уроки, спасибо! В связке с документацией и learn.javascript особенно круто заходит
@ondrui
@ondrui 3 роки тому
спасибо за классный урок!
@VladilenMinin
@VladilenMinin 4 роки тому
Все понятно, двигаемся дальше?)
@mysteriousxcodesterio4434
@mysteriousxcodesterio4434 4 роки тому
Владилен Минин , Пожалуйста, делайте по больше обучающего контента, это очень важно для нас не останавливайтесь ведь вы делаете благое дело, для тех кому очень важно!!!! Программирование и данное направление, спасибо вам большое!
@nikdanik
@nikdanik 4 роки тому
Владилен, спасибо вам за уроки. Хотел бы узнать, как часто в боевых проектах используется get и set и в каких приблизительно случаях. Спасибо
@Rain161Man
@Rain161Man 4 роки тому
MysteriousXcode Sterio и так почти каждый день ролики, это тяжело)
@Rain161Man
@Rain161Man 4 роки тому
E1EMENT лично я не очень часто этим пользовался, но зависит от проекта
@hellicobacterpillory6677
@hellicobacterpillory6677 4 роки тому
Русскоязычные уроки js ограничиваются в своем большинстве основами, более глубокий материал, какой подаёте вы - редкость и на вес золота, успехов вам в карьере и моя благодарность за старания для нас !)
@user-bs2nq5kk4x
@user-bs2nq5kk4x 4 роки тому
Очень полезный материал. Уже придумал много кейсов, где можно использовать это в проектах.
@izograph
@izograph 3 роки тому
Класс!!! Мощный инструмент! Обычные классы с приватами и пабликами курят в сторонке ))
@isagidaiki
@isagidaiki 10 місяців тому
Очень понравилось видео!
@web4453
@web4453 2 роки тому
БУМ. Совершенно для меня новая информация, как будто апнул левел. Никогда даже представить не мог, что свойствами объекта можно манипулировать и что у свойств есть свои свойства :D
@billlanc9461
@billlanc9461 5 місяців тому
Четкое пояснение
@alexfender88
@alexfender88 3 роки тому
Намного понятнее стало!
@user-jq7sk2zo6c
@user-jq7sk2zo6c 3 роки тому
Отличное видео👍
@user-ff1fc7iz9j
@user-ff1fc7iz9j 3 роки тому
Спасибо! ❤😊
@vanya_hrynkiv
@vanya_hrynkiv 4 роки тому
Все стало понятно
@pavloskuibida6292
@pavloskuibida6292 3 роки тому
Спасибо тебе!
@user-ml8hn5kg9e
@user-ml8hn5kg9e 2 роки тому
Привет Владилен у нас в Компании учат по твоим Видео))) Хороший уровень видео!!!
@Russian-Stalinist
@Russian-Stalinist 11 місяців тому
Полезный урок!
@BilliK1000
@BilliK1000 4 роки тому
Thank you!!!! it is very useful!!!
@user-fn2pi6xz8f
@user-fn2pi6xz8f 3 роки тому
Очень полезно!
@Vitaliy-ct2wv
@Vitaliy-ct2wv 4 роки тому
супер, летим в космос =)
@gubatenkov
@gubatenkov 4 роки тому
тебя димыч подослал?))
@blind_ron1n
@blind_ron1n 3 роки тому
Полезно!
@aggressivenvironment
@aggressivenvironment 3 роки тому
Спасибо!
@armanilyassov3682
@armanilyassov3682 4 роки тому
Super! 👍🏻
@bohdan.petrov
@bohdan.petrov 4 роки тому
Лучше использовать Object.create или функции конструкторы? Пока не уловил преимущества и недостатки каждого из способов. Что используется чаще на практике?
@dimalukashenko4865
@dimalukashenko4865 Рік тому
Хорошее видео
@artemijeka
@artemijeka 2 роки тому
Спасибо
@davarmghazaryan580
@davarmghazaryan580 6 місяців тому
Супер канал
@robert33318
@robert33318 Рік тому
Klasssss !!!
@michaelson9137
@michaelson9137 4 роки тому
Спасибо за доступное и понятное объяснение. Единственное что я так и не могу представить, где можно данный способ использовать. Подскажите конкретный пример плз))
@dmitryulanov9395
@dmitryulanov9395 2 роки тому
Применения объекта применяется всюду. В основном в них хранят данные и используют. Чтобы было понятнее, посмотри для чего используют объекты на ютубе. На практике
@besizzo
@besizzo 2 роки тому
@@dmitryulanov9395 Уверен, Миша спрашивал, в каких случаях не просто используют объекты, а именно объекты созданные при помощи Object.create
@user-py7nm1mu2b
@user-py7nm1mu2b 4 роки тому
Не знал кстати, что можно так тонко настраивать объекты при их создании, думал так можно делать только через Object.defineProperties :-) спасибки будешь рассматривать в дальнейшем Object.defineProperties, Object.defineProperty и остальные интересные операции с объектами?
@VladilenMinin
@VladilenMinin 4 роки тому
Эти методы уже не буду, потому что я дал достаточно знаний, чтобы прогуглить эти методы и понять как они работают)
@alibekn6449
@alibekn6449 2 роки тому
спасибо
@xalinanton
@xalinanton 4 роки тому
Жду Proxy :D
@vladimirrabtsun
@vladimirrabtsun 4 роки тому
Про ImmutableJs посмотреть бы
@user-ru8qb9ze1d
@user-ru8qb9ze1d 4 роки тому
Ахахахах) просто безумие)) возможностей после урока миллиард, да это же почти модификаторы доступа)) теперь после урока про прототипы можно запросто свои интерфейсы пилять)) хотя конечно с нынешними фреймворками дело не совсем нужное) спасибо за лекцию))
@user-os7xv8em1s
@user-os7xv8em1s 3 роки тому
А можно ли налету программно менять значение свойств, ну скажем writable: true на writable: false (и всех других тоже) или надо переопределять весь объект заново?
@mihrankhachatryan3693
@mihrankhachatryan3693 3 роки тому
А у нас лектора несут какую то дичь из 80-ых)).Красава братан, лукас от душы)
@batradzbazzaev
@batradzbazzaev 3 роки тому
Владилен, подскажи, в каких случаях в работе нам удобно использовать именно такую инициализацию объекта, и использовать геттеры и сеттеры?
@artemijeka
@artemijeka 2 роки тому
отвечу за него, скорее всего где нужна тонкая настройка свойств и методов, перебираемость, изменяемость, удаляемость
@sadykov5671
@sadykov5671 2 роки тому
В ООП / инкапсуляция
@komilolimov2257
@komilolimov2257 Рік тому
Четко
@novichok3417
@novichok3417 7 місяців тому
Ваше объяснение темы сеттеров и геттеров третье по счёту и все объясняют только часть. Сколько ещё видосов надо посмотреть, чтобы полностью изучить эту тему?
@user-gu5ir3zs4v
@user-gu5ir3zs4v 4 роки тому
Очень жду Proxy и классы
@nareksargsyan9581
@nareksargsyan9581 3 роки тому
super video
@ticheroi
@ticheroi 4 роки тому
спасибо большое за ваш труд, есть замечание не всё в js объект: строки, числа и прочие примитивы не объекты, когда вы обращаетесь к свойству/методу примитива интерпретатор js создает временный объект обертку для соответствующего примитива, в которой хранятся методы и свойства высказывание "всё в ${имя ЯП} объект" это скорее про пайтон
@vasiliy_konnov
@vasiliy_konnov 4 роки тому
как правильно используют эти два параметра в функции object.create({},{}) Пока что мне пришло в голову только то, что во втором параметре мы пишем логику, вычисления, проверки, а в первом описываем например вывод шаблонов (кусков html с динамически изменяемой информацией) но я не уверен в своих догадках
@mohmadnavruzov3867
@mohmadnavruzov3867 День тому
не особо понял но очень интересно 👍
@skily4866
@skily4866 3 роки тому
Немного не понял смысла сеттера, если его использовать то значение поля не изменится, а прописать writable: true сеттеру нельзя
@mukhammadrustambayev2051
@mukhammadrustambayev2051 4 роки тому
жду от вас уроки про vue-class-component, vue-property-decorator
@VladilenMinin
@VladilenMinin 4 роки тому
Да, вероятно они будут
@nikitaershov5005
@nikitaershov5005 Рік тому
красава
@stolz999
@stolz999 4 роки тому
Ппц. В 1993 я школу закончил. В институт поступил. Теперь сижу, подтягиваю JavaScript...
@Alex-rs1tt
@Alex-rs1tt 3 роки тому
И я) 1976 г.р.
@olegsoul6016
@olegsoul6016 3 роки тому
Ха) Я вообще 1973 г.р.)) И тоже учу JS)
@vana__f7570
@vana__f7570 3 роки тому
я из 2005 и учу js
@kaltsdaniil8378
@kaltsdaniil8378 3 роки тому
@@vana__f7570 я родился в 2006)
@talivel118
@talivel118 2 роки тому
@@kaltsdaniil8378 Я родился в 2006;)
@user-bx7ly2th3b
@user-bx7ly2th3b 4 роки тому
Отличное объяснение! Не понятен только 1 момент из всего: как нам через сеттер сделать то, для чего, собственно, он служит: задать значение переменной? Если там объявить this.age = value - он завернется в loop
@Furamy
@Furamy 3 роки тому
Вроде как напрямую нельзя, но можно менять значения у которых writable: true и от которых образуется значение для age с помощью get, в данном случае поставить для поля birthYear writable:true и менять его в set у поля age set(value) { this.birthYear = new Date().getFullYear() - value; }
@user-bx7ly2th3b
@user-bx7ly2th3b 3 роки тому
@@Furamy ну, наверное как-то таак, да....других вариантов вроде не видно)
@mad0k
@mad0k 4 роки тому
сделай уроки по ImmutableJs
@oleksandrharkusha9404
@oleksandrharkusha9404 4 роки тому
Спасибо за полезеную и понятно изложеную информацию. Но большая просьба ты в многих видео говоришь что практика и только практика закрепит хорошое понимание языка так вот просьба давай хоть какое-то задание пусть даже обсурдное
@kirillgavrilov9681
@kirillgavrilov9681 4 роки тому
Переписал код из видео?)
@alexfender88
@alexfender88 3 роки тому
А почему мы метод calculateAge положили в прототип а не в сам объект? какой в этом смысл глобальный?
@artemkirkhmaier484
@artemkirkhmaier484 2 роки тому
Так и не понял в чём разница между get и set
@vasiliy_konnov
@vasiliy_konnov 4 роки тому
А в get() - мы не принимаем параметр? не совсем понятно как на практике использовать его. Можно какой то пример?
@VladilenMinin
@VladilenMinin 4 роки тому
Не принимаем. Например валидация или трансформация Пример в уроке
@werus4291
@werus4291 4 роки тому
super
@justaman834
@justaman834 4 роки тому
так и не понял зачем в age get() если можно просто переменную завести с таким значением или функцию, да и set такая же шляпа, можно же в объекте отдельный метод какой-то сделать который будет что-либо считать или проверять, что я не так понял?)
@johnstrayk5208
@johnstrayk5208 4 роки тому
Как Боженька все разжевал.
@ivanvano8571
@ivanvano8571 3 роки тому
Привет Владилен, очень круто исложено!!! а откуда брать інфу про єти дискриптори?
@eeee4re
@eeee4re 3 роки тому
JavaScript работает на стандарте ECMAScript. Ответ на ваш вопрос находтися тут tc39.es/ecma262/#sec-object-type
@user-wv7tx4mb6d
@user-wv7tx4mb6d 3 роки тому
Для продвижения ролика)))
@AGM140580
@AGM140580 2 роки тому
Очень хорошее объяснение, но не для новичков.
@user-vd6eg5ke7i
@user-vd6eg5ke7i 3 роки тому
Что за модуль который скобки автоматически переносит?
@egrpavlov2694
@egrpavlov2694 4 роки тому
Данный синтаксис : объявление getter и setter внутри дескриптора свойства не работает (геттеры и сеттеры просят указать название) . Объясните что не так
@phpdevelopercode636
@phpdevelopercode636 3 роки тому
Откуда вы берете эти знания? Смотрел на mdn по object.create, но там про дополнительные поля writable и прочие нечего не написано, есть только пример, но что они делают не написано
@abraham_word
@abraham_word 3 роки тому
Можешь показать создание сайта на реакте? простого, но с админкой
@VladilenMinin
@VladilenMinin 3 роки тому
На канале курс по мерн
@cyclopentanpergidrophenantren
@cyclopentanpergidrophenantren 4 роки тому
судьба object create после появления классов class Object, где внутри можно поместить и свойства и методы, учитывая отсутствие таких модификаторов в классе, как privet, protected - необходимость set, get весьма сомнительная.
@DanReksar
@DanReksar 4 роки тому
Почему в set() нужно обращаться к document а не к window?
@user-dn1sy6mb7i
@user-dn1sy6mb7i 2 роки тому
👍👍
@user-qh4zv9qc9h
@user-qh4zv9qc9h 2 роки тому
Круто с примерами, но не понятно зачем нужны get и set? какой смысл, если всё это можно обычными методами сделать. Не понял задумки магов JS.
@-it-kidys
@-it-kidys 4 роки тому
Спасибо за урок! Не знал даже не догадывался о таком создании объектов в JS.. А где в реальной практике это может быть полезно? Это и есть полная реализация инкапсулированных свойств объекта
@VladilenMinin
@VladilenMinin 4 роки тому
Реализация реактивности в фреймворках например Vue раньше на этом целиком был построен
@-it-kidys
@-it-kidys 4 роки тому
@@VladilenMinin а реакт нет?
@VladilenMinin
@VladilenMinin 4 роки тому
@@-it-kidys Про реакт не помню, но вроде у них другой механизм
@romankonkin4365
@romankonkin4365 4 роки тому
@@VladilenMinin Во Vue и сейчас вся реактивность на Object.defineProperty() :) Или ты имеешь ввиду, что там раньше было именно через Object.create()? Вот про это я не вкурсе. В 3-ем должна быть реализация реактивности уже на Proxy.
@ujhljcnm
@ujhljcnm 4 роки тому
А где на Patreon ссылка?
@KostiaBazrov
@KostiaBazrov 4 роки тому
почему не const, а let в конструкции for( const el in obj ) ?
@anazkomult
@anazkomult 4 роки тому
Потому что на каждой итерации в el должно попадать новое значение, а const изменяться не может.
@KostiaBazrov
@KostiaBazrov 4 роки тому
Andrey Nazarenko , а в курсе, что const пашет в блочном скопе7
@user-ng1qt1mi4o
@user-ng1qt1mi4o 4 роки тому
Почему после того, как ты внутри for..in написал hasOwnProperty не вывелись свойства age и birthDate? Ты же их не в первом объекте создавал
@VladilenMinin
@VladilenMinin 4 роки тому
Потому что по умолчанию enumerable = false
@petrvictorovich
@petrvictorovich 2 роки тому
Почему так получилось, что новый метод оказался в "___proto___". Разве он не должен быть в "prototype"?
@vladimirrabtsun
@vladimirrabtsun 4 роки тому
Крута
@Mr.manpasserby
@Mr.manpasserby Рік тому
Шпаргалка 14:00 юзать метод объекта hasOwnProperty(), когда используется цикл for (let ... in ...)
@nurbekbekmuratov6977
@nurbekbekmuratov6977 3 роки тому
В чем разница между SET и GET ??
Запросы в 1С за 3 часа. Часть 2
3:17:01
IRONSKILLS - Курсы по 1С
Переглядів 253 тис.
Teenagers Show Kindness by Repairing Grandmother's Old Fence #shorts
00:37
Fabiosa Best Lifehacks
Переглядів 33 млн
skibidi toilet 73 (part 2)
04:15
DaFuq!?Boom!
Переглядів 31 млн
Мама забыла взять трубочку для колы
00:25
Даша Боровик
Переглядів 482 тис.
Урок 5. JavaScript. Promise. Что это, как работает (+ пример)
23:18
Владилен Минин
Переглядів 557 тис.
prototype и __proto__ / JavaScript для собеседований 01
34:07
Getter & Setter in JavaScript / ES6
3:43
JavaScript Talks
Переглядів 5 тис.
Применяем методы массивов к объектам  Javascript. Object keys, values, entries, enumerable
16:35
WebDev с нуля. Канал Алекса Лущенко
Переглядів 27 тис.
JavaScript Getters and Setters | Mosh
6:37
Programming with Mosh
Переглядів 233 тис.
ООП в JavaScript. Get, Set JavaScript, приватные и защищенные свойства
23:01
WebDev с нуля. Канал Алекса Лущенко
Переглядів 46 тис.
РАБОТАЙ МЕНЬШЕ: Как достичь цели за 2-4 часа в день
21:18
Будущие работы: какие навыки будут востребованы
32:53
Teenagers Show Kindness by Repairing Grandmother's Old Fence #shorts
00:37
Fabiosa Best Lifehacks
Переглядів 33 млн