[英]Javascript equivalent of PHP's :: (Scope Resolution Operator)
在PHP中,您可以执行以下操作:
class myClass() {
function doSomething(someVar) {
// do something here
}
// etc... (other methods and properties)
}
然后,当然,您可以在实例化类之后调用该方法,如下所示:
$myObj = new myClass();
$myObj->doSomething();
但是您也可以选择将该方法作为独立函数调用,而无需实例化该类(但您必须注意该函数中的依赖项),如下所示:
myClass::doSomething();
我相信这是为C ++借来的东西......它被称为范围解析运算符(PHP代码中的Paamayim Nekudotayim ......)
http://en.wikipedia.org/wiki/Scope_resolution_operator#PHP
http://www.php.net/manual/en/language.oop5.paamayim-nekudotayim.php
你会如何在JavaScript中做这样的事情? 这似乎不可能。 也许我接近这个错误的方式,我应该披露我想要实现的目标......
我只是有一个函数,它是这样的:
function submitContactForm(form) {
// pretty JavaScript...
}
我很高兴它是一个功能。 但我想实现一个“resetContactForm()”,但希望以某种方式将它附加到submitConatctForm函数。
我知道我可能会这样做:
var contactForm = {
"submit" : function(form) {
//...
},
"reset" : function(form) {
//...
}
}
而且我已经回答了我自己的问题......
但是,除了我不喜欢这种语法,并且想避免它之外,还有一个事实是上面的结构不能用作类定义,它与PHP中的不一样......所以回到最初的问题:有没有办法让JavaScript结构可以同时用作类定义和独立函数的集合?
您错误地理解了原型继承 - 您实际上可以将第二个示例用作“类”定义,并且可以从“类”或“实例”调用这些方法:
// This is a normal JavaScript object
// not JSON as another commenter pointed out.
var ContactForm = {
submit: function(form) {
form = form || this.form;
// general contact form submission implementation
},
reset: function(form) {
form = form || this.form;
// general contact form reset implementation
},
setForm: function(form) {
this.form = form;
}
};
// Now we will create an instance of the contactForm "class"
// We are setting the prototype of `firstContactForm`
// to point at the `contactForm` object.
// If we wanted to we could create a function on the
// ContactForm object (e. g. `create`) that would invoke
// Object.create for us. (i. e. `ContactForm.create()`)
var firstContactForm = Object.create(ContactForm);
firstForm.setForm(document.getElementById("someForm"));
firstForm.reset();
// But, we can also use the function as a "static":
ContactForm.reset(document.getElementById("someForm"));
在回答问题的另一部分时,如果你想让它成为可以单独调用的东西,你也可以允许直接传递数据,正如我们在示例中使用form = form || this.form;
form = form || this.form;
检查submit
和reset
。
或者,你可以使用call
和apply
( 正如@elclanrs在他的回答中指出的那样 )并且总是使用this.form
:
ContactForm.reset.call({form: document.getElementById("someForm")});
在JavaScript的对象语法中,如果没有任何特殊字符,则不需要引号:
var obj = {
key: function() {
...
},
...
}
Paamayim Nekudotayim在JavaScript中没有地位,因为没有类,没有静态方法。 但JavaScript有一个动态的背景下,我们所说的this
。 除了关键字的名称之外, this
在PHP或其他经典继承语言中与this
类似。
一个典型的JavaScript“类”看起来像:
// A "Class"
var Person = (function(){
// Private stuff, shared across instances
var instances = [];
// The constructor AKA "__construct"
function Person(name) {
this.name = name;
instances.push(this); // keep track of instances
}
// Static methods, attached to the constructor
// don't need an instance
Person.instances = function() {
return instances;
};
// Public methods
Person.prototype = {
say: function() {
return this.name +' says hello!';
}
};
return Person;
}());
现在,你如何使用它:
var mike = new Person('Mike');
mike.say(); //=> Mike says hello!
Person.instances().length; //=> 1
到目前为止这么好。 对于JavaScript中的“范围解析”,您可以显式传递上下文; 知道this
是动态的,你可以借用Person的say
方法并在任何其他上下文中调用它,例如:
Person.prototype.say.call({name:'John'}); //=> John says hello!
你可以把它变成这样的类:
function ContactForm(form) {
this.form = form;
}
ContactForm.prototype.submit = function() {
console.log('submiting: ' + this.form);// do something with the form
}
ContactForm.prototype.reset = function() {
console.log('reseting: ' + this.form);
}
var someForm = ...;
var form = new ContactForm(someForm);
form.submit();
form.reset();
或者如果您想静态使用它们,您可以执行以下操作:
var ContactForm = (function() {
var reset = function(form) {
console.log('reseting' + form);
};
var submit = function(form) {
console.log('submiting' + form);
}
return {
submit: submit,
reset: reset
}
}()); // note that this is self-executing function
并使用它
ContactForm.submit(form);
ContactForm.reset(form);
阅读Sean Vieira和elclanrs的回答给了我更好的洞察力。 我已经提出这个代码作为概念的证明,并确保我明白我在读什么。 这本质上是elclanrs答案的简化版本:
function contactForm(form) {
this.form = form;
}
contactForm.prototype.submit = function() {
alert("submit "+this.form);
}
contactForm.prototype.reset = function() {
alert("reset "+this.form);
}
// Without instanciating:
contactForm.prototype.submit.call({form:'form2'});
// With instance:
myForm = new contactForm('form1');
myForm.reset();
所以它接缝这个“功能”已经在JavaScript中可用,虽然是一种不同的,不那么简单的形式。
此外,肖恩维埃拉的方法,完成:
var ContactForm = {
submit: function(form) {
form = form || this.form;
alert("submit "+form);
},
reset: function(form) {
form = form || this.form;
alert("reset "+form);
},
createForm: function(form) {
var myForm = Object.create(this);
myForm.setForm(form);
return(myForm);
},
setForm: function(form) {
this.form = form;
}
};
// instanciated
myContactForm = ContactForm.createForm('Me Form');
myContactForm.submit();
// no instance
ContactForm.submit("Some Form");
另外(我的贡献),如何使用包装函数,像那样? 看起来对我来说是个不错的选择。
function contactForm(form) {
this.form = form;
this.submit = function() {
submitContactForm(this.form)
}
this.reset = function() {
resetContactForm(this.form);
}
}
function submitContactForm(form) {
alert("submit "+form);
}
function resetContactForm(form) {
alert("reset "+form);
}
// Without instanciating:
submitContactForm('form2');
// With instance:
myForm = new contactForm('form1');
myForm.reset();
没有完美的解决方案......
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.