OO JQuery和類

我正在一個網站上工作，基本上第一次使用JQuery。我以前的項目主要使用MooTools，並且我使用MooTools Class結構編寫了一些小部件類。我想將它們移植到JQuery上，但在我看來，對於對象類來說，MooTools沒有什麼功能。OO JQuery和類

我搜索了一下，並沒有發現太多。 Digg似乎有rolled their own，但我不確定這是我應該使用的。有沒有更好的辦法？人們通常使用JQuery獲得面向對象的方法嗎？封裝UI小部件（或任何功能類結構）的常用方法是什麼？

我會後可能MooTools的widget類的假例如：

var ZombatWidget = new Class({ 
    Extends: BaseWidget, 
    widgetPropertyX = 'prop1', 
    widgetPropertyY = 'prop2', 
    attach = function(el) { 
     var f = function() { 
      //do something widgety 
     }; 
     el.addEvent('dblclick',f); 
     el.addClass('widgetized'); 
    } 
}); 

var z = new ZombatWidget(); 
z.attach($('widgetDiv'));

我所得到的是比大很多，但你的想法。我是否需要將其轉換爲類/繼承構造的prototype方法？你將如何使用JQuery編寫這種對象類？

來源

2009-08-09 zombat

你可能會發現這種方法對於處理任務有用：building an object-oriented jquery plugin.

而這篇文章在阿賈克斯「a real OO class system with jquery」。

來源

2009-08-09 07:14:55 pixeline

問題是......爲什麼你要離開MooTools它是否適合你的需求？對我來說似乎MooTools工作正常，而且MooTools無法做到的jQuery沒有任何功能。（相反是不正確的）。

不幸的是，jQuery不是爲支持傳統的OOP而構建的，因爲MooTools是這樣的，因此您需要將您的Classes編寫爲jQuery插件。

來源

2009-08-09 05:06:03

呃......不，這不是問題。既然你問了，JQuery是項目規範的一部分，這些都不是我寫的。如果可以轉換，我想把我的MooTools類放在一邊，以免我不必爲JQuery重寫它們。 – zombat 2009-08-09 05:10:12

** @ zombat：** jQuery沒有類的功能，您需要在jQuery中重寫它們。 – 2009-08-09 05:16:55

插件有時會訣竅。

當然，你可以使用足夠的mootools來獲得它的類/繼承模型。通過1.2.3中的document.id「兼容模式」的實現，你可以擁有你的蛋糕並且也可以吃它（我認爲 - 我自己並沒有這樣做。）

來源

2009-08-09 05:07:10

嗯......有趣。我們有jQuery，這是一個與DOM交互的好工具。這是一個選擇工具，您可以編寫自己的代碼（插件）來修改選定的項目。你可以在這裏與你自己的（面向對象的）代碼在一個插件中進行交互，以做一些非常酷的事情。

那麼，爲什麼你需要在jQuery中額外的OO功能，除非你想能夠從其他jQuery插件繼承？

因爲你可能有一個插件，可以讓你做到以下幾點：

$(".spiffyness").yourSpiffyficationPlugin1();

而且，雖然已經做了一些很酷的迷死人，你需要在此之上更spiffyness。

因此要從這會導致你的第一個插件繼承：

$(".spiffyness").yourSpiffyficationPlugin2(); //plugin inherited from 1

可是......你會不會做這那裏太：

$(".spiffyness").yourSpiffyficationPlugin1().yourSpiffyficationPlugin2();

當第二插件只是在第一個這個小小的（但真棒;））額外的東西？

換句話說：就是你想要的，值得爲OO純粹主義而努力嗎？或者是jQuery管道機制足夠好，也許你需要的一切？

我想說，職責分離和/或你的mootools心態可能是真正的問題。讓jQuery做它擅長的事情，使用它強大的管道機制，管理你自己的插件（它可能包含大量的OO內容）......並且當代碼仍然乾淨時，你可以獲得很好的結果。

如果您確實認爲我在這裏想得太簡單，那麼您的觀點的精髓就是一個很好的例子！ :-)

要做到這一點，如果你正在做一些真正先進的事情，並且你不會輕易在其他事情上做些事情，那麼你也可以將插件委託給你的一個OO類。例如。如：

$.fn.totalAwesomeness = function(options) { 
    var defaults = { 
    mode: 1, 
    title: 'Awesome' 
    }; 
    var opts = $.extend(defaults, options); 
    return this.each(function() { 
    var $this = $(this); 
    var handler = null; 
    if(defaults.mode == 1) 
     handler = new com.myStuff.class1($this); 
    else if(defaults.mode == 2) 
    handler = new com.myStuff.class2($this); //class2 inherits from class1 
    handler.doMagic(); 
    }); 
};

來源

2011-01-23 15:40:43 Jos

Mootools類有助於保持代碼簡單和結構化。作爲一名非JQuery用戶，我只能快速瀏覽一下JQuery插件。即使js體驗非常低，Mootools插件類通常也更具可讀性。 – jpeltoniemi 2012-05-27 11:54:27

您也可以隨時使用moo4q - http://moo4q.com/。它增加了對jQuery的MooTools類支持。

來源

2012-01-23 04:52:13 BrianFreud

值得一提的是，這種方法需要您運行MooTools以及jQuery。你可以做一個自定義的構建來抓取MooTools的'Class'對象，但它需要引入很多其他MooTools的擴展。可能不適合每個人。 – restlessdesign 2012-11-05 16:50:49

我寫了一篇文章前一段時間關於jQuery的面向對象的插件，希望這將是有益的

http://ajax911.com/jquery-object-oriented-plugins/

來源

2012-05-24 21:11:34 Dima

有第三方JavaScript類實現，提供了非常強大的內省capabilites。我想特別強調JS.Class和Joose。雖然JS.Class是在Ruby之後建模的，但Joose是在Moose之後建模的。我不是一個mootools用戶，所以我不能評論他們在mootools方面的優缺點。但我會總結他們的主要特點。

JS.Class非常注重模擬Ruby的面向對象功能，並且做得非常好。它提供了一個強大的庫，它建立在標準的Ruby庫之後，並且還提供了一個集成的包管理和測試框架。

Joose，雖然沒有提供測試框架/包管理設施，但在方面表現優異，先進的屬性管理設施，過濾器和更好的內省設施。

兩者都有非常好的文檔，可以在瀏覽器和服務器上使用。

來源

2012-06-21 18:24:43 lorefnon

我剛剛完成了我的小型項目的第一個版本：https://github.com/op1ekun/plOOgins。這完全是關於編寫用作Jquery插件的OOP代碼。這不是火箭科學，而是我們想在我的工作場所使用的一點東西。也許它會幫助你一點。祝你好運！

來源

2012-12-28 20:42:29 op1ekun

回答

相關問題