Question

我很容易理解它在C＃中是如何工作的，但在Javascript中我有点困惑。这是我写的一个小测试代码：

  function Lunch(name,price)
  {     
    var priceChanging = [], priceChanged = [];

    this.name = function(val)
    {
        return name;
    }
    this.price = function(val)
    {
        if(val !== price && val !== undefined )
         {
            for(var i = 0; i < priceChanging.length; i++)
            {
                if(!priceChanging[i](this,val))
                {
                    return price;
                }                   
            }
            price = val;
            for(var i = 0; i < priceChanged.length; i++)            
              { 
                priceChanged[i](this);
              }     
         }
        return price;
    }

    this.OnPriceChanging = function(val)    
    {
         priceChanging.push(val);
    }
    this.OnPriceChanged = function(val)     
    {
         priceChanged.push(val);
    }
 }

var order = new Lunch("Fish and Chips",20);

console.log(order.name());
console.log(order.price());

order.OnPriceChanging(function(name,price)
{
    if(price > 30)
    {
        console.log("Price too high");
        return false;
    }
    return true;

});

order.OnPriceChanged(function(name)
{
    console.log("Price changed to: $" + name.price());
});

它运行正常，我希望能够向自己解释它。我现在不在调试器前面，只是使用了记事本。我只是把它想象成.NET，将订阅者放在一个容器中，我只是好奇它是如何在Javascript中运行的。

OnPriceChanging和OnPriceChanged函数是否在您添加/更改价格时自动调用自己？我想我对Javascript的松散输入方式感到不舒服。

与往常一样，我非常感谢所有传授的知识。

Answer 1

这真的很简单。您有两个存储函数的数组：

var priceChanging = [], priceChanged = [];

有两种方法可以将函数推送到数组中：

this.OnPriceChanging = function(val)    
{
     priceChanging.push(val);
}
this.OnPriceChanged = function(val)     
{
     priceChanged.push(val);
}

然后将函数推送到数组中：

order.OnPriceChanging(function(name,price)
{
    if(price > 30)
    {
        console.log("Price too high");
        return false;
    }
    return true;
});

order.OnPriceChanged(function(name)
{
    console.log("Price changed to: $" + name.price());
});

请注意，如果您不习惯查看匿名函数，则上述代码可能会造成混淆。它们与此完全相同：

function priceChangingCallback (name,price)
{
    if(price > 30)
    {
        console.log("Price too high");
        return false;
    }
    return true;
}

function priceChangedCallback (name)
{
    console.log("Price changed to: $" + name.price());
})

order.OnPriceChanging(priceChangingCallback);
order.OnPriceChanged(priceChangedCallback);

所以你看，数组priceChanging和priceChanged现在都应该包含一个函数。

OnPriceChanging和OnPriceChanged函数是否在您添加/更改价格时自动调用自己？

不，他们没有。事实上，确切地说，它不是被调用的OnPriceChanging和OnPriceChanged。它在数组priceChanging和priceChanged内的函数。而且他们不会自称。你打电话给他们：

this.price = function(val)
{
    if(val !== price && val !== undefined )
     {
        for(var i = 0; i < priceChanging.length; i++)
        {
            if(!priceChanging[i](this,val)) // <--- you're calling it here!!
            {
                return price;
            }                   
        }
        price = val;
        for(var i = 0; i < priceChanged.length; i++)            
          { 
            priceChanged[i](this); // <-- you're calling it here!!
          }     
     }
    return price;
}

您正在调用for循环内的priceChanging和priceChanged数组内的所有函数。使用OnPriceChanging和OnPriceChanged方法添加到数组的函数。

Javascript中的Observable模式如何工作？

1 个答案: