Why do I have to interact with widgets this way?

Why do I have to interact with widgets this way?

When I try to call a widgets method why do I have to call it like this...

  1. var myWidget = $('#foo').MyWidget();
  2. myWidget.MyWidget('addRow');

Why cant I just do the following? Or maybe I can and my widget is just wrong?

  1. var myWidget = $('#foo').MyWidget();
  2. myWidget.addRow();


Below is my code:

  1. (function ($) {

      $.widget( "MY_NAMESPACE.MyWidget", {

          addRow: function() {

              console.log("Foo");
          }
      });

    })(jQuery);

    // .............

    $(document).ready(function() {

        var myWidget = $('#foo').MyWidget();
        myWidget.addRow();

    });