2015-06-20 6 views
0

Я создал несколько классов/объектов для некоторых анимаций. Я создал класс под названием Navigation() и еще один класс под названием Stars(). Каждый из классов имеет свои собственные методы и связанные с ними объекты. Я создал метод в классе Navigation(), который пытается запустить метод и связанный с ним объект. Метод класса «Навигация» не будет запускать метод «Звезды». Снова я не называю метод класса Stars с объектом класса навигации. Я пытаюсь вызвать метод объекта Stars из метода навигационного класса, если это имеет смысл. Я новичок в OOP javascript, и у меня возникают проблемы с пониманием терминологии этой проблемы, чтобы исследовать ее. Если есть какие-то другие обсуждения, статьи или темы, чтобы указать мне тоже, что было бы высоко оценено. Или просто общий ответ на эту проблему.Вызов объекта и его метода из другого метода класса объекта

//Problem is in the Navigation class method spaceWarp() 
function Navigation(selector){//Navigation Class 
    this.selector = selector; 

this.spaceWarp = function(selector1,selector2,speed1,speed2,speed3,speed4,delay1,delay2){//spaceWarp Method function 
    var button = $(selector); 
    var starFrame =$(selector1); 
    var frameSpeed = speed1; 
    var delay1 = delay1; 
    var spaceBK = $(selector2); 
    var bkTime = speed2; 
    var starSpeed = speed3; 
    var delay2 = delay2; 
    var stopStarSpeed = speed4; 

    button.click(function(){ 
     starFrame.velocity({'top': '0vh'},frameSpeed);//works 
     setTimeout(function() { 
      spaceBK.velocity('fadeIn',{duration: bkTime});//works 
      stars1.flyingStars(starSpeed);//does not work 
      stars2.flyingStars(starSpeed * 1.5);//does not work 
      stars3.flyingStars(starSpeed * 2.5);//does not work 
     }, delay1); 
     setTimeout(function() { 
      stars1.stopStars(stopStarSpeed);//does not work 
      stars1.stopStars(stopStarSpeed);//does not work 
      stars1.stopStars(stopStarSpeed);//does not work 
     }, delay2); 
    }); 
};//End spaceWarp Method 
}//End Navigation Class 

function Stars(selector){//Star Class 

this.selector = selector; 
this.stopStars = function(speed){//stopStars method 
    var object = $(selector); 
    object.css('background-position-y', '0vh'); 
    object.velocity({'background-position-y': '100vh'},speed,'easeOutCubic'); 
    object.velocity('stop'); 
}; 
this.flyingStars = function(speed){ 
    var self = this; 
    var object = $(self.selector); 
    var callback = function(){self.flyingStars(speed);}; 
    object.css('background-position-y', '0vh'); 
    object.velocity({'background-position-y': '100vh'},speed,'linear',callback); 
}; 
}//End Star Class 
//Initialize objects 
var spaceButton = new Navigation('#spaceWarp'); 
var stars1 = new Stars('#stars1'); 
var stars2 = new Stars('#stars2'); 
var stars3 = new Stars('#stars3'); 
//run object 
spaceButton.spaceWarp('#starFrame','#spaceBK','3000','3500','3000','6000','2100','7000'); 
+0

Там, кажется, много кода отсутствует. Например, что такое '' 'здесь? Кажется, вы каким-то образом смешиваете операции DOM со своими собственными классами. Допустим, '' 'находит элементы DOM, соответствующие селектору, тогда' $ ('# stars1') 'найдет элемент DOM с этим идентификатором. Элементы DOM не имеют метода 'flyingStars'. Если вы хотите обратиться к объекту, который вы создали с помощью функции «var stars1 = new Stars ('# stars1');', то вы не можете использовать DOM-селектора для этого, так как это не элемент DOM. Вместо этого вы должны передать 'stars1' непосредственно функции. –

+0

Спасибо, я только что понял это. Мне нужно было передать объект в качестве параметра. :) Благодарю за ваш ответ. –

ответ

0

Добро пожаловать в мир JavaScript, где вы не используете его, чтобы просто рисовать и перемещает коробки :)

Coming на ваш вопрос:

//Initialize objects 
var spaceButton = new Navigation('#spaceWarp'); 
var stars1 = new Stars('#stars1'); 
var stars2 = new Stars('#stars2'); 
var stars3 = new Stars('#stars3'); 

инициализации ваших объектов велики , но вот вызов. Как вы делаете stars1, stars2 и stars3 доступны для объекта spaceButton? В рамках этого объекта stars1, stars2 и stars3 являются неопределенными переменными. Если ваши объекты доступны по всему миру, проверьте этот оператор.

Доступ к starsX объект через this.starsX

Вам необходимо будет обновить функцию с тремя ссылками.

this.spaceWarp = function(selector1,selector2,speed1,speed2,speed3,speed4,delay1,delay2, stars1, stars2, stars3){//spaceWarp Method function 
var button = $(selector); 
var starFrame =$(selector1); 
var frameSpeed = speed1; 
var delay1 = delay1; 
var spaceBK = $(selector2); 
var bkTime = speed2; 
var starSpeed = speed3; 
var delay2 = delay2; 
var stopStarSpeed = speed4; 
var stars1 = stars1; 
var stars2 = stars2; 
var stars3 = stars3; 

button.click(function(){ 
    starFrame.velocity({'top': '0vh'},frameSpeed);//works 
    setTimeout(function() { 
     spaceBK.velocity('fadeIn',{duration: bkTime});//works 
     stars1.flyingStars(starSpeed);//does not work 
     stars2.flyingStars(starSpeed * 1.5);//does not work but now starsX exists 
     stars3.flyingStars(starSpeed * 2.5);//does not work 
    }, delay1); 
    setTimeout(function() { 
     stars1.stopStars(stopStarSpeed);//does not work 
     stars1.stopStars(stopStarSpeed);//does not work 
     stars1.stopStars(stopStarSpeed);//does not work 
    }, delay2); 
}); 
};//End spaceWarp Method 

И вызовите функцию, передавая ссылки ваших starsX объектов

spaceButton.spaceWarp('#starFrame','#spaceBK','3000','3500','3000','6000','2100','7000', stars1, stars2, stars3);

+0

Благодарим вас! Ваш пример действительно помог мне. Я не понимал, что вам нужно передать объект в качестве параметра. Область действительно помогает мне иногда особенно в ООП. Теперь он отлично работает! –

Смежные вопросы