[英]OOP Javascript parent Object method or Object?
var O = {
elements: {
main: function() { return jQuery("#main"); },
footer: function() { return jQuery("#footer"); }
},
main: function(html) {
return (this.elements.main());
},
style: {
setMaincolor: function() {
// TypeError: Cannot call method 'main' of undefined
return (this.elements.main());
}
}
};
so; 所以; I'm O.style Object parents Objects ???? 我是O.style对象的父母对象?
O.style.setMaincolor() // TypeError: Cannot call method 'main' of undefined
O.main() // [<div id="main"></div>]
setMaincolor method return this to O Object setMaincolor方法将此返回给O Object
this
refers to the object on which the method was invoked. this
是指在其上调用方法的对象。
main()
is invoked on the O
object, so this
is a reference to O
. main()
是在O
对象上调用的,因此this
是对O
的引用。 Therefore this.elements === O.elements
. 因此this.elements === O.elements
。
setMaincolor()
is invoked on the style
object, so this
will be a reference to O.style
, which does not have an .elements
property. 在style
对象上调用setMaincolor()
,因此this
将是对O.style
的引用,该对象没有.elements
属性。
You have to explicitly define what this
should mean; 您必须明确定义this
含义。 if not specified, this
will point to the nearest object. 如果没有指定, this
将指向最近的对象。
You can create a closure for it like so: 您可以像这样创建一个关闭:
var O = (function() {
var self = {
elements: {
main: function() { return jQuery("#main"); },
footer: function() { return jQuery("#footer"); }
}
}
self.style = {
setMaincolor: function() {
return self.elements.main();
}
}
return self;
}());
The (function() { ... }());
(function() { ... }());
returns the object and the self
is a "private" variable that only the O
object knows about and it points to itself, thereby making the .elements.main()
reference work. 返回对象,并且self
是只有O
对象知道并且指向其自身的“私有”变量,从而使.elements.main()
引用起作用。
since the setMaincolor
method is defined within the style
object, this
refers to the style
object. 由于setMaincolor
方法是在style
对象内定义的, this
是指style
对象。 Since the style
object has no elements
property, this.elements
is undefined. 由于style
对象没有elements
属性,因此this.elements
是未定义的。
One solution would be something like this, where you name the O
object explicitly instead of using this
: 一种解决方案是这样的,您可以显式命名O
对象而不是使用this
:
var O = {
elements: {
main: function() { return jQuery("#main"); },
footer: function() { return jQuery("#footer"); }
},
main: function(html) {
return (this.elements.main());
},
style: {
setMaincolor: function() {
// TypeError: Cannot call method 'main' of undefined
return (O.elements.main());
}
}
};
You cannot reference this.elements
in your setMaincolor
method. 您不能在setMaincolor
方法中引用this.elements
。 The this
-pointer refers to your style-object: Use O.elements.main()
in your O.style.setMaincolor
function instead. this
指针指向您的样式对象:在O.style.setMaincolor
函数中使用O.elements.main()
代替。
style: {
setMaincolor: function() {
return (O.elements.main());
}
}
Although, I don't recommend this approach, note that you also can also use: O.style.setMaincolor.call(O,[]);
尽管我不推荐这种方法,但是请注意,您也可以使用: O.style.setMaincolor.call(O,[]);
which makes this
reference O
. 这使this
参考O
This is how I would have solved it: 这就是我要解决的方式:
var O = (function() {
var self = {
elements: {
main: function() { return jQuery("#main"); },
footer: function() { return jQuery("#footer"); }
},
main: function(html) {
return self.elements.main();
},
style: {
setMaincolor: function() {
return self.elements.main();
}
}
};
return self;
}());
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.