Francesco Belladonna
Francesco Belladonna

Reputation: 11689

A library to couple with jquery which helps work with classes easily (create/inheritance and so on)

I recently used Ext.JS for a project and I loved it's way to make javascript more "C-like" I may say, with inheritance through keyword "extends" and class definition through Ext.define.

While I love Ext, I don't think it fits well to create a normal website (I like it for management web application), I prefer JQuery for things like that, because usually I have a custom graphic and animation involves a lot of DOM manipulation (with Ext, everything is integrated in their classes).

I would like to couple JQuery with a library that handles only the "class" aspect of javascript. It doesn't need to do anything about jquery, I just need to write my code as something object oriented.

I don't want change my javascript development framework because I already use Ext and JQuery, I think it's enough.

Thanks for suggestion

Edit 1:

Looks like this question is already answering (in part) me. Because it's a 2009 question, I would like to know if there are other libraries that I should look to.

I'm thinking about using JS.Class, base2 doesn't have (for me) a natural syntax. Joose is doing more than I require and JS.Class is inspired by ruby (which is ok for me). Expecially it looks more natural for me.

Upvotes: 1

Views: 164

Answers (2)

Francesco Belladonna
Francesco Belladonna

Reputation: 11689

I solved the problem by myself, it looks like JS.Class works really well coupled with JQuery (obviusly you have to make it work in an OOP way). Here you can find the sources which brought me to this answer:

jquery class inheritance

This expecially: Has anyone used JS.Class and liked it?

Upvotes: 0

ThePrimeagen
ThePrimeagen

Reputation: 4582

I like writing things OOP too. So this is what i do!

(function() {
    MySite = {
        ... some basic functions that involve whatever javascript libraries
    }
})();

Then i want make a ui section

MySite.ui = {
    uiButton: function($buttons) {
        $.each($buttons, function() {
            var $this = $(this),
                settings = $this.data("settings");

            $this.click(function() {
                if (settings.type == 0) {
                    MySite.handleLocationChange(settings.location);
                }
            });
        });
    }
}

So thats how i do some stuff, Obviously this is library independent, i just prefer jQuery, for its selector stuff. But i can extend my library with different parts that are easy to implement

So i would have a div

<div class='uiButton'data-settings='{"type":"0"}'>MySweetButton</div>
<script type='text/javascript'>MySite.ui.uiButton($(".uiButton"));(</script>

Upvotes: 1

Related Questions