TL; DR: Понимание прототипового наследования, использования и специфика. Составлен с кодом, консолью и пояснением.
Проблемы поняты кристально, если видят с правой точки зрения. Перемещение на одной оси: рассмотрим биологическую перспективу для концепции наследования в JavaScript. Пусть Майк будет отцом, и Джо был его сыном 👦. Согласно биологии, Джо будет наследует некоторые «свойства» или «образ» своего отца, Майка, неосознанно Отказ Это изображение или «свойства» или слова версий оригинальной копии, унаследованного от родительского объекта к дочернему объекту, относятся к «прототипому наследству».
…
JavaScript – это язык на основе прототипа, поскольку оно позволяет наследовать прототипы объекта. JavaScript ссылается на это элементы как объекты. Родной объект JS имеет свой встроенный Сумка недвижимости И эта сумка свойств может быть унаследована другим объектом. Например:
Console.log (Array.Prototype);//приносит Все основные свойства и методы, связанные с объектом массива и добавляют его в массив. Прототип.
Определения терминов, связанных с прототипом наследования в интервью JS:
- Прототипов наследования Средства объектов и методов могут быть разделены, расширены и скопированы с одного объекта к другому объекту.
- А Прототип это еще один объект, который можно использовать в качестве загрязнения источника свойств.
- Прототиповая цепь это механизм поиска для свойств на объекте. Если доступен недвижимость объекта, JavaScript изначально ищите сам объект. Если свойство не найдено, он поднимается до прото-цепи, пока не найдено (или даже не).
Некоторые кодовые слои для практического обучения:
1. Создание функции конструктора и проверьте, существует ли его прототип?
Всякий раз, когда вы создаете функцию конструктора, объект свойств под названием Prototype создается автоматически и прикреплен к объекту функции (конструктор). Примечание. Этот новый объект прототипа также указывает, или имеет внутреннюю личную ссылку, нативный объект JavaScript.
В следующем примере создается функция конструктора, Mike:
function Mike () {
this.name = 'Mike';
this.skill = 'JavaScript';
}
//Mike inherits an Object prototype. The "prototype" gets created with function Mike declaration, automatically.
Mike.hasOwnProperty('prototype');
console.log(Mike.prototype);
//paste above code on console.
HasownProperty. () метод возвращает логическое значение, указывающее, имеет ли объект указанного свойства в качестве собственного свойства (в отличие от наследства его) ~ MDN
2. Добавление свойств на функциональный прототип. Следующий синтаксис определяет, как назначать свойства и методы к функциональному прототипу: Синтаксис:;
Mike.prototype.putName = function () {
return 'My name is ' + this.name;
}
console.log(Mike.prototype); //putName method added to Mike prototype
Здесь, метод Putname создается в качестве прототипового метода, попробуйте сравнить его с нашим предыдущим выходом консоли. Любая разница?
3. Наследование свойств от родителя к ребенку. Добавьте ключевое слово «Новое», чтобы сделать экземпляр родительского объекта для наследования свойств.
Например:
var Joe = new Mike(); console.log(Joe); //Son(joe) inherits father prototypal properties
За кулисами, когда вы звоните: Вар Майк ();
JavaScript на самом деле выполняется ниже операции:
var Joe = new Object(); Joe.[[Prototype]] = Mike.prototype; Mike.call(Joe);
4. Как браузер найдет, какие свойства принадлежат к какому объекту?
Браузер изначально проверяет свойства дочернего объекта [I.E. Свойства собственного экземпляра] Если не найдено, следовательно, он ищет унаследованные прототипы свойств, если не найден, то он пересекает прото от объекта наследовать на один уровень, если не найден снова, то он пересекает прото из прото до конца уровня цепи.
Но что такое прото ? _ прото _ это внутреннее свойство, связанное с объектом к своему прототипу.
В Условиях Мэймана прото Действует в качестве червоточины, который ссылается на свойства от одного объекта к другому объекту, во время прототипового механизма поиска цепи.
Например:
Conside the Prototypal chain built using above code: // Joe ---> Mike ---> Object.prototype ---> null
5. Почему нам нужен прототипы наследования (PI)?
PI помогает применять Сухой Принцип для объектных экземпляров. Он также помогает при передаче пула свойств от родительского объекта до дочернего объекта внутренне. Следовательно, наклон к функциональному делу.
… Некоторые ноу-хау при работе с прототипом наследования:
Object.Proptotype поддерживается различными браузерами и очень быстро. Это также просто вовремя (джит) Компиляция оптимизируется в природе.
Прототипов наследования позволяет все свойства, которые вы определяете в родительском прототипе, который будет эффективно разделяться всеми экземплярами. Изменения в родительских свойствах экземпляра будут автоматически смягчены ко всем дочерним экземплярам.
NULL не имеет прототипа, таким образом, заканчивает прототирующую цепь. [P.S: Typeof]
Функция в JavaScript всегда имеет свойство «Prototype» по умолчанию – одним исключением: функция стрелки. Функция arrow не имеет свойства прототипа по умолчанию.
Изготовление прототипового кода. Если код будет ограничен производительностью, посмотрите время для свойств в прототиповой цепочке могут иметь отрицательные эффекты. Как глубже вы идете в цепочку объема, тем больше вычислительных накладных расходов происходит как [[прототип]] выглядит рекурсивно. Чтобы решить проблему поиска, встроенное свойство, называемое как HasownProperty. может быть использован. Он касается собственных свойств объекта, возвращает логию после поиска и не проходит целую прототирующую цепочку. Как разработчик, будьте в курсе длины ваших прототиповых цепей и нарушите их, если необходимо, чтобы избежать возможных проблем с производительностью.
Не продлить объект. Прототип для добавления нерутивных свойств. Он разбивает инкапсуляцию и создает «патченг обезьян».
Инициализации конструкторов на родительском объекте могут поставить перегрузку нежелательных методов у ребенка. Будьте осторожны, делая это.
Узнайте больше о теме ниже ресурсов:
- Прото против прототипа
- Говорить на понимании узора прототипов наследования
- Когда не расширять прототиповую цепочку
- Prototype.js.
- MDN – прототипов наследования
Список литературы: MDN, Stack-Overflow, V8 -Blog и Internet Blogs.
Прототиповное наследование было моей первой статьей на Dev. Любые изменения или конструктивные обратные связи очень приветствуются:) Спасибо за чтение
Оригинал: “https://dev.to/thevinayysharma/prototypal-inheritance-in-javascript-5ghf”