New Way to write jQuery plugin to execute functions in a more oop manner

Question

I've been reading about jQuery plugins for a while and trying to implement our plugins in a more oop way. my manager is a c# guy and hates the way jQuery UI calls methods. i wanna use the approach bellow and wanna know your opinion about it. tell me the pros and cons of what i'm trying to use plz. ok this is it as a simple sample.it has works to do but for start:

    if(typeof Object.create !== 'function')
{
    Object.create = function(o)
    {
        function F()
        {
        }
        F.prototype = o;
        return new F();
    };
}
var Car = (function()
{
    var openDoor = function(doorNum)
    {
        alert("door #" + doorNum + " opened");
    };
    return {
        openDoor: openDoor
    };
}
)();
(function($, window, document, undefined)
{
    $.fn.car = function(options)
    {
        if(this.length)
        {
            return this.each(function() {

                var myCar = Object.create(Car);
                $.data(this, 'car', myCar);

                for(var prop in Car)
                {
                    if($.fn[prop] == null)
                    {
                        $.fn[prop] = function(params)
                        {
                            return this.each(function () {
                                if($.data(this, "car") == null)
                                {
                                    throw Error("not implemented function");
                                }
                                $.data(this, "car")[prop](params);
                            }
                            );
                        };   
                    }
                }

            });
        }
    };
})(jQuery, window, document);

$("#test").on("click", function()
              {
                $("#test").car().openDoor(1).css({color: 'red'});
              });

here is the fiddle link
http://jsfiddle.net/6zHP7/8/

Answer 1

Well, to start, not sure what you mean by "more OOP manor" as jQuery is pretty much Object driven! However, as far as your code, I don't like the idea of extending on base JS items, like your extension to the Object model. In most cases it's unnecessary for that purpose anyway. Call it personal preference, but I think it always a horrible idea to play with the foundation. Think of it like a house. You can add furnishing, change the paint, even add a new roof, but you never crack the foundation. As for your plugin call, what's in it doesn't matter and when removed, you really don't have much of a plugin example there. It will probably preform as intended, but if you really want a robust, "Object Orientated" plugin, then you need consider name-spacing. I'm going to attach the base layout I follow. I designed it a couple years ago for a job and been using it ever since, works perfect every time! Be nice to it though, it bites!

/*  Example Plug-in Setup   */
(function($) {
    if (!$.myExample) { // check your plugin namespace does not already exist
        $.extend({  //  this will allow you to add your plugin to the jQuery lib
            myExample: function(elm, command, args) {
                //  keep in mind, right here you might want to do a class or data check to determine which direction this call is going
                //  for example, upon init the plugin on an element you may add the plugin name as a class, 
                //      this way, when it's recalled, you can see it alrady has that class and might be calling a command,
                //          thus make an if statemnt to push the process through
                return elm.each(function(index){
                    // do work to each element as its passed through
                    // be sure to use something like
                    //    return elm.each(function(e) { dor work });
                    // as your final statement in order to maintain "chainability"
                });
            }
        });
        $.fn.extend({   //  this gives the chainability functionality seen with $ funcs like: $("#eleID").css("color", "red") <--returns original element object
            myExample: function(command) {
                return $.myExample($(this), command, Array.prototype.slice.call(arguments, 1));
            }
        });
        $.myExample.props = {   //  Here you can establish specific properties to your plugin, prehaps even make them "Over-writable"
            key1: "value",
            key2: "value"
        };
        $.myExample.methods = { //  Here you can establish specific methods/functions for your plguin to carry out and maintain your namespace as well
            key1: function(param) {
                /*  do work */
            },
            key2: function(param) {
                /*  do work */
            }
        };
        //  This next part is not seen in many plugins but useful depending on what you're creating
        $.myExample.init = function(param) {    //  If you have an initialize method to apply, namespace it in here and calll on initializing your plugin
            var key = "value",
                key2 = {
                    subKey: "value"
                };
                /*
                /  run any number of initializing functions here
                /  I prefer to make my param a value that can be a
                /   string with a possible object
                /   the string for holding a base configuration
                /   the object for any change in properties or base values for that config
                */
        };
        $.myExample.defaults = {    //  establish base properties here that can be over-written via .props, but their values should never truly change
            key1: "value",
            key2: {
                prop1: {
                    subKey1: "value",
                    subKey2: "value"
                },
                prop2: {
                    subKey1: "value"
                }
            },
            key3: function(param) {

            }
        };
    }
})(jQuery);

//  Then of course, make use of your plugin like:
$("#eleID").myExample();
//  OR
$.myExample($("#eleID"));