Using the Strategy pattern in JavaScript

boaz_leverage.js

$.each( buttons, function( propertyName, button ) {
  $('<button>', {
    html: button.label,
    id: propertyName
  })
  .bind('click', button.action)
  .appendTo( 'nav' );
});

boaz_nopattern.js

$('<button>', {
    html: 'Login to google',
    id: propertyName
  })
  .bind('click', function() { google.accounts.user.login('https://www.google.com/m8/feeds');
  })
  .appendTo( 'nav' );
    
$('<button>', {
    html: 'Logout from google',
    id: propertyName
  })
  .bind('click', function(){
    google.accounts.user.logout();          
  })
  .appendTo( 'nav' );
    
$('<button>', {
    html: 'Get contacts',
    id: propertyName
  })
  .bind('click', function() {
    var contactsService = new google.gdata.contacts.ContactsService( 'Contacts Viewer' ),
    query = new google.gdata.contacts.ContactQuery( 'https://www.google.com/m8/feeds/contacts/default/full' );
    query.setMaxResults( $('#numContacts').val() );
    contactsService.getContactFeed(
      query,
      function( result ) {
        $('#contacts').remove();
        var $contactsHolder = $('<ul>', {
          id: 'contacts'
        });
        $.each( result.feed.entry, function( i, entry ){
          $.each( entry.getEmailAddresses(), function( j, address ){
            $contactsHolder.append( '<li>' + address.address + '</li>' );
          });                  
        });
        $contactsHolder.appendTo( 'body');
      }, 
      function( result ) {
        // Log the error
        console.log('error: ', result);
      }
    );
  })
  .appendTo( 'nav' );

boaz_strategy.js

var buttons = {
  login: {
    label: 'Login to Google',
    action: function() {
      google.accounts.user.login('https://www.google.com/m8/feeds');
    }
  },
  logout: {
    label: 'Logout from Google',
    action: function() {
      google.accounts.user.logout();          
    }
  },
  getContacts: {
    label: 'Get contacts',
    action: function() {
      var contactsService = new google.gdata.contacts.ContactsService( 'Contacts Viewer' ),
      query = new google.gdata.contacts.ContactQuery( 'https://www.google.com/m8/feeds/contacts/default/full' );
      query.setMaxResults( $('#numContacts').val() );
      contactsService.getContactFeed(
        query,
        function( result ) {
          $('#contacts').remove();
          var $contactsHolder = $('<ul>', {
            id: 'contacts'
          });
          $.each( result.feed.entry, function( i, entry ){
            $.each( entry.getEmailAddresses(), function( j, address ){
              $contactsHolder.append( '<li>' + address.address + '</li>' );
            });                  
          });
          $contactsHolder.appendTo( 'body');
        }, 
        function( result ) {
          // Log the error
          console.log('error: ', result);
        }
      );
    }
  }
};

boaz_strategy_robust.js

var buttons = {
  login: new Button({
    label: 'Login to Google',
    action: function() {
      google.accounts.user.login('https://www.google.com/m8/feeds');
    }
  }),
  logout: new Button({
    label: 'Logout from Google',
    action: function() {
      google.accounts.user.logout();          
    }
  }),
  getContacts: new Button({
    label: 'Get contacts',
    action: function() {
      var contactsService = new google.gdata.contacts.ContactsService( 'Contacts Viewer' ),
      query = new google.gdata.contacts.ContactQuery( 'https://www.google.com/m8/feeds/contacts/default/full' );
      query.setMaxResults( $('#numContacts').val() );
      contactsService.getContactFeed(
        query,
        function( result ) {
          $('#contacts').remove();
          var $contactsHolder = $('<ul>', {
            id: 'contacts'
          });
          $.each( result.feed.entry, function( i, entry ){
            $.each( entry.getEmailAddresses(), function( j, address ){
              $contactsHolder.append( '<li>' + address.address + '</li>' );
            });                  
          });
          $contactsHolder.appendTo( 'body');
        }, 
        function( result ) {
          // Log the error
          console.log('error: ', result);
        }
      );
    }
  })
};

robust.js

var Button = function(opts) {
    for( var attr in opts ) {
      if(opts.hasOwnProperty(attr)) {
        this[attr] = opts[attr];
      }
    }
  };
Button.prototype.label = 'button';
Button.prototype.action = function() {};

runtime.js

var waveImplementations = {
    discrete: new Wave({
      node: context.createBufferSource(),
      is_initialized: false,
      init: function() { /* ... */ },
      readData: function( channel, callback ) { /* ... */ },
      connect: function( target ) { /* ... */ },
      disconnect: function() { /* ... */ }
    }),
    continuous: new Wave({
      node: context.createJavaScriptNode( waveForm.bufferSize, 0, 1 ),
      is_initialized: false,
      callback: noop,
      init: function() { /* ... */ },
      readData: function( channel, callback ) { /* ... */ },
      connect: function( target ) { /* ... */ },
      disconnect: function() { /* ... */ }
    })
  },
  wave = waveImplementations.discrete;