knockout.js - Magento 2 - observables 在常见的 knockoutjs 和 magento 2 框架中的工作方式是否有区别？

Question

common knockoutjs 和 Magento 2 中的 observables 有什么区别？
任何人都可以通过举一些例子来区分

Answer 1

来自 Alan Storm :
“Observables 用在很多地方，有很多方法可以理解“obervables”，但你需要理解的是，HTTP 请求返回一个在响应(或失败)时完成的 Observable，它实际上不知道什么时候您的后端决定“发送”更多数据，因为它不是那样构建的，您的后端只响应请求。
那么在 Magento 2 中，“obervables”的使用有点棘手。 Magento 2 的 javascript 框架工作大量使用了超出普通前端开发人员需要知道的可观察对象。
Observables 是独立的 setter/getter 对象。在 Magento 引导页面中，在浏览器的 javascript 控制台中运行以下代码。在使用全局 ko 变量而不是 Magento 的特殊 RequireJS 模块的系统中，您还应该能够在 Magento 之外执行此操作。

//load the Knockout.js library -- normally you'd do this in a `define`
ko = requirejs('ko');

//create the observable object with a default value
var objectToHoldMyValue = ko.observable('default value');

//fetch that value by calling the observable as a function
console.log( 'Value: ' + objectToHoldMyValue() );
"default value"

//set a new value by calling the observable as a function with an argument
objectToHoldMyValue('new value')

//fetch that value by calling the observable as a function
console.log( 'Value: ' + objectToHoldMyValue() );
"new value"    

从上面的代码和注释可以看出，可观察对象的首要工作是存储一个值，返回一个值，改变一个存储的值。如果你不习惯 javascript 的“对象可以是匿名函数”的特性，语法可能会有点奇怪，但这并没有什么太疯狂的地方。另外——在你考虑订阅者之前，也没什么必要。

//subscribe to a change
objectToHoldMyValue.subscribe(function(newValue){
console.log("The subscriber sees: " + newValue);
});

上面的代码设置了一个回调，换句话说，就是一个事件监听器(即你正在订阅一个事件)。您要订阅的事件？可观察值的变化。如果再次运行值设置代码。

objectToHoldMyValue('a second new value')
The subscriber sees: a second new value

你会看到 Knockout 调用你的订阅者方法。
重要提示:仅当值更改时才调用订阅者。如果传入 observable 的当前值，Knockout 不会调用订阅者回调

objectToHoldMyValue('a third new value')
The subscriber sees: a third new value

objectToHoldMyValue('a third new value')
[no output, because the subscriber was not called]

虽然这个例子有点傻，但在一个真实的程序中，当变量的值发生变化时，observables 可以让你采取行动。这是一个非常强大的功能。
Magento 2 开发人员
作为 Knockout.js 开发人员，您可以过着几乎不知道 observables 是如何实现的生活。 Magento 2 开发人员没有这种奢侈。 UI 组件系统大量使用可观察属性，并设置自己的订阅者。
好消息是:当你看到类似

//...
someProp: ko.observable('default value')
//...

你不必 panic 。该程序只是使用 someProp 来存储一个值。
坏消息是——observable 可能有很多订阅者。这些订阅者可能来自 Knockout.js 模板的数据绑定(bind)属性。他们可能来自 Magento 核心代码，设置了自己的订阅者。您可以通过 _subscriptions 属性查看观察者的回调次数

console.log(objectToHoldMyValue._subscriptions);
Object
change: Array[3]
    0: ko.subscription
    1: ko.subscription
    2: ko.subscription

或者像这样查看特定的回调

console.log(
objectToHoldMyValue._subscriptions.change[1].callback
);

然而——你的调试器可以控制这些信息的显示方式，并且没有简单的方法来判断特定订阅者的来源。此外，我们目前已经深入研究了 Knockout.js 的内部结构，除了调试以外的任何事情都依赖这种代码会带来巨大的不稳定可能性。”
来源: https://alanstorm.com/knockout-observables-for-javascript-programmers/