[英]Object-Oriented JavaScript tools
I have been working on the user interface of my website ( www.swalif.com : do use chrome to translate if you like to). 我一直在研究我的网站的用户界面( www.swalif.com :如果你愿意,可以使用chrome进行翻译)。 Not being familiar with jQuery I started off with JavaScript and now the file is huge: about 1000 lines of code.
不熟悉jQuery我开始使用JavaScript,现在文件很大:大约1000行代码。 Furthermore the code is getting complex to handle and change.
此外,代码处理和更改变得越来越复杂。
Therefore I was looking for a way I could approach this problem in an object oriented manner that would result in a clean, re-usable system with a good architecture. 因此,我一直在寻找一种能够以面向对象的方式解决这个问题的方法,这种方式可以产生一个具有良好架构的干净,可重复使用的系统。 Also would be nice to use features as provided by JQuery to keep the code small .
也可以使用JQuery提供的功能来保持代码较小 。
The problem is that there are a lot of tools out there and I cannot decide which one to invest time into to accomplish this task. 问题是那里有很多工具,我无法决定投入时间来完成这项任务。 eg mootools, prototype, jQuery, etc. So I need someone to lead me in the right direction.
例如mootools,prototype,jQuery等。所以我需要有人带领我朝着正确的方向前进。
This is our website www.swalif.com . 这是我们的网站www.swalif.com 。 Any other suggestion are also welcome.
任何其他建议也欢迎。
For object-oriented javascript development I would recommend John Resig's Simple javascript Inheritance . 对于面向对象的javascript开发,我建议使用John Resig的Simple javascript继承 。 It is a tiny bit of javascript that allows you to define classes, derive from base classes and override methods.
它是一小部分javascript,允许您定义类,派生自基类和重写方法。
var Person = Class.extend({
init: function(isDancing){
this.dancing = isDancing;
},
dance: function(){
return this.dancing;
}
});
var Ninja = Person.extend({
init: function(){
this._super( false );
},
dance: function(){
// Call the inherited version of dance()
return this._super();
},
swingSword: function(){
return true;
}
});
var p = new Person(true);
p.dance(); // => true
var n = new Ninja();
n.dance(); // => false
n.swingSword(); // => true
// Should all be true
p instanceof Person && p instanceof Class &&
n instanceof Ninja && n instanceof Person && n instanceof Class
I think you'd be better off with a framework that actively developed and is build with OOP with extendability, reusability, mixings, mutators in mind. 我认为你最好使用一个积极开发的框架,并在构建时使用OOP,并考虑到可扩展性,可重用性,混合性,变异性。
This is exactly why MooTools was created. 这正是MooTools创建的原因。
That said, if you're not familiar with JS, it would be pretty difficult to grasp MooTools, since it's not a framework for beginners. 也就是说,如果你不熟悉JS,那么掌握MooTools将非常困难,因为它不是初学者的框架。 Then again, if you grasp the notion of OOP, you should be ok.
再说一次,如果你掌握了OOP的概念,你应该没问题。
Don't actually use a framework to implement your OOP. 实际上不要使用框架来实现您的OOP。 You get a much richer understanding of Javascript as a language when you deal with the nitty gritty of using Javascript's very flexible function prototype system to implement OOP-like operations.
当您处理使用Javascript 非常灵活的函数原型系统实现类似OOP操作的细节时,您可以更加深入地理解Javascript作为一种语言。
Read about it here: http://phrogz.net/JS/Classes/OOPinJS.html . 在这里阅读: http : //phrogz.net/JS/Classes/OOPinJS.html 。
If you only need to organize your code and don't need libraries you may use http://code.google.com/p/joose-js/ . 如果您只需要整理代码而不需要库,则可以使用http://code.google.com/p/joose-js/ 。 Otherwise use the oop model of the library you are using.
否则,请使用您正在使用的库的oop模型。
Simple example 简单的例子
Module("Test", function (m) {
Class("Point", {
has: {
x: {
is: "rw",
init: 0
},
y: {
is: "rw",
init: 0
}
},
methods: {
clear: function () {
this.setX(0);
this.setY(0);
}
}
})
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.