Question

我一直致力于我网站的用户界面（www.swalif.com：如果您愿意，请使用chrome进行翻译）。不熟悉jQuery我开始使用JavaScript，现在文件很大：大约1000行代码。此外，代码处理和更改变得越来越复杂。

因此，我一直在寻找一种能够以面向对象的方式解决这个问题的方法，这种方式可以产生一个具有良好架构的干净，可重复使用的系统。 也很高兴使用JQuery提供的功能来保持代码。

问题是那里有很多工具，我无法决定投入时间来完成这项任务。例如mootools，prototype，jQuery等。所以我需要有人带领我朝着正确的方向前进。

这是我们的网站www.swalif.com。任何其他建议也欢迎。

Answer 1

对于面向对象的javascript开发，我会推荐John Resig的Simple javascript Inheritance。它只是一小部分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

Answer 2

我认为你最好使用一个积极开发并使用OOP构建的框架，并考虑到可扩展性，可重用性，混合，变异器。

这就是创建 MooTools 的原因。

也就是说，如果你不熟悉JS，那么掌握MooTools将非常困难，因为它不是初学者的框架。再说一次，如果你掌握了OOP的概念，你应该没问题。

Answer 3

实际上不使用框架来实现您的OOP。当您处理使用Javascript的非常灵活的函数原型系统实现类似OOP操作的细节时，您可以更加深入地理解Javascript作为一种语言。

在此处阅读：http://phrogz.net/JS/Classes/OOPinJS.html。

Answer 4

如果您只需要组织代码而不需要库，则可以使用http://code.google.com/p/joose-js/。否则，请使用您正在使用的库的oop模型。

简单示例

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);
            }
        }
    })
})

面向对象的JavaScript工具

4 个答案: