如何构造jquery代码?

这是一个很难回答的问题。

Javascript不可思议的灵活性的缺点是,每个程序员和他的姐夫都有不同的做事方式。

在javascript(原型库、moo、joose、js.class、base2等)中执行基于“类”的OOP时,拉入一个库的缺点是,立即减少可以读取代码的其他javascript程序员的数量。

显然,jquery鼓励您从“collections”的角度进行思考。collection是从$()或jquery()调用中得到的。JohnResig曾经考虑在jQuery中添加一个类系统,但最终还是决定反对它。我想他说过他在JavaScript编程中从来就不需要真正的“类”系统。

对于除了最大的JS项目之外的所有项目,我会说忘记类系统。利用JS不可思议的对象和数组系统(包括文本)。名称空间很大(变量和方法类似)。

在我通常使用类的大多数情况下,我都很幸运地使用了对象数组。

jquery集合概念的一个有趣的扩展是在ArielFlesler的jquery.collection插件中。 here . 它允许您像处理jquery中的DOM数据一样处理“普通”数据。

我最近开始使用 Underscore.js 这为您提供了许多将数据视为集合的功能性工具。

你通常需要的是机制 代码扩展 和 包装 .

对于前者,我使用基于伪类的默认OO机制,有时使用辅助函数使继承更容易:

Function.prototype.derive = (function() {
    function Dummy() {}
    return function() {
        Dummy.prototype = this.prototype;
        return new Dummy;
    };
})();

function Base() {}
function Sub() {}
Sub.prototype = Base.derive();

后者可以通过自执行函数通过名称间距实现。甚至有可能伪造进口声明:

// create package:
var foo = new (function() {
    // define package variables:
    this.bar = 'baz';
    this.spam = 'eggs';

    // export package variables:
    this.exports = (function(name, obj) {
        var acc = [];
        for(var prop in obj) {
            if(obj.hasOwnProperty(prop))
                acc.push(prop + '=' + name + '.' + prop);
        }
        return 'var ' + acc.join(',') + ';';
    })('foo', this);
});

// use package:
(function() {
    // import package variables:
    eval(foo.exports); 
    alert(spam);
})();

jquery并不是真正用来构造代码的。它是一个工具,你可以从其他代码中使用,而不是生活方式。

其余的代码应该以您喜欢的方式编写。当您想进行DOM操作、Ajax调用、跨浏览器事件等时,只需使用jquery。

您可能想学习如何使用.prototype属性将一些代码放入“类”中,这样您就可以通过创建一个新的实例化在不同的地方重用相同的代码。

您还可以将代码放入对象中,这样您就有了一个唯一的名称空间,这样在不同的项目之间共享相关对象就更容易了。

基本上,您将像处理纯JavaScript一样构造代码,但jQuery抽象出一些常见功能,因此您不必担心浏览器问题,但它只是一个帮助器,它实际上不提供框架,而只是简化一些概念。例如,我倾向于使用.bind(“click”,……)而不是使用on click,但如果我希望一个元素具有多个事件处理程序的潜力。