Прототипи в JavaScript
Що таке макет?
Властивість прототип – спочатку порожній об'єкт. Ви можете додавати до нього члени, як і для будь-якого іншого об'єкта:
У наведеному вище прикладі ми створили функцію. Але якщо викликати myObject() , вона просто поверне об'єкт window , оскільки визначено у глобальному контексті. Отже, цеповертає глобальний об'єкт, оскільки ще не було ініціалізації (докладніше в тексті уроку).
Перш ніж продовжити, потрібно обговорити "секретне" посилання, яке змушує прототип працювати так, як він працює.
Властивість __proto__ не слід плутати із прототипом об'єкта. Це дві різні властивості, і вони діють взаємопов'язано. Важливо розуміти відмінності, тому що спочатку дуже легко заплутатися. Давайте розберемося детально. Коли ми створюємо функцію myObject, то визначаємо об'єкт типу Function.
Насправді, все не так просто. Тут ми наводимо лише ілюстративну частину для демонстрації роботи ланцюжка прототипу.
Отже, ми визначаємо myObject як функцію і даємо їй один аргумент name, але не встановлюємо жодних інших властивостей, таких як length, або методів, таких як call. Чому тоді працює наступний код?
Оскільки ми визначаємо myObject , то створюється властивість __proto__ і йому призначається значення Function.prototype (як було описано вище). Тому, коли ми звертаємося до myObject.length, відбувається пошук властивості length у об'єкта myObject, і за відсутності його здійснюється перехід по ланцюжку за допомогою посилання __proto__ link, знаходиться властивість і повертається його значення.
Можна здивуватись. чому length має значення 1, а не 0 (або будь-яке інше число). Тому що myObject насправді є реалізацією Function.
Коли створюється реалізація об'єкта,властивість __proto__ починає вказувати на конструктор прототипу, який у нашому випадку є Function .
Додатково, коли ви створюєте новий об'єкт Function, код конструктора Function підраховує кількість аргументів та оновлює властивість this.length відповідним чином. У разі аргумент 1 .
Але якщо ми створюємо реалізацію myObject за допомогою ключового слова new, __proto__ вказує на myObject.prototype, оскільки myObject є конструктором нової реалізації.
На додаток до методів у прототипу Function, наприклад, до call і apply, у нас з'являється метод myObject getName.
Таким чином, ми можемо створювати стільки реалізацій об'єкта, скільки потрібно.
Навіщо використати прототип?
Наприклад, при розробці гри потрібно кілька (можливо сотню) об'єктів відображати на екрані. Кожен об'єкт має свої властивості, такі як координати x і y, width, height, та інші.
Можна зробити так:
Всі ці об'єкти створюються та зберігаються у пам'яті - з окремими реалізаціями необхідних методів. Такий підхід дуже далекий від ідеалу – гра перевантажуватиме брауззер. що може зрештою призвести до зависання.
Але можна зберегти ефективність роботи програми. Потрібно лише створити сотню різних об'єктів з єдиним об'єктом prototype .
Як використати прототип?
Щоб збільшити продуктивність програми, ми можемо (пере)визначити властивість прототипу GameObject . Кожен екземпляр GameObject буде посилатися на методи GameObject.prototype так, ніби вони належать йому.
Тепер створюємо 100 реалізацій GameObject.
У нас є масив зі ста об'єктами GameObject, які використовують загальний прототип та визначення методу draw, що суттєво економитьпам'ять програми.
Виклик методу draw здійснюється дуже просто:
Прототип – звичайний об'єкт
Прототип є звичайним об'єктом. Якщо після створення всіх екземплярів GameObject ми вирішимо виводити кола замість прямокутників, то можна просто оновити метод GameObject.prototype.draw .
І тепер усі попередні та майбутні реалізації GameObject будуть малювати кола.
Зміна певного прототипу.
Тепер можна використовувати цей метод для будь-якого рядка:
Але цей спосіб має зворотний бік. Наприклад, ви можете використовувати описаний вище метод у своїх додатках, але в новій версії браузера може з'явитися зумовлений метод trim в прототипі String . Таким чином, ваше визначення trim буде змінювати певний! Ой! Для подолання цієї проблеми можна використовувати перевірку.
Хоча зазвичай слід уникати зміни зумовлених прототипів.
Висновок
5 останніх уроків рубрики "Різне"
Як розмістити свій сайт на хостингу? Правильно обраний хороший хостинг – це майбутнє Ваших сайтів
Проект готовий, Все перевірено на локальному сервері OpenServer та можна переносити сайт на хостинг. Ось тільки яку компанію вибрати? Пропоную переглянути хостинг fornex.com. Відмінне місце для твого проекту із перспективами бурхливого зростання.
Розробка веб-сайтів за допомогою онлайн платформи Wrike
Створення вебсайту – процес трудомісткий, що вимагає злагодженої взаємодії між замовником та виконавцем, а також між усіма членами колективу, залученими до проекту. І в цьому дуже хорошу підмогу надасть онлайн платформа Wrike.
20 ресурсів для прототипування
Добірка з кількох десятків ресурсів для створення мокапів та прототипів.
Топ10 безкоштовних хостингів
Невелика вибірка провайдерів безкоштовного хостингу з детальним описом.
Швидка замітка: масовий UPDATE у MySQL
Ні для кого не секрет як у MySQL реалізувати масовий INSERT, а ось з UPDATE можуть виникнути складності. Щоб не вдаватися до маніпуляцій події ON_DUPLICATE, можна скористатися спеціальною конструкцією CASE … WHEN … THEN.