JavaScript без лаптей та балалайки. Part3. Prototypes. Browser. Classes.
Part 3. Prototypes. Browser. Classes. (Таймкоди додам пізніше) New.Target, захищаємо функцію, підправляємо функцію від Max Schwarzmüller як працювати в Браузері, не тільки в Node, так як працюють головні лектори по JS Функція є надбудова над обьектом (умовно this={}) Класси – не більше ніж сінтаксичний цукор для функцій, альтернатівний сінтаксіс того ж самого, що можна зробити функціями Ієрархія класів, Де зберігаються Scope (те що потрібно завантажувати в стек для роботи функції) Де зберігаються проперті, прототайпи, методи – дивимося в Node Приклад Макса ШварцМюллера, бейз-клас та дерайвед-клас, Super, додаемо в конструкторі проперті та також додаемо дінамічно дві функції - у класс, та у прототайп класа – дивимося іерахію Функція яка другує іерархію обьектів (перша версія, буде модіфікована у майбутньому) Приклад з NULL-прототайпом, порівняння зі звичайними функціями (Object.Create from Null) Той самий приклад на классах переписуємо на функціях, порівнюємо іерархію Обьеднуемо модулі Class та Prototypes як Module в браузері Просто в Браузері неможна подивитися обьеднання завантажених модулей, буде помилка – Cross Origin Blocked Нам потрібен Веб-сервер, щоб дивитися не вбудовані в HTML скріпти, а модулі які завантажуються Які існують плагіни вебсерверів у VS Code, я користуюся Live Server, можна користуватися NodeMon Дивимося іерархію класів у Браузері Те ж саме робими з іерархією функцій у Браузері Реалізацію на функціях я завантажив по різному – як реалізація на скріптах, а не на модулях На скріптах функцію мають глобальний скоп JS-файли можно завантажити у браузер як модулі, як скріпти, як CommonJS або можна зробити бандл (про нього буде у майбутньому топіку) дивимося в прототайпи класів та функцій – що там є у обьекті самому по собі Call, Bind, Apply дозволяе змінити контекст роботи функції Як можна зробити підписку на евенти, ще раз про калбекі Калбек для інтерктивноЇ роботи з консолью у Node у вигляді Arrow-функції Інтерфейс Readline Щоб завантажити всі бібліотеки Node треба зробити NPM I Методіка запобігання Side-єфектів на початку функції за допомогою Array.From Slice(0).Reverse – робимо копію масива, та робимо мутабл-операцію реверса арая Тернарний оператор Веб-компоненти, робимо наш перший власний HTML-єлемент безпосередньо в браузері Підписка на події браузера – this.AddEventListener у конструкторі класа Робимо коннект калбека у веб-компоненті до нашого кастомного єлемента та викликаємо новий Window Основа Ангуляра – веб-компоненти Перевіряємо роботу веб-компонента у браузері Як виглядають веб-компоненти на практиці Два ємулятора HTML Dom, які дозволяють робити веб-компоненти в Node JsDom, дивимося на літеральну функцію HTML, яку завантажуємо у JsDom Дивимося на ємуляцію Браузера від JsDom – Window, LocalStorage та все інше з браузера Працюємо з ємулятором – робимо перелік DIV, робимо перелік всіх нодів, що завантажили як HTML у JsDOM Робимо ітератор по всім нодам HTML Друга функція – html-element (е помилка у описі, буде у наступній лекції поправлена, все там є, події наприклад) Працювати з цим емулятором треба інакше, перший приклад, більш могутній приклад буде у наступній лекції Все підсумовуемо -------------------------- Why we speak Ukrainian? Because : свечка-печка совок-веник лапти-валенки медведь-балалайка попы и молитвы НКВД и Гулаг Пушкин и дедыНаПалках So, lets going: ------------------------ Part1. • JavaScript без лаптей та балалайки. Ф... Part2. • JavaScript без лаптей та балалайки. Ф... Part 4. • JavaScript без лаптей та балалайки. P... Part 5-1. • JavaScript без лаптей та балалайки. P...