What exactly is a binding?

Question

I have been seeing the term "binding" and "live-binding" more and more recently, especially in JavaScript frameworks like Ember.js, Can.js, Knockout.js, and Backbone.js, and more traditionally, in Cocoa and Objective-C, and wonder what exactly a binding is? (and what exactly is a "live-binding"?).

It seems that from a loose sense, we can "bind A to B", and then we can say, "A is bound to B", and that means changes in B will be reflected in A -- automatically, without the user worrying having to set up an observer but the observer is set up earlier automatically and notified automatically when B changes.

And when we do that, we are creating a "binding".

And from a stricter sense, it seems the Cocoa and Objective-C defines it like this: a binding is a property foo of Object A, and this property observes and get changed to the value of property bar of object B. How it happens, we don't care and it is supposed to be hidden (like a black box), and usually it is implemented by the Observer Pattern. So the word "binding" actually means a "property", not an action -- and this property observes and get changed to the same value as the other property has.

And this binding is not limited to UI elements being bound to data. It can be an outer, larger UI element that contains a smaller piece of UI element, and the outer UI element has a property that is bound to the inner UI element property. Or it can be one non-UI data property bound to another non-UI data property.

Is this what a binding is exactly? And what about a live-binding?

Answer 1

I'm not sure of the history, but my guess would be that the term "binding" in this sense sprang from the term "data-binding." "data-binding" is indeed an action: it's populating UI controls with values from the actual data, AKA model, for example when fields in a form get filled with data from a database and get automatically updated, using the Observer pattern as you mentioned. I think the main distinction with binding is one-way versus two-way: in two-way data-binding, user input also gets synchronized back to the model, rather than data only syncing from the model to the view.

"bind" is a verb, and the verb form of "data-binding" would be "bind data" or "perform data-binding." The second example demonstrates that "data-binding" is also a noun, which could be defined as "the act of binding data/model properties to UI/view properties". With respect to the noun version of "binding" by itself, I think you're correct that it usually refers to an individual binding between two properties. To demonstrate this visually, suppose that the dots represent two properties that are bound to each other:

• ----- •

The "binding" here is the line between them.

To get more specific, a one-way binding could be represented with a single arrow:

• ----> •

And a two-way binding with two arrows:

• <---> •

"live binding" is a term that's just used to indicate that the Observer pattern is being used. My guess would be that the desire to distinguish a "live binding" probably came from web developers who had previously worked with frameworks where data-binding happened only once per HTTP request, when the page was first being loaded. Now that Javascript-heavy web apps are becoming the norm (partially thanks to ajax), there's no reason not to use the Observer pattern as suggested by the original definition of MVC, so "live binding" is probably an unnecessary term with regard to RIAs or native desktop or mobile apps.

As an aside, Trygve Reenskaug's original vision of MVC (he invented it) is fundamentally about reflecting the end user's mental model in the system so that the "Model" is something that the user is almost manipulating directly (or at least feels that way to the user). So the Observer pattern (or at least some mechanism to keep Model and View in sync without reloading the page) is essential to it and web development frameworks that have most of the code on the server-side aren't really MVC as originally conceived but rather a variant that follows the same general idea in terms of code organization. Modern Javascript frameworks for primarily client-side apps make real MVC possible for web development.

Back to a point you made in your question, I think you're also correct when you say that a binding isn't necessarily just between a model property and a view property; it could be between two model properties (usually on different models), or between two view properties. But I would disagree with your assertion that "binding" is only a noun with respect to programming - obviously in English it's the noun form of the verb "bind," in other words "the act of binding," and I think that's a valid usage in programming as well. So essentially what I'm saying is that it has a double meaning, but I think the definition you proposed is the most common. Here's my attempt at a formal definition:

Binding.

1. A connection between two properties (usually in two different objects) which keeps the properties in sync with each other, i.e. having the same value. The synchronization can be either unidirectional or bidirectional.
2. The act of initiating such a connection.