Javascript getter/setter 的奇怪行为答案

【问题标题】：Weird behavior with Javascript getter/settersJavascript getter/setter 的奇怪行为
【发布时间】：2012-05-04 17:50:30
【问题描述】：

我正在尝试创建一个对象，该对象自动为对象的新实例定义 getter/setter。我希望 setter 将值放在一个名为 newValues 的单独对象属性中。为什么在下面的代码 sn-p 中设置 prop1 的值实际上设置了 newValues.prop2 而不是 newValues.prop1 的值？

我在这里做了什么傻事吗？这是完全有可能的，因为我只睡了几个小时...... :)

var Record = function(data) {
  this.fieldValues = {}
  this._data = data;
  var record = this;
  for(var key in data) {
    record.__defineGetter__(key, function() {
      return record._data[key];
    });
    record.__defineSetter__(key, function(val) {
      record.fieldValues[key] = val;
    });
  }
}

var myRecord = new Record({prop1: 'prop1test', prop2: 'prop2test'});

myRecord.prop1 = 'newvalue';

console.log(myRecord.fieldValues.prop1); // undefined
console.log(myRecord.fieldValues.prop2); // 'newvalue'

【问题讨论】：

标签： javascript node.js object getter-setter

【解决方案1】：

因为当您最终使用为 getter/setter 创建的函数时，key 具有其最终值。您需要为循环的每次迭代关闭 key 的值。 JavaScript 有函数作用域，而不是块作用域。

var Record = function(data) {
    var key;
    this.fieldValues = {}
    this._data = data;
    for(key in data) {
        //closure maintains state of "key" variable
        //without being overwritten each iteration
        (function (record, key) {
            record.__defineGetter__(key, function() {
                return record._data[key];
            });
            record.__defineSetter__(key, function(val) {
                record.fieldValues[key] = val;
            });
        }(this, key));
    }
}

【讨论】：

非常感谢。愚蠢的错误。

【解决方案2】：

这是人们在 JS 中遇到的常见问题：循环中的闭包问题。

这很好地解释了它以及解决方案：http://www.mennovanslooten.nl/blog/post/62

【讨论】：