JavaScript 内部函数打印先前的值

Question

虽然这样的代码可能不是最佳实践，但我前几天工作时遇到了一些奇怪的事情。将其重新创建为一个简单的示例，我希望以下代码先警报“狗”，然后警报“猫”，但它却警报“狗”两次。根据我对 JavaScript 闭包的理解，这对我来说似乎是非常奇怪的行为。有人对此有很好的解释吗？

var printMan = {
    printer: function(animal){
        this.innerPrinter =  this.innerPrinter || function(){
             alert(animal)   
        }
        this.innerPrinter(animal)
    }
}

printMan.printer('dog' )
printMan.printer('cat') 

这是Fiddle

编辑-----感谢大家的精彩解释。这是我喜欢这门语言的原因之一 - 这里有一个很棒的社区。我以为我对这门语言了解很多，但我对这个函数如何工作的理解是错误的。对于阅读本文的任何人来说，最好不要做类似这个例子的事情。

Answer 1

您分配给 this.innerPrinter 的函数在其定义中没有任何参数:

function(){
    alert(animal)   
}

因此，当您使用 this.innerPrinter(animal) 调用它时，它会忽略该参数并从更广泛的范围(即 printer: function (动物){)。

第一次调用printer时，该对象没有innerPrinter值，因此您为其分配一个新函数。

此函数是在printer第一次调用的范围内声明的，因此animal是'dog'。它会提醒'dog'。

第二次调用该函数时，this.innerPrinter 已经有了值，因此 this.innerPrinter || function(){ 计算为第一次调用的函数。因此，它会发出警报 'dog'，因为这是从函数表达式生成的第一个函数的 animal 值。