功能行为混乱

Function behavior confusion

本文关键字：混乱 功能      更新时间：2023-09-26

我很困惑为什么下面的代码只提醒b2值。b1怎么了？需要帮助

var B = (function(){
    var name = "";
  return function(n){
     name = n;
    this.sayHello = function(){
          alert("Hi " + name);
     }
  }
})()
var b1 = new B("xxx");
var b2 = new B("yyy");
b1.sayHello();
b2.sayHello();

如果在闭包中声明name，它将起作用。我的猜测是，如果你不在其范围内声明该变量，闭包将始终使用name的外部声明版本，在你的例子中，它将始终是yyy，因为这是它设置为的最后一个值。

var B = (function () {
    return function (n) {
        var name = n || 'David';
        this.sayHello = function () {
            alert("Hi " + name);
        }
    }
})()

演示

注意，为了防止在构造函数中未传递任何内容时创建错误，我添加了一个默认选项，在本例中为"David"。

要测试的正确代码如下：

var B = (function(){
    var name = "";
  return function(n){
     name = n;
    this.sayHello = function(){
          alert("Hi " + name);
     }
  }
})()
var b1 = new B("xxx");
b1.sayHello();
var b2 = new B("yyy");
b2.sayHello();

如果您先调用var b1 = new B("xxx");，然后调用var b2 = new B("yyy");，则变量name将被覆盖，从而导致您注意到的奇怪行为。

演示

相关文章：