Javascript getter - 为什么它在构造时被调用？

Question

我是 Javascript getters/setters 的新手，但想在我的基于 Leaflet 和 browserify 的项目中使用它们。有惊喜。

在类自己的 initialize 方法(Leaflet 构造回调)开始运行之前，getter 在初始化时被调用，出于某种我不知道的原因。这当然意味着成员未定义并且全部分解。这是为什么？

• 这是 JavaScript getter 的一般行为吗？
• 这是由 Leaflet 引起的(可能是其中的错误)？

不幸的是，我没有 jsfiddle 来展示这一点 - 这可能是由于 Leaflet，或者是由于 node.js 之类的模块化构建(通过 browserify)。

代码如下:

/*
 * Temp.js
 */
"use strict";

module.exports = L.Class.extend( {

  initialize: function () {
    console.log("initialized");
  },

  // --- Public methods ---

  get some () {
    console.log("getter");
    return 42;
  },

  set some (v) {
    console.log("setter: "+v);
  }

});

调用代码:

// this just for experiments
//
var Temp = require('./src/Temp.js');
var xxx = new Temp();

产生输出:

[Log] getter (out.js, line 2102)
[Log] initialized (out.js, line 2096)

那么:什么可以调用 get？

使用:Safari 8.0.6 (OS X)，Leaflet 当前 master，Browserify 10.1.0

附录:

调试，调用getter的那一行是this one在传单中。

Answer 1

我不能代表 Leaflet，但是 extend 的通常实现有一个看起来像这样的循环:

var propertyName;
for (propertyName in source) {
    dest[propertyName] = source[propertyName];
}

如您所见，读取您调用 extends 时的属性值(并存储结果值，而不是 getter 函数) .

您需要查看文档，但我怀疑 L.Class.extend 是否与 getter/setter 兼容。您可能需要在 initialize 中定义这些 getter/setter，例如:

var somePropDef = {
  get: function() {
    console.log("some getter");
    return 42;
  },
  set: function(v) {
    console.log("some setter: "+v);
  }
};
module.exports = L.Class.extend( {

  initialize: function () {
    Object.defineProperty(this, "some", somePropDef);
    console.log("initialized");
  },
});