ООП программирование в JavaScript может быть сделано разными способами. Вокруг много узоров.
Я покажу вам два: реализацию наследования объектов и реализацию композиции объектов.
Это не имеет абсолютно никакого отношения к jQuery. jQuery должен использоваться для манипулирования DOM и обработки событий. Вы не должны создавать свои основные объекты и конструкторы на основе объектов jQuery. В игре роль jQuery заключается в чтении ввода с клавиатуры и, при необходимости, рендеринга вашей графики в DOM (если по какой-то причине вы не используете <canvas>).
Живой пример
Наследование
var Constructor = function(name) {
this.name = name
};
Constructor.prototype.mymethod = function() {
alert("my name is : " + this.name);
};
var obj = new Constructor("foo");
obj.mymethod(); // my name is : foo
Здесь мы определяли функцию Constructor, которую можно вызывать для создания нового объекта. Вы обращаетесь к объекту внутри конструктора с помощью this.
Вы можете добавить (статические) методы и переменные в прототип Конструктора, которые будут наследоваться объектом.
function inherits(child, parent) {
var f = new Function;
f.prototype = parent.prototype;
f.prototype.constructor = parent;
child.prototype = new f;
child.prototype.constructor = child;
}
Вы можете использовать функцию inherits, которая устанавливает прототип функции конструктора для экземпляра другого конструктора. Это означает, что все методы и свойства этого родительского объекта доступны на дочернем объекте
var SecondConstructor = function(name) {
this.name = name + "bar";
};
inherits(SecondConstructor, Constructor);
var obj = new SecondConstructor("foo");
obj.mymethod(); // my name is : foobar
Это прототипное наследование JavaScripts. По сути, вы устанавливаете прототип функции для конкретного объекта. Затем, когда вы используете функцию для создания объектов, эти объекты реализуют прототип.
Состав
Использование прототипа на самом деле не обязательно, вместо него можно использовать композицию объектов. Этот метод требует хорошего понимания состояния this, о котором вы можете прочитать в другом месте .
Я собираюсь обмануть и делегировать некоторые утомительные вспомогательные функции underscore.js
var Constructor = function(name) {
this.name = name;
this.mymethod = function() {
alert("my name is : " + this.name);
};
};
var SecondConstructor = function(name) {
var constructor = new Constructor(name + "bar");
_.bindAll(constructor);
_.extend(this, {
"mymethod": constructor.mymethod
});
};
var obj = new SecondConstructor("foo");
obj.mymethod();
Здесь SecondConstructor создает экземпляр Constructor для себя, а не наследует его. Затем он связывает ссылку this на все методы этого объекта-конструктора, чтобы мы могли делегировать вызов mymethod нашему собственному объекту-конструктору. Это работает только для методов, но это не должно быть проблемой, потому что у вас действительно не должно быть открытых полей.