究竟啥是绑定?

Posted

技术标签:

【中文标题】究竟啥是绑定?【英文标题】:What exactly is a binding?究竟什么是绑定? 【发布时间】:2013-05-27 18:12:26 【问题描述】:

我最近越来越多地看到术语“绑定”和“实时绑定”,尤其是在 Ember.js、Can.js、Knockout.js 和 Backbone.js 等 javascript 框架中,更传统的是,在Cocoa 和 Objective-C,想知道绑定到底是什么? (究竟什么是“实时绑定”?)。

似乎从广义上讲,我们可以“将 A 绑定到 B”,然后我们可以说,“A 绑定到 B”,也就是说 B 的变化会反映在 A 中——自动,无需用户担心必须设置观察者,但观察者会更早自动设置并在 B 更改时自动通知。

当我们这样做时,我们正在创建一个“绑定”。

从更严格的意义上讲,Cocoa 和 Objective-C 似乎是这样定义的:绑定是对象 A 的 property foo,而这个属性观察并更改为对象B的属性bar的值。它是如何发生的,我们不在乎,它应该是隐藏的(就像一个黑盒子),通常它是由观察者模式实现的。所以“绑定”这个词实际上意味着一个“属性”,而不是一个动作——并且这个属性观察并被更改为与另一个属性相同的值。

而且这种绑定不仅限于绑定到数据的 UI 元素。它可以是包含较小部分 UI 元素的外部较大 UI 元素,并且外部 UI 元素具有绑定到内部 UI 元素属性的属性。或者它可以是绑定到另一个非 UI 数据属性的一个非 UI 数据属性。

这就是绑定吗?那么实时绑定呢?

【问题讨论】:

只是我的两分钱,IMO 你完全正确地理解了绑定是什么,并且实时绑定几乎相同,但名称不同。 我想你已经回答了你自己的问题,很好。 :) 【参考方案1】:

我不确定历史,但我的猜测是这个意义上的“绑定”一词源于“数据绑定”一词。 “数据绑定”确实是一个动作:它使用来自实际数据(AKA 模型)的值填充 UI 控件,例如,当表单中的字段被数据库中的数据填充并自动更新时,使用您提到的观察者模式.我认为绑定的主要区别是单向与双向:在双向数据绑定中,用户输入也会同步回模型,而不是仅将数据从模型同步到视图。

“绑定”是动词,“数据绑定”的动词形式是“绑定数据”或“执行数据绑定”。第二个例子表明“数据绑定”也是一个名词,可以定义为“将数据/模型属性绑定到 UI/视图属性的行为”。关于“绑定”本身的名词版本,我认为您是正确的,它通常指的是两个属性之间的单独绑定。为了直观地展示这一点,假设这些点代表两个相互绑定的属性:

• ----- •

这里的“绑定”是它们之间的界线。

更具体地说,单向绑定可以用一个箭头表示:

• ----> •

还有一个带有两个箭头的双向绑定:

• •

“实时绑定”是一个术语,仅用于表示正在使用观察者模式。我的猜测是,区分“实时绑定”的愿望可能来自 Web 开发人员,他们以前曾使用过在第一次加载页面时,每个 HTTP 请求只发生一次数据绑定的框架。现在,大量 Javascript 的 Web 应用程序正在成为规范(部分归功于 ajax),没有理由不使用 MVC 原始定义所建议的观察者模式,因此“实时绑定”对于 RIA 而言可能是一个不必要的术语或原生桌面或移动应用程序。

顺便说一句,Trygve Reenskaug 对 MVC 的最初设想(他发明了它)从根本上是关于在系统中反映最终用户的心智模型,因此“模型”是用户几乎可以直接操纵的东西(或至少感觉这种方式给用户)。所以观察者模式(或者至少是保持模型和视图同步而不重新加载页面的某种机制)对于它来说是必不可少的,并且在服务器端拥有大部分代码的 Web 开发框架并不是最初设想的真正 MVC,而是而是在代码组织方面遵循相同一般思想的变体。主要用于客户端应用程序的现代 Javascript 框架使真正的 MVC 可用于 Web 开发。

回到您在问题中提出的观点,当您说绑定不一定只在模型属性和视图属性之间时,我认为您也是正确的;它可以在两个模型属性之间(通常在不同的模型上),或者在两个视图属性之间。但我不同意你关于“绑定”只是编程方面的名词的断言——显然在英语中它是动词“绑定”的名词形式,换句话说,“绑定的行为”,我认为这是一个有效的在编程中的使用也是如此。所以本质上我要说的是它有双重含义,但我认为你提出的定义是最常见的。这是我对正式定义的尝试:

绑定。

    两个属性之间的连接(通常在两个不同的对象中),它使属性彼此保持同步,即具有相同的值。同步可以是单向的,也可以是双向的。 启动此类连接的行为。

【讨论】:

如果您有兴趣了解更多关于 Trygve Reenskaug 关于最终用户心智模型的想法,我当然建议您查看有关 MVC 的早期文章,但也可以查看他的新范式(其中与 MVC 互补)、DCI,进一步帮助在代码中反映用户的心智模型。 This article 是一个很好的起点。 能否请您回答您自己的问题,或者接受马特的上述回答(我认为这很好)...以便从此处的“未回答的问题”部分中删除此问题?谢谢! :)【参考方案2】:

Binding 很简单的意思就是链接,假设你有一个进度条和一个变量 X,每次点击一个按钮,X 的值都会递增。使用 Binding 您可以获取 X 的值(每次递增)并将其显示在进度条上。在 C# 中的以下代码行中,“pb”是进度条,TapCount 是保存总点击次数的变量。它显示“pb”的值已经绑定到变量TapCount

public void tapping
    
 pb.Value = TapCount; 

【讨论】:

【参考方案3】:

这与原版 javascript 中 .bind 方法的原始使用没有什么不同:您将对象的范围绑定到方法。

考虑this.iterable.map( this.flush )this.iterable.map( this.flush.bind(this))。首先,我们简单地在 this 上的可迭代属性的每次交互上运行一个方法 - 但是为了让 this.flush 方法访问 this 属性,您必须将其绑定到 this

同样,在 Ember 等框架中,模型是一个声明。为了从远程源填充该模型,您需要一个实例。为了从车把修改模型,您需要一个实例。如果您的 UI 更改立即影响模型实例 - 它们已绑定。

伪编码: UI.view.bind(modelInstance) RemoteSource.bind(modelInstance)

根据我的经验,“实时绑定”是在 UI 发生变化时立即将数据绑定到远程源。

伪编码: UI.view.bind(modelInstance) RemoteSource.bind(modelInstance) modelInstance.onChange(RemoteSource.update.bind(modelInstance))

【讨论】:

【参考方案4】:

术语“绑定”主要用于客户端开发。以您创建一个显示温度的 html 网页为例。

<div id="temp_value"> 77 °F </div>

现在您想在温度变化时更新此值,同时不断向温度提供程序 API 发出 AJAX 请求。在该响应中,您会收到一个温度值,该值应相应地更新您的 UI。

这种需要用 Javascript 变量或类似变量来更新 HTML 就产生了绑定的概念。

当你创建的东西让你的 DOM 与任何可以是 DOM 的 JS 变量的变化保持同步时 - 变量对可以说是相互绑定的。

还有一个术语叫做双向绑定,DOM 中的任何更改都会更新绑定的 JS 变量,反之亦然。

【讨论】:

以上是关于究竟啥是绑定?的主要内容,如果未能解决你的问题,请参考以下文章

Spring freemarker 绑定 - 啥是控制器?

javascript 框架:啥是 UI 绑定和组合视图?

究竟啥是“特级”?

究竟啥是“执着无知”?

究竟啥是 JavaBean?

究竟啥是“样本”?