На типичном объектно-ориентированном языке, таком как Java, существует концепция класса. Класс - это шаблон объекта, а объект является экземпляром класса. Однако в языковой системе JavaScript не существует концепции класса. JavaScript не основан на «классе», но реализуется с помощью конструкторов и цепочек прототипа. Тем не менее, ES6 предоставляет метод написания, который ближе к традиционным языкам, вводя концепцию класса (класс) в качестве шаблона объекта. Через ключевое слово класса вы можете определить класс. По сути, класс ES6 можно рассматривать как просто синтаксический сахар. Большинство его функций могут быть достигнуты с помощью ES5. Новый метод написания класса только делает объект прототипа, написанным более ясным и более похожим на объектно-ориентированный синтаксис программирования.
Согласно моей привычке, я дам каталог статьи перед тем, как написать его.
Следующее содержание будет разделено на следующие подразделы:
1. Краткое введение в конструкторы
2. минусы конструкторов
3. Роль атрибута прототипа
4. Прототип цепочка
5. Атрибут конструктора
5.1: роль атрибута конструктора
6. экземпляр оператора
1. Краткое введение в конструкторы
В моей статье о тесных отношениях между конструкторами и новыми командами в JavaScript концепция и характеристики конструкторов, принципы и использование новых команд и т. Д. Если вы не знакомы с конструкторами, вы можете пойти и осторожно насладиться их. Вот простой обзор.
Так называемый конструктор-это функция, которая обеспечивает шаблон для генерации объекта и описывает основную структуру объекта. Конструктор может генерировать несколько объектов, каждый с одной и той же структурой. В целом, конструктор является шаблоном для объекта, а объект является экземпляром конструктора.
Характеристики конструктора:
A: Первая буква названия функции конструктора должна быть загладной измерения.
B: Используйте этот объект внутренне, чтобы указать на экземпляр объекта, который будет сгенерирован.
C: Используйте новый оператор, чтобы вызвать конструктор и вернуть экземпляр объекта.
Давайте посмотрим на самый простой пример.
function person () {this.name = 'keith';} var boy = new Person (); console.log (boy.name); // 'keith'2. минусы конструкторов
Все объекты экземпляра могут наследовать свойства и методы в конструкторе. Однако свойства не могут быть переданы между теми же экземплярами объекта.
Функция Person (имя, высота) {this.name = name; this.height = высота; this.hobby = function () {return 'смотреть фильмы';}} var boy = new Person ('keith', 180); var Girl = новый человек ('Rascal', 153); console.log (boy.name); // 'keith' console.log (Girl.name); // 'rascal' console.log (boy.hobby === Girl.hobby); //ЛОЖЬВ приведенном выше коде у человека конструктора генерирует два экземпляра объекта, мальчик и девочка, и обладает двумя свойствами и методом. Тем не менее, их хобби -метод отличается. То есть всякий раз, когда вы используете новый для вызова конструктора, чтобы вернуть его экземпляр объекта, будет создан метод хобби. Это не необходимо и не пустая трата ресурсов, потому что все методы хобби являются детским поведением и могут быть полностью разделены двумя предметными экземплярами.
Следовательно, недостаток конструкторов заключается в том, что свойства или методы не могут быть разделены между экземплярами объекта того же конструктора.
3. Роль атрибута прототипа
Чтобы решить недостаток в том, что они не могут делиться свойствами между экземплярами объектов конструкторов, JS предоставляет атрибуты прототипа.
Каждый тип данных в JS является объектом (кроме нулевого и неопределенного), и каждый объект наследует от другого объекта, последний называется «прототип» объектом, за исключением нулевого, который не имеет своего собственного объекта -прототипа.
Все свойства и методы на объекте прототипа будут переданы экземпляром объекта.
Когда экземпляр объекта генерируется через конструктор, прототип экземпляра объекта указывается на свойство прототипа конструктора. Каждый конструктор имеет атрибут прототипа, который является объектом прототипа экземпляра объекта.
Функция Person (имя, высота) {this.name = name; this.height = высота; } Person.prototype.hobby = function () {return 'Смотреть фильмы'; } var Boy = новый человек ('keith', 180); var Girl = новый человек ('Rascal', 153); console.log (boy.name); // 'keith' console.log (Girl.name); // 'rascal' console.log (boy.hobby === Girl.hobby); //истинныйВ приведенном выше коде, если метод хобби помещается в объект прототипа, то оба объекта экземпляра имеют один и тот же метод. Я надеюсь, что каждый может понять, что для конструкторов прототип является свойством как конструктором; Для экземпляров объекта прототип является прототипом объекта экземпляров объекта. Следовательно, прототип является свойством и объектом.
Прототип объектов не является свойствами экземпляров объектов. Атрибуты экземпляра объекта являются атрибутами, унаследованными от определения конструктора, поскольку внутри конструктора есть ключевое слово, которое указывает на сгенерированный экземпляр объекта. Свойства экземпляра объекта на самом деле являются атрибутами, определенными внутри конструктора. Пока свойства и методы на объекте прототипа изменяются, изменения будут немедленно отражены во всех экземплярах объектов.
Person.prototype.hobby = function () {return 'плавание'; } console.log (boy.hobby === Girl.hobby); // true console.log (boy.hobby ()); // 'плавание' console.log (Girl.hobby ()); // 'плавание'В приведенном выше коде, после изменения метода хобби объекта прототипа, оба экземпляра объекта изменились. Это связано с тем, что экземпляры объектов на самом деле не имеют хобби -методов, это все методы хобби, которые читают объекты прототипа. То есть, когда экземпляр объекта не имеет свойства и метода, он будет искать на объекте прототипа. Если сам объект экземпляра имеет определенное свойство или метод, он не будет искать в объекте прототипа.
boy.hobby = function () {return 'play баскетбол'; } console.log (boy.hobby ()); // 'Play Basketball' console.log (Girl.hobby ()); // 'плавание'В приведенном выше коде, когда модифицирован метод хобби объекта мальчика, метод хобби на объекте прототипа не будет унаследован. Тем не менее, девушка все еще будет наследовать метод объекта прототипа.
Суммировать:
A: Функция объекта прототипа заключается в определении свойств и методов, разделенных всеми экземплярами объекта.
B: Прототип, для конструкторов, это свойство; Для экземпляров объекта это объект прототипа.
4. Прототип цепочек
Свойства и методы объекта могут быть определены само по себе или в его объекте -прототипе. Поскольку сам объект прототипа является объектом для экземпляров объекта, и он также имеет свой собственный прототип, создается цепочка прототипа. Например, объект A является прототипом объекта B, объект B является прототипом объекта C и т. Д. Верхняя часть прототипа всех объектов является объект.
Конечно, объект Object.Prototype также имеет свой собственный объект прототипа, то есть нулевой объект без каких -либо атрибутов и методов, а нулевый объект не имеет своего собственного прототипа.
1 console.log (object.getPrototypeof (object.prototype)); //нулевой
2 console.log (person.prototype.isprototypeof (мальчик)) // true
Характеристики прототиповых цепей:
A: При чтении определенного свойства объекта двигатель JavaScript сначала ищет свойство самого объекта. Если его нельзя найти, он пойдет на свой прототип. Если его все еще не найден, он пойдет на прототип прототипа. Если объект. Прототип на верхнем уровне до сих пор не найден, не определяется.
B: Если сам объект и его прототип определяют атрибут с тем же именем, то сначала читаются атрибуты самого объекта, который называется «переопределение».
C: В поисках определенного атрибута на уровне цепи прототипа вверх оказывает влияние на производительность. Чем выше уровень объекта прототипа, который вы ищете, тем больше влияние на производительность. Если вы ищете несуществующее свойство, оно пройдет всю цепь прототипа.
Может быть неясно смотреть на эту концепцию, давайте приведем пример. Но действительно важно понять концепцию.
var arr = [1,2,3]; console.log (arr.length); //3console.log (arr.valueof ()) // [1,2,3] console.log (arr.join ('|')) // 1 | 2 | 3В приведенном выше коде определяется массив ARR, с тремя элементами в массиве. Мы не добавляли никаких атрибутов или методов в массив, но мы не сообщили об ошибке при вызове длины, join () и valueof ().
Атрибут длины наследуется от массива. Прототип и принадлежит свойству на объекте прототипа. Метод соединения также унаследован от массива. Прототип и принадлежит методу на объекте прототипа. Эти два метода разделяются всеми массивами. Когда на объекте экземпляра нет атрибута длины, объект прототипа будет искать.
Метод значения унаследован от Object.prototype. Прежде всего, массив ARR не имеет значения метода, поэтому ищите массив объектов прототипа. Прототип. Затем я обнаружил, что нет значения метода на Array.prototype объект. Наконец, посмотрите объект объекта. Прототип объект.
Давайте посмотрим на свойства и методы объекта массива.
console.log(Object.getOwnPropertyNames(Array.prototype))//["length", "toSource", "toString", "toLocaleString", "join", "reverse", "sort", "push", "pop", "shift", "unshift", "splice", "concat", "slice", "lastIndexOf", "indexOf", "forEach", «Карта», «Фильтр», «Reduceright», «Some», «каждый», «найти», «findIndex», «copyWithin», «Fill», «Записи», «Ключи», «Ключи», «Значения», «Включает», «Конструктор», «$ set», "$ remove"] console.Log (objectOwnPortypryprotyprotyprotyprotyprotyplotyprotyprototyprototyprotyprotyprotyprotyplotyprotyplotyprotyplotyplotyprotyprotyplotop «Tostring», «Tolocalestring», «Valueof», «Watch», «Unutatch», «HasownProperty», «Isprototypeof», «ProperateIsEnumerable», «__definegetter__», «__definesetter__», «__lookgetter__», «__lookupsetter__», «__», «__», «__», «__», «__», «__», «__lookgetter__», «__», «__loupgetter__», «__», «__lookgetter__».
Я считаю, что когда вы видите это, у вас все еще есть очень небольшое понимание прототипа. Это нормально. В конце концов, это более важная и абстрактная концепция в JS. Невозможно освоить это так быстро. Если вы съели еще несколько статей, вы можете овладеть сущностью. Определенным образом есть живой пример, который также может быть проблемой, с которой каждый столкнется. Вы можете взглянуть на конструктор JS и прототип объектов.
5. Атрибут конструктора
Объект прототипа имеет атрибут конструктора, который указывает на функцию конструктора, где объект прототипа расположен по умолчанию.
функция a () {}; console.log (a.prototype.constructor === a) // trueСледует отметить, что прототип является свойством конструктора, а конструктор является объектом, на который указывает свойство прототипа конструктора, то есть свойство объекта прототипа. Будьте осторожны, чтобы не запутать.
console.log (a.hasownproperty ('прототип')); // true console.log (a.prototype.hashownproperty ('constructor')); //истинныйПоскольку атрибут конструктора определяется на объекте прототипа, это означает, что он может быть унаследован всеми объектами экземпляра.
функция a () {}; var a = new a (); console.log (a.constructor); //A() console.log(a.constructor===a.prototype.constructor);//trueВ приведенном выше коде a является объектом экземпляра конструктора A, но сам A не имеет атрибута конструктора, который фактически читает цепочку прототипа.
A.Prototype.Constructor Property.
5.1: роль атрибута конструктора
A: Определите, какая функция конструктора является прототипом объектом, принадлежащим
функция a () {}; var a = new a (); console.log (a.constructor === a) // true console.log (a.constructor === Массив) // НеверноПриведенный выше код означает, что использование свойства конструктора определяется, что функция конструктора объекта экземпляра A - это A, а не массив.
B: Создайте другой экземпляр из экземпляра
функция a () {}; var a = new a (); var b = new a.constructor (); console.log (b -экземпляр a); //истинныйВ приведенном выше коде a является объектом экземпляра конструктора A, и конструктор может быть косвенно вызван от A.Constructor.
C: Можно назвать свой собственный конструктор
A.prototype.hello = function () {return new this.constructor (); }D: обеспечивает шаблон наследства другого конструктора от конструктора
function wation () {} function son () {son.height.constructor.call (this); } Son.height = new отца ();В приведенном выше коде отец и сын являются конструкторами. Призвание отца на этом внутри сына сформирует эффект от унаследованного сына отца.
E: Поскольку атрибут конструктора является взаимосвязью между объектом прототипа и конструктором при изменении объекта прототипа, вы должны обратить внимание на задачу указания конструктора.
Существует два решения: либо укажите атрибут конструктора к исходной функции конструктора, либо просто добавьте свойства и методы в объект прототипа, чтобы избежать экземпляра искажения.
6. экземпляр оператора
Оператор экземпляра возвращает логическое значение, указывающее, является ли указанный объект экземпляром конструктора.
функция a () {}; var a = new a (); console.log (экземпляр a); //истинныйПоскольку экземпляры действительны для объектов во всей цепочке прототипа, один и тот же объект экземпляра может вернуть истину для нескольких конструкторов.
функция a () {}; var a = new a (); console.log (экземпляр a); //trueconsole.log(a exanceof object); //истинныйОбратите внимание, что экземпляры объектов могут использоваться только для сложных типов данных (массивы, объектов и т. Д.) И не может использоваться для простых типов данных (логические значения, числа, строки и т. Д.).
var x = [1]; var O = {}; var b = true; var c = 'string'; console.log (x экземпляр массива); //trueconsole.log(O EncementOf Object); // true console.log (b exactionof boolean); //falseconsole.log(c экземпляр строки); //ЛОЖЬКроме того, ни нулевые, ни неопределенные являются объектами, поэтому экземпляр всегда возвращает false.
console.log (null ancementof object); // false console.log (неопределенный экземпляр объекта); //ЛОЖЬ
Используя оператор экземпляра, вы также можете умело решить проблему забыть о добавлении новой команды при вызове конструктора.
Функция keith (name, height) {if (! Этот экземпляр keith) {return new keith (name, height); } this.name = name; this.height = height;}В приведенном выше коде экземпляр оператора используется для определения того, указывает ли ключевое слово в корпусе функции на экземпляр конструктора Keith. Если нет, это означает, что новая команда забыта. В настоящее время конструктор вернет экземпляр объекта, чтобы избежать неожиданных результатов.
Из -за ограничений пространства я представлю его здесь на данный момент.
В моей следующей акции я расскажу о некоторых нативных методах прототипа объектов, таких как object.getPrototypeof (), object.setPrototypeof () и т. Д., И введу сравнение методов получения нативных объектов.
Выше приведено подробное объяснение атрибута прототипа (рекомендуется) в JavaScript, представленный вам редактором. Я надеюсь, что это будет полезно для вас.