У меня есть суперкласс:
// SUPERCLASS
var toWalk = function(bottom, right, space) {
this.$node = $('<span class="walker"></span>');
this.space = space;
this.step();
this.setPosition(bottom, right);
};
toWalk.prototype.step = function() {
setTimeout(this.step.bind(this), this.space);
};
toWalk.prototype.setPosition = function(bottom, right) {
var styleSettings = {
bottom: bottom,
right: right
};
this.$node.css(styleSettings);
};
Это в основном устанавливает диапазон ходунков, в котором идет персонаж. класс walker имеет свой собственный CSS. И теперь то, что я хочу достичь, - это переопределить его CSS, а также его позицию (снизу и справа), так что я сделал то, что в моем новом экземпляре я надел новый узел с бегуном класса, у которого тоже есть собственный CSS аргументы суперкласса экземпляра, но это не переопределяет то, что у меня есть на суперклассе в этом новом экземпляре.
// SUBCLASS
var toRun = function(bottom, right, space) {
this.$node = $('<span class="runner"></span>');
toWalk.apply(this, arguments);
};
toRun.prototype = Object.create(toWalk.prototype);
toRun.prototype.constructor = toRun;
toRun.prototype.step = function() {
toWalk.prototype.step.call(this);
this.$node.toggleClass('size');
};
toWalk.prototype.setPosition = function(bottom, right) {
var styleSettings = {
bottom: bottom,
right: right
};
this.$node.css(styleSettings);
};
Любая идея, что я делаю неправильно? Как я могу также переопределить позицию, такую как нижняя и правая?
Измените конструктор подкласса на...
var toRun = function(bottom, right, space) {
toWalk.apply(this, arguments);
this.$node = $('<span class="runner"></span>');
};
Обратите внимание, что я поменял порядок, поэтому вы переопределяете this.$node
После вызова супер. Прежде чем вы объявляете this.$node
а затем вызываете конструктор (с тем же this
), и он переопределяет то, что вы только что установили в this.$node
class
теперь доступно в большинстве современных браузеров и будет гораздо более знакомым developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…