представлять
Четыре режима повторного использования кода, представленные в этой статье, являются лучшими практиками и рекомендуются всем в процессе программирования.
Паттерн 1: Прототип наследование
Прототип наследование состоит в том, чтобы позволить родительскому объекту быть прототипом дочернего объекта, чтобы достичь цели наследования:
Кода -копия выглядит следующим образом:
Функциональный объект (O) {
функция f () {
}
F.Prototype = O;
вернуть новый f ();
}
// родительский объект наследовать
var parent = {
Имя: "Папа"
};
// новый объект
var Child = Object (Parent);
// тест
console.log (child.name); // "Папа"
// родительский конструктор
функция Person () {
// собственная собственность
this.name = "Adam";
}
// Добавить новые атрибуты в прототип
Person.prototype.getName = function () {
вернуть это. name;
};
// Создать нового человека
var papa = new Person ();
// Наследование
var Kid = Object (PAPA);
console.log (kid.getName ()); // "Адам"
// родительский конструктор
функция Person () {
// собственная собственность
this.name = "Adam";
}
// Добавить новые атрибуты в прототип
Person.prototype.getName = function () {
вернуть это. name;
};
// Наследование
var kid = object (person.prototype);
console.log (typeof Kid.getName); // "функция", потому что она определена в прототипе
console.log (typeof Kid.name); // "неопределенное", потому что только прототип наследуется
В то же время, Ecmascript5 также предоставляет аналогичный метод, называемый object.create для наследственных объектов, а использование выглядит следующим образом:
Кода -копия выглядит следующим образом:
/* Используйте новую версию Ecmascript 5 для предоставления функций*/
var Child = object.create (parent);
var Child = object.create (родитель, {
Возраст: {значение: 2} // дескриптор ECMA5
});
console.log (Child.hashownproperty («Возраст»)); // истинный
Кроме того, свойства также могут быть определены на втором параметре более мелкозернистым образом:
Кода -копия выглядит следующим образом:
// сначала определите нового объекта человека
var man = object.create (null);
// Далее создайте настройку конфигурации, содержащую свойства
// Свойства установлены на записи, перечисленные и настраиваемые
var config = {
Записывается: правда,
перечисляется: правда,
настраивается: true
};
// обычно используйте object.defineproperty () для добавления новых свойств (поддержка Ecmascript5)
// Теперь, для удобства, мы настраиваем функцию инкапсуляции
var defineprop = function (obj, key, value) {
config.value = value;
Object.DefineProperty (obj, Key, config);
}
DefineProp (Man, «Car», «Delorean»);
DefineProp (Man, 'Dob', '1981');
DefineProp (Man, 'Beard', false);
Итак, наследство можно сделать:
Кода -копия выглядит следующим образом:
var Driver = object.create (man);
DefineProp (Driver, «Topspeed», «100 миль в час»);
Driver.topspeed // 100 миль в час
Но есть одна вещь, чтобы отметить, то есть прототип объекта, созданный Object.Create (NULL), не определен, то есть нет никаких методов ToString и значения, поэтому ошибка возникнет при оповещении (Man);, но оповещено (man.car); в порядке.
Режим 2: скопируйте все атрибуты для наследства
Наследство таким образом состоит в том, чтобы скопировать все свойства в родительском объекте с дочерним объектом. Как правило, дочерний объект может использовать данные родительского объекта.
Давайте сначала посмотрим на пример мелкого копирования:
Кода -копия выглядит следующим образом:
/* Мелкая копия*/
Функция Extend (родитель, ребенок) {
var i;
Ребенок = ребенок || {};
для (я в родителе) {
if (parent.hashownproperty (i)) {
ребенок [i] = родитель [i];
}
}
Возвращение ребенка;
}
var dad = {name: "Adam"};
var Kid = extend (папа);
console.log (kid.name); // "Адам"
var папа = {
Подсчет: [1, 2, 3],
читает: {Paper: True}
};
var Kid = extend (папа);
kid.counts.push (4);
console.log (dad.counts.tostring ()); // "1,2,3,4"
console.log (dad.reads === Kid.reads); // истинный
На последней строке кода вы можете обнаружить, что чтения папы и ребенка одинаковы, то есть они используют ту же ссылку, которая является проблемой, вызванной мелкой копией.
Давайте посмотрим на глубокую копию:
Кода -копия выглядит следующим образом:
/* Глубокая копия*/
функция extenddeep (родитель, ребенок) {
var i,
tostr = object.prototype.tostring,
Astr = "[объект массива]";
Ребенок = ребенок || {};
для (я в родителе) {
if (parent.hashownproperty (i)) {
if (typeof parent [i] === 'object') {
Ребенок [i] = (tostr.call (parent [i]) === Astr)? []: {};
extenddeep (родитель [i], ребенок [i]);
} еще {
ребенок [i] = родитель [i];
}
}
}
Возвращение ребенка;
}
var папа = {
Подсчет: [1, 2, 3],
читает: {Paper: True}
};
var Kid = extenddeep (папа);
kid.counts.push (4);
console.log (kid.counts.tostring ()); // "1,2,3,4"
console.log (dad.counts.tostring ()); // "1,2,3"
console.log (dad.reads === Kid.reads); // ЛОЖЬ
Kid.reads.paper = false;
После глубокого копирования два значения больше не равны, бинго!
Режим 3: Mix-in
Смешанный в том, чтобы копировать одно или несколько (или все) свойства (или методы) объекта с другим объектом. Давайте приведем пример:
Кода -копия выглядит следующим образом:
function mix () {
var arg, prop, child = {};
for (arg = 0; arg <arguments.length; arg += 1) {
for (rop in arguents [arg]) {
if (Arguments [arg] .hashownproperty (prop)) {
child [prop] = аргументы [arg] [prop];
}
}
}
Возвращение ребенка;
}
var cake = mix (
{яйца: 2, большой: true},
{масло: 1, соленый: true},
{мука: '3 чашки'},
{сахар: 'конечно! }
);
Console.dir (торт);
Функция микса копирует атрибуты ребенка всех параметров, передаваемых в детском объекте, чтобы создать новый объект.
Итак, как мы просто хотим смешать некоторые атрибуты? Как это сделать? Фактически, мы можем использовать дополнительные параметры для определения свойств, которые необходимо смешать, такие как Mix (ребенок, родитель, метод1, метод2), чтобы мы могли смешивать только метод1 и метод 2 в родителе с ребенком. На коде:
Кода -копия выглядит следующим образом:
// Машина
var car = function (settings) {
this.model = settings.model || «Не предоставлена модель»;
this.colour = settings.colour || «Нет цвета»;
};
// микшин
var mixin = function () {};
Mixin.prototype = {
DriveForward: function () {
console.log ('ездить вперед');
},
Drivebackward: function () {
console.log ('ездить назад');
}
};
// Определенные два параметра - это объект, смешанный в (повторный), а объект смешивается (дает)
Функция увеличения (metheObj, withobj) {
// Если указанное имя метода предоставлено, есть 3 дополнительных параметра
if (аргументы [2]) {
for (var i = 2, len = arguments.length; i <len; i ++) {
receivingObj.prototype [Arguments [i]] = withobj.prototype [Arguments [i]];
}
}
// Если вы не указаете третий параметр или больше параметров, все методы будут смешаны
еще {
для (var methodname в предоставлении
// Проверить, что приемный объект не содержит смешанного имени, поэтому, если он включен, он не будет смешан в
if (! receivingObj.prototype [methodname]) {
receivingobj.prototype [methodname] = withobj.prototype [methodname];
}
}
}
}
// Смешайте атрибуты для автомобиля, но значения смешиваются с «DriveForward» и «DriveBackward»*/
дополнение (Car, Mixin, 'DriveForward', 'Drivebackward');
// Создать автомобиль нового объекта
var транспортное средство = новый автомобиль ({модель: 'Ford Escort', Color: 'Blue'});
// метод проверить, успешно ли получено смешивание
athrate.driveforward ();
athrate.drivebackward ();
Этот метод более гибкий в использовании.
Паттерн 4: Метод заимствования
Один объект заимствует один или два метода другого объекта, и между этими двумя объектами нет прямой связи. Не нужно объяснять больше, просто используйте код, чтобы объяснить:
Кода -копия выглядит следующим образом:
var One = {
Имя: «Объект»,
Скажи: функция (приветствие) {
вернуть приветствие + ',' + this.name;
}
};
// тест
console.log (one.say ('hi')); // "Привет, объект"
var two = {
Имя: «Другой объект»
};
console.log (one.say.apply (два, ['hello'])); // "Привет, другой объект"
// Присвоение сказать переменной, это будет указывать на глобальную переменную
var говорит = one.say;
console.log (say ('hoho')); // "Хохо, неопределенное"
// пройти обратный вызов обратного вызова обратного вызова
var ithyanother = {
Имя: «Еще один объект»,
Метод: функция (обратный вызов) {
вернуть обратный вызов ('Hola');
}
};
console.log (ithyanother.method (one.say)); // "holla, неопределенная"
function bind (o, m) {
return function () {
вернуть M.Apply (o, [] .slice.call (аргументы));
};
}
var twosay = bind (два, one.say);
console.log (twosay ('yo')); // "Йо, другой объект"
// Ecmascript 5 добавляет метод bind () в функцию.
if (typeof function.prototype.bind === 'undefined') {
Function.prototype.bind = function (thisArg) {
var fn = это,
slice = array.prototype.slice,
args = slice.call (аргументы, 1);
return function () {
return fn.apply (thisarg, args.concat (slice.call (аргументы)));
};
};
}
var twosay2 = one.say.bind (два);
console.log (twosay2 ('bonjour')); // "Бонджур, другой объект"
var twosay3 = one.say.bind (два, 'enchanté');
console.log (twosay3 ()); // "enchanté, другой объект"
Суммировать
Не нужно суммировать.