Design Patterns

CHAPTER 8
■ ■ ■
The Bridge Pattern
In the world of API implementations, bridges are incredibly useful. In fact, they’re probably
one of the most underused patterns. Of all patterns, this is the simplest to start putting into
practice immediately. If you’re building a JavaScript API, this pattern can be used to ensure
that the dependent classes and objects are coupled to it loosely. As defined by the Gang of
Four, a bridge should “decouple an abstraction from its implementation so that the two can
vary independently.” Bridges are very beneficial when it comes to event-driven programming,
which is a style that is used often in JavaScript.
If you’re just entering the world of JavaScript API development, you’re most likely going to
be creating a lot of getters, setters, requesters, and other action-based methods. Whether
they’re used to create a web service API or simple accessor and mutator methods, bridges
will help you keep your API code clean come implementation time.
Example: Event Listeners
One of the most practical and frequent use cases for a bridge is event listener callbacks. Let’s
say, for instance, that you have an API function called getBeerById, which returns data about
a beer based on an identifier. Naturally, in any web application, you want this data to be fetched
when a user performs an action (such as clicking an element). Most likely the element you click
contains the beer identifier, either stored in the element ID itself, or in some other custom
attribute. Here’s one way of doing it:
addEvent(element, 'click', getBeerById);
function getBeerById(e) {
var id = this.id;
asyncRequest('GET', 'beer.uri?id=' + id, function(resp) {
// Callback response.
console.log('Requested Beer: ' + resp.responseText);
});
}
As you can see, this is an API that only works if it is run within the context of a browser.
Naturally, due to the way event listener callbacks work, you get passed back an event object as
the first argument. That’s useless in this case, and there is only the scope of callback to work
with to grab that ID from the this object. Good luck running this against a unit test, or better
109