Question

我有一个像这样的JavaScript类：

Dog = (function() {
    var name;

    function setName(_name) {
        name = _name;
    }

    return {
        setName: setName,
        name: name
    };
})();

当我跑步时：

Dog.setName('Hero');

Dog.name始终未定义。

我当然错过了一些关于JS范围的内容，但是什么？

Answer 1

您返回的对象name属性的值为name 该时间点（未定义）。当IIFE中的name变量更新时，返回对象的name属性不会以某种方式动态更新。

有很多方法可以处理您似乎想要做的事情。这是一个：

Dog = (function() {
    var name;

    function setName(_name) {
        name = _name;
    }

    return Object.defineProperties({}, {
      setName: { value: setName },
      name:    { get: function() { return name; } }
    });

})();

这会将name保留为私有变量，只能通过setName设置，但提供getter属性以获取其值。

另一个答案中提出的替代方案是等效的，只是另一种写作方式：

return {
  setName:  function(n) { name = n; },
  get name: function() { return name; }
};

小点，但在这个特定的背景下，您不需要在IIFE周围使用括号：

Dog = function() { }();

会正常工作。

Answer 2

这是因为您假设对象中的name设置保留对原始name变量的引用。相反，您希望将其分配给当前对象（您可以完全忽略私有变量）。

Dog = {
  name: '',
  setName: function(n) {
    this.name = n;
  }
};

但是，如果您想保持name私有，那么您可以为其创建一个getter。

var Dog = (function() {
  var name;

  return {
    setName: function(n) {
      name = n;
    },
    get name: function() {
      return name;
    }
  };
})();

Answer 3

解决此问题的简便方法是：

Dog = (function() {

var dog = {
    setName: setName,
    name: name
};

function setName(_name) {
    dog.name = _name;
}

return dog;
}

在您的代码中，您设置了错误的name变量。

var name;

function setName(_name) {
    name = _name;
}

在此函数中，setName设置内部变量name而不是属性name。在JavaScript中，字符串是不可变的，因此当您更改它时，它会创建一个新字符串，并且不会更新现有字符串。

Answer 4

这对您来说可能是更好的模式。您正在使用非常古老的ES3样式构造函数。

kernel.json

您可能也想查看ES6课程

(function(exports) {

  function Dog(name) {
    this.name = name;
  }

  Dog.prototype.speak = function() {
    return "woof";
  };

  // other functions ...

  exports.Dog = Dog;
})(window);

var d = new Dog('Hero');
console.log(d.name); // "Hero"

Answer 5

使用＆＃39; this＆＃39;关键字。

Dog = (function() {
    var name;

    function setName(_name) {
        this.name = _name;
    }

    return {
        setName: setName,
        name: name
    };
})();
Dog.setName('Hero');
alert(Dog.name);

Answer 6

听起来你想要制作一个构造函数......请查看此示例：

function Dog(prop) {
        this.name = prop.name;
        this.color = prop.color;
    }
    var myDog = new Dog({
        name:'Sam',
        color: 'brown'
    });
    alert()
    console.log('my dog\'s name is: '+myDog.name);
    console.log('my dog\'s color is: '+myDog.color);

你可以在这里试试：http://jsfiddle.net/leojavier/ahs16jos/

我希望这有助于男人......

类中的JavaScript变量总是未定义的

6 个答案: