2. Javascript объектно-ориентированное программирование: наследование конструкторов
Этот раздел в основном представляет, как генерировать экземпляр, который «наследует» несколько объектов.
Например, теперь существует конструктор для объекта «животного».
function Animal () {this.species = "Animal"; }Существует также конструктор объекта «кошки»,
Функция Cat (имя, цвет) {this.name = name; this.color = color; }Как «кошки» могут наследовать «животных»?
1. Связывание конструктора
Самый простой способ, вероятно, состоит в том, чтобы использовать метод вызова или применения для связывания конструктора родительского объекта с дочерним объектом, то есть добавить строку в конструктор объекта дочернего объекта:
Функция Cat (имя, цвет) {Animal.Apply (это, аргументы); this.name = name; this.color = color; } var cat1 = new Cat ("большие волосы", "желтый"); предупреждение (cat1.species); // животное2. Прототип режим
Более распространенным подходом является использование атрибута прототипа.
Если объект прототипа «кошки» указывает на экземпляр животного, то все экземпляры «кошки» могут наследовать животное.
Cat.Prototype = New Animal (); Cat.prototype.constructor = cat; var cat1 = new Cat («большие волосы», «желтый»); предупреждение (cat1.species); // животное
В первой строке кода мы указываем объект прототипа CAT на экземпляр животного.
1.cat.prototype = new Animal ();
Это эквивалентно полностью удалению исходного значения объекта прототипа, а затем назначению нового значения. Но что означает вторая строка?
1.cat.prototype.constructor = cat;
Оказывается, что любой прототип объект имеет атрибут конструктора, указывающий на его функцию конструктора. Другими словами, свойство конструктора Cat.Prototype объекта указывает на Cat.
Мы удалили исходное значение этого объекта прототипа на предыдущем шаге, поэтому новый объект прототипа не имеет атрибута конструктора, поэтому мы должны добавить его вручную, иначе будут проблемы с последующей «цепочкой наследования». Это то, что означает вторая строка.
Короче говоря, это очень важный момент, и вы должны следовать ему при программировании. Все следующие следующие: если объект прототипа заменен,
1.o.prototype = {};
Затем должен быть следующее шаг, чтобы добавить атрибут конструктора в новый объект прототипа и направить этот атрибут обратно в исходную функцию конструктора.
1.o.prototype.constructor = O;
3. непосредственно наследственный прототип
Поскольку в объектах животных, неизменные свойства могут быть написаны непосредственно на животное. Прототип. Поэтому мы также можем позволить Cat () пропустить животное () и непосредственно наследовать животное. Прототип.
Теперь давайте сначала переписаем объект животного:
1.function Animal () {}
2. animal.prototype.species = "Animal";
Затем укажите объект прототипа кошки и укажите на объект прототипа животного, чтобы наследование было завершено.
Cat.Prototype = Animal.Prototype; Catcat.prototype.constructor = cat; var cat1 = new Cat («большие волосы», «желтый»); предупреждение (cat1.species); // животные
По сравнению с первым методом преимущество в том, что оно относительно эффективно (нет необходимости выполнять и создавать экземпляры животных) и больше экономит память. Недостатком является то, что Cat.Prototype и Animal.Protototyp теперь указывают на тот же объект, поэтому любая модификация Cat.Prototype будет отражена у животных. Прототип.
Таким образом, приведенный выше код на самом деле проблематичен. Пожалуйста, посмотрите вторую строку
1.cat.prototype.constructor = cat;
Это предложение фактически изменило атрибут конструктора Animal.Prototype объекта!
1. alert (Animal.Prototype.constructor); // Кот
4. Используйте пустые объекты в качестве посредника
Поскольку «прямое наследование прототипа» имеет вышеупомянутые недостатки, пустой объект может использоваться в качестве посредника.
var f = function () {}; F.Prototype = Animal.Prototype; Cat.prototype = new f (); Cat.prototype.constructor = cat;F - пустой объект, поэтому он почти не занимает память. В настоящее время модификация объекта прототипа CAT не повлияет на объект прототипа животных.
1. alert (Animal.Prototype.constructor); // животное
5. Функция инкапсуляции в режиме прототипа
Мы инкапсулируем приведенный выше метод в функцию для легкого использования.
Функция Extend (ребенок, родитель) {var f = function () {}; F.prototype = parent.prototype; Child.prototype = new f (); Child.prototype.constructor = ребенок; Child.Uber = Parent.Prototype; }При его использовании метод выглядит следующим образом
расширить (кошка, животное); var cat1 = new Cat («большие волосы», «желтый»); предупреждение (cat1.species); // животное
Эта функция расширения является методом того, как библиотека Yui реализует наследование.
Кроме того, позвольте мне объяснить это. Последняя строка тела функции
1. Child.Uber = Parent.Prototype;
Это означает установление атрибута Uber для детского объекта, который напрямую указывает на атрибут прототипа родительского объекта. Это эквивалентно открытию канала на дочернем объекте и непосредственно вызове метода родительского объекта. Эта линия размещена здесь только для достижения полноты наследования и является исключительно запасной собственностью.
6. Копировать наследство
Выше приведено использовать объекты прототипа для реализации наследования. Мы также можем изменить наше мышление и использовать метод «копии» для достижения наследования. Проще говоря, если все свойства и методы родительского объекта скопированы в дочерний объект, нельзя наследовать?
Прежде всего, поместите все неизменные свойства животных на свой объект прототипа.
1.function Animal () {}
2. animal.prototype.species = "Animal";
Затем напишите еще одну функцию для достижения цели копирования свойства.
Функция extend2 (ребенок, родитель) {var p = parent.prototype; var c = child.prototype; for (var i in p) {c [i] = p [i]; } c.Uber = p; }Функция этой функции состоит в том, чтобы скопировать свойства в объекте прототипа родительского объекта в объект прототипа дочернего объекта один за другим.
При его использовании напишите это:
extend2 (кошка, животное); var cat1 = new Cat («большие волосы», «желтый»); предупреждение (cat1.species); // животное
Приведенная выше статья углубленный анализ объектно-ориентированного программирования в JavaScript-это все контент, которым я делюсь с вами. Я надеюсь, что это может дать вам ссылку, и я надеюсь, что вы сможете поддержать Wulin.com больше.