[JS] Gebruik van this
Ik ben bezig met wat JS OOP, maar ik heb op dit moment een vraagje.
Er is me nu iets gelukt, maar ik denk dat er betere oplossingen voor zullen zijn. Zoals ik al zij ben ik bezig met wat JS OOP, en ik heb hierbinnen verschillende functies. Zoals dit:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
var Klasse = function () {
this.function_one = function(arg1, arg2) {
alert(arg1 + ' en ' + arg2);
}
this.function_two = {
function_two_one: function(arg1, arg2) {
}
}
}
this.function_one = function(arg1, arg2) {
alert(arg1 + ' en ' + arg2);
}
this.function_two = {
function_two_one: function(arg1, arg2) {
}
}
}
Het probleem was dat ik in function_two_one gebruik wou maken van function_one. Maar this werkt dan natuurlijk niet, dit heb ik simpel opgelost om this in een andere variabele te zetten zoals alsvolgd:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
var Klasse = function () {
var instance = this;
this.function_one = function(arg1, arg2) {
alert(arg1 + ' en ' + arg2);
}
this.function_two = {
function_two_one: function(arg1, arg2) {
instance.function_one(arg1, arg2);
}
}
}
var instance = this;
this.function_one = function(arg1, arg2) {
alert(arg1 + ' en ' + arg2);
}
this.function_two = {
function_two_one: function(arg1, arg2) {
instance.function_one(arg1, arg2);
}
}
}
Zoals je ziet heb ik de this in de variabele instance gezet, zodat ik deze ook in function_two_one kan gebruiken. Dit werkt prima. Maar volgens mij zijn hier betere oplossingen voor? Of heb ik het zo al goed?
Alvast bedankt,
Gr,
Tom
Gewijzigd op 29/09/2010 18:29:48 door Tom Tom
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
//Dit is de class.
var Animation = function(element, name, prefix, suffix, animation, from, to, length) {
console.log("New animation from " + from + " to " + to);
//DIT is een variabele.
//Element that must be animated.
this.element = element;
//Name to identify the animation
this.name = name;
//Nog meer variabelen, die heb ik voor het voorbeeld even weggelaten.
//Een functie is ook gewoon een variabele.
//Start the animation
this.start = function() {
//Again current = from (for if start is called twice, it will restart).
this.current = this.from;
//Add animation to AnimationManager.
this.startTime = animManager.getTime();
this.managerIndex = animManager.addAnimation(this);
this.isAnimated = true;
console.log("Animation '" + this.name + "' started at " + this.current);
}
this.stop = function() {
//Remove animation from AnimationManager.
animManager.removeAnimation(this.managerIndex);
this.isAnimated = false;
console.log("Animation '" + this.name + "' stopped at " + this.current);
}
//En nog meer functies.
this.animate = function(time) {
//Inhoud weggelaten.
}
}
tools = [];
//Andere notatie.
//Every tool must have input variable time, from, to and length.
tools.Animation = {
grow: function(time, from, to, length) {
return (from + ((time + 1) / length) * (to - from));
}
};
//En hier weer een andere class.
//Manages all Animations.
function AnimationManager(delay) {
//Constructor
this.animations = [];
//Enz....
}
me = '';
var Animation = function(element, name, prefix, suffix, animation, from, to, length) {
console.log("New animation from " + from + " to " + to);
//DIT is een variabele.
//Element that must be animated.
this.element = element;
//Name to identify the animation
this.name = name;
//Nog meer variabelen, die heb ik voor het voorbeeld even weggelaten.
//Een functie is ook gewoon een variabele.
//Start the animation
this.start = function() {
//Again current = from (for if start is called twice, it will restart).
this.current = this.from;
//Add animation to AnimationManager.
this.startTime = animManager.getTime();
this.managerIndex = animManager.addAnimation(this);
this.isAnimated = true;
console.log("Animation '" + this.name + "' started at " + this.current);
}
this.stop = function() {
//Remove animation from AnimationManager.
animManager.removeAnimation(this.managerIndex);
this.isAnimated = false;
console.log("Animation '" + this.name + "' stopped at " + this.current);
}
//En nog meer functies.
this.animate = function(time) {
//Inhoud weggelaten.
}
}
tools = [];
//Andere notatie.
//Every tool must have input variable time, from, to and length.
tools.Animation = {
grow: function(time, from, to, length) {
return (from + ((time + 1) / length) * (to - from));
}
};
//En hier weer een andere class.
//Manages all Animations.
function AnimationManager(delay) {
//Constructor
this.animations = [];
//Enz....
}
me = '';