从另一个对象类方法调用对象及其方法
Calling an object and its method from another object class method
我已经为一些动画创建了一些类/对象。 我创建了一个名为 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');
欢迎来到javascript的世界,在这里你不用它来绘画和移动盒子:)
来回答您的问题:
//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
是未定义的变量。如果您的对象全局可用,则通过 this 运算符进行检查。
通过this.starsX
访问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);
相关文章:
- 序列化数据属性中对象的最可靠方法
- 有没有一种方法可以添加相同的项目val=“0”;4〃;到JavaScript中数组的每个对象
- 如何从对象的原型方法访问JavaScript对象属性
- 为什么不推荐使用“with”?是否有更好或其他方法可以“下降”到对象的命名空间
- 设置嵌套对象属性的更好方法
- JQuery示例不起作用-“;对象没有't支持属性或方法'按钮'&”;
- 对象不支持属性或方法“自动完成”
- call()和apply()实际上是用来欺骗方法处理类似数组的对象的
- 对象文字方法上的Javascript绑定不起作用
- Meteor应用程序无法运行-对象#<编译器>没有方法'主机'
- 为什么我可以在Array属性对象中找到Javascript Array for Each方法
- Underscore.js某些对象的所有方法的总和
- 对象#<XMLHttpRequest>没有方法'完成'
- Es6:能够在设置/更新/删除对象属性时调用自定义方法
- 丢失对象“;这个“;方法中的上下文
- 如何在ajax中调用javascript对象的方法
- 为什么页面方法对象未定义
- 如何使用在另一个文件中定义的JavaScript方法/对象
- 如何告诉JsHint忽略“未解析的函数或方法”?对象上的警告
- 使用jinja/javascript动态创建方法/对象