在JavaScript编写C＃的扩展淘汰赛可观察

Question

考虑下面的代码：

if (countriesLookup()) { 
    countriesLookup().fill(initialData.Countries); 
} else { 
    const subscription = countriesLookup.subscribe(function (lookup) { 
     lookup.fill(initialData.Countries); 
     subscription.dispose(); 
    }); 
} 

在这里，我有一个ko.observable countriesLookup。如果在数据初始化的时候，组件本身还没有初始化（countriesLookup() == undefined），我订阅了这个observable，当它最终获得组件时，我使用初始数据执行初始化并摆脱订阅。

让我们暂时忘记这种方法导致回调地狱等等，并考虑可能的方法来使这个不那么丑陋。

我想写的东西，如C＃扩展可观察到的，将是这样的使用：

countriesLookup.initialize(x => x.fill(initialData.Countries)); 

及实施设像她那样：

ko.observable.prototype.initialize = function(initializeFunc) { 
    const currentValue = ??? 
    if (currentValue()) { 
     initializeFunc(currentValue()); 
    } else { 
     const subscription = currentValue.subscribe(function (lookup) { 
      initializeFunc(lookup); 
      subscription.dispose(); 
     }); 
    } 
} 

显然，这不工作，尤其是因为我不确定是否有可能在“扩展”方法内获得可观察值的当前值。

我目前正在思考C＃编程方面的问题，在这方面我有点熟练，并且非常希望能够写出如何扩展的一些建议。

---

也许我应该多解释我的问题。我知道当前值可以在原型中添加方法this中检索，但问题在于observable返回一个函数。

例如，这

String.prototype.SayHi = function SayHi() { 
    return "Hi " + this + "!"; 
}; 
"blah".SayHi();  //return "Hi blah!" 

作品就好了，但这

ko.observable.prototype.SayHi = function SayHi() { 
    return "Hi " + this + "!"; 
}; 
var a = ko.observable("blah") 
a.SayHi(); 

失败，出现以下错误：

VM543:1 Uncaught TypeError: a.SayHi is not a function at <anonymous>:1:3

我希望它增加了一些澄清。

Answer 1

如果我明白了你的观点，你的目标是为观察者添加一个自定义函数。
在这种情况下，您应该使用fn而不是prototype。
看看这个链接：http://knockoutjs.com/documentation/fn.html

I am not sure if this is possible to get the current value of observable inside the "extension" method

，你可以得到使用这种方法，您观察到的电流值，因此您上面的例子是非常接近你想要什么。

ko.observable.fn.initialize = function(initializeFunc) { 
 
    const currentValue = this; 
 
    if (currentValue()) { 
 
    initializeFunc(currentValue()); 
 
    } else { 
 
    const subscription = currentValue.subscribe(function(lookup) { 
 
     initializeFunc(lookup); 
 
     subscription.dispose(); 
 
    }); 
 
    } 
 
    return this; 
 
} 
 

 
var ViewModel = function() { 
 
    this.data = ko.observable().initialize(x => console.log("Value changed to: " + x)); 
 
    this.data("100"); 
 
}; 
 

 
ko.applyBindings(new ViewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

================================
注意：有一个关于为什么使用fn而不是prototype的讨论，有人指出，出于某些性能原因，最好使用extenders。
请阅读这里：https://github.com/knockout/knockout/issues/979