Расширение javascript объекта

Question

В настоящее время я работаю над движком платформы, используя javascript и холст HTML5.

У меня есть объект, «платформа», которая выглядит примерно так ...

var platform = function(pid,px,py,pw,ph) { 
    //Some variables here... and then we have some functions  
    this.step = function() { 
    //Update/step events here 
    } 
    this.draw = function() { 
    //Drawing events here 
    } 
    //etc. 
} 

Функция шаг() имеет все расчеты для обнаружения столкновений в то время как функция Жеребьевка() рисует платформу.

Что я хочу сделать, это сделать еще один объект под названием movingPlatform. Это будет почти идентично текущей платформе, за исключением того, что этот движется.

Вместо копирования всех кодов обнаружения столкновений я хотел бы иметь возможность расширить movingPlatform с платформы ... и затем иметь возможность добавить дополнительный код в функцию step() на движущуюся платформу. хорошо ... двигаться.

Некоторая дополнительная информация ...

Когда игра загружается, он генерирует уровень, используя данные из файла CSV. У меня есть массив, платформы [], который хранит все платформы внутри него.

Так, чтобы создать платформу это выглядит так ...

platforms.push(new platform(i,data[1],data[2],data[3],data[4])); 

Я тогда сделать платформы выполнить их шаг и сделать событие во время основного этапа игры и рисовать события.

т.е.

for(var i=0; i<platforms.length; i++) { 
platforms[i].step(); 
} 

Любая помощь будет удивительным. Благодаря!

Answer 1

Я бы использовал класс платформы как «базовый» объект для движущегося объекта платформы. Я бы сделал это через прототип, который является реализацией JavaScript объектно-ориентированного программирования.

Подробнее здесь How does JavaScript .prototype work? + еще много статей в Интернете

Answer 2

Вы можете использовать Javascript функциональность наследования прототип:

var baseItem = { 
    push: function(){alert('push');}, 
    pull: function(){alert('pull')} 
} 

var childItem = {} 
childItem.prototype = baseItem; 

childItem.push = function(){ 
    //call base function 
    childItem.prototype.push.call(this); 

    //do your custom stuff. 
    alert('I did it again.'); 
} 

childItem.push(); 

Fiddle

Answer 3

Получение права наследования в JavaScript, несколько сложнее, если вам 'используется для языков на основе классов.

Если вы не используете много способов поведения, вам может быть проще просто создать некоторые общие методы, а затем сделать их доступными для объектов каждого типа платформы.

//Create constructors for each type 
var Platform = function(pid,px,py,pw,ph) { //By convention, constructors should start with an uppercase character 
    ... 
} 

var MovingPlatform = function() { 
    ... 
} 

//Create some reuseable methods 
var step = function() { 
    ... 
} 
var draw = function() { 
    ... 
} 
var move = function() { 
    ... 
} 

//Attach your methods to the prototypes for each constructor 
Platform.prototype.step = step; 
Platform.prototype.draw = draw; 

MovingPlatform.prototype.step = step; 
MovingPlatform.prototype.draw = draw; 
MovingPlatform.prototype.move = move; 

...etc 

Тем не менее, если вы хотите создать правильную цепочку наследования, есть множество статей, которые помогут вам: 1234

Answer 4

Вместо чистого наследования, здесь, я бы идти с прототипом-расширением, если вы не построите какую-то большую уродливую фабрику, просто ради того, чтобы сказать, что «MovingPlatform» унаследована от «Платформы» в чистом смысле, на самом деле это не так, как вы ожидали.

Есть несколько проблем (обман, для одного), но если ваши объекты полностью основаны на this, и вы в порядке с людьми, потенциально взломанными в консоли, тогда вам действительно нечего беспокоюсь о.

Во-первых, понять, что вы делаете внутри Platform:

var MyObject = function (a) { 
    this.property = a; 
    this.method = function (b) { this.property += b; }; 
}; 

Каждый раз, когда вы делаете новый MyObject, вы создаете новую версию функции .method.
То есть, если вы сделаете 10 000 из них, будет также 10 000 копий этой функции.
Иногда это очень хорошая и безопасная вещь.
Это также может быть очень медленная вещь.

Проблема заключается в том, что все в вашем объекте использует this, и поскольку ничего внутри функции не изменяется, нет никакой пользы для создания новых копий - просто дополнительная память.

... так:

MyObject = function (a) { 
    this.property = a; 
}; 
MyObject.prototype.method = function (b) { this.property += b; }; 

var o = new MyObject(1); 
o.method(2); 
o.property; //3 

Когда вы звоните new X, где X имеет свойства/методы по своему прототипу, те свойства/методы копируются на объект, во время его строительства.

Было бы так же, как происходит:

var method = function (b) { this.property += b; }, 
    o = new MyObject(1); 

o.method = method; 
o.method(2); 
o.property; // 3 

За исключением без дополнительной работы делать это самостоятельно, вручную.
Преимущества здесь в том, что каждый объект использует ту же функцию.
Они в основном передают функции доступ ко всему их this, и функция может делать с ней все, что захочет.

Там подвох:

var OtherObj = function (a, b) { 
    var private_property = b, 
     private_method = function() { return private_property; }; 

    this.public_property = a; 
    this.unshared_method = function() { var private_value = private_method(); return private_value; }; 
}; 

OtherObj.prototype.public_method = function() { 
    return private_property; 
}; 

var obj = new OtherObj(1, "hidden"); 

obj.public_property; // 1 
obj.unshared_method(); // "hidden" 
obj.public_method(); // err -- private_property doesn't exist 

Так если вы не имеете много вы заботитесь о пребывании частных, самый простой способ сделать это было бы сделать многоразовую функцию, которая полагается на this, который затем предоставить несколько прототипов через расширение.

// collision-handling 
var testCollision = function (target) { this./*...*/ }, 
    handleCollision = function (obj) { this./* ... */ }; 

// movement-handling 
var movePlatform = function (x, y, elapsed) { this.x += this.speed.x*elapsed; /*...*/ }; 
// not really the cleanest timestep implementation, but it'll do for examples 


var Platform = function (texture, x, y, w, h) { 
     this.x = x; 
     // ... 
    }, 
    MovingPlatform = function (texture, x, y, w, h, speedX, speedY, etc) { 
     this.etc = etc;//... 
    }; 


Platform.prototype.testCollision = testCollision; 
Platform.prototype.handleCollision = handleCollision; 

MovingPlatform.prototype. // both of the above, plus the movePlatform method 

Это очень много.
Именно поэтому функции в разных библиотеках будут clone или extend объектов.

var bunchOfComponents = { 
    a : function() { }, 
    b : 32, 
    c : { } 
}, 

myObj = {}; 

copy(myObj, bunchOfComponents); 

myObj.a(); 
myObj.b; //32 

Вашей функция повторного использования идет вверх, в то время как ужас написания собственного класса на основе иерархического наследования, с виртуальными переопределениями, рефератами и разделяемым частной собственностью, от руки, идет вниз.