javascript - 一些 javascript 元编程和可链接 setter

Question

我需要“可链接”的 setter ，允许您执行以下操作:

cool_shoes = new Shoes().color('glitter').style('platform')
console.log(cool_shoes.color()) // => 'glitter'

但是我已经厌倦了一遍又一遍地编写相同的 getter 和 setter 代码，即:

function Shoes() { this._color = null; this._style = null; }
Shoes.prototype.constructor = Shoes;

Shoes.prototype.color = function(arg) {
    if (arguments.length === 0) {
        return this._color;  // _slot accessor
    } else {
        this._color = arg;   // _slot setter
        return this;
    };
};

Shoes.prototype.style = function(arg) {
    if (arguments.length === 0) {
        return this._style;  // _slot accessor
    } else {
        this._style = arg;   // _slot setter
        return this;
    };
};

我的意思是，这确实有效，但是当您应该能够执行以下操作时，就会出现大量重复:

function createGetterSetter(getter, setter) {
    return function(arg) {
        if (arguments.length === 0) {
            return getter();
        } else {
            setter(arg);
            return this;
        };
    };
};

然后像这样使用它:

Shoes.prototype.color = createGetterSetter(
    function() { return this._color; },
    function(arg) { this._color = arg; });

Shoes.prototype.style = createGetterSetter(
    function() { return this._style; },
    function(arg) { this._style = arg; });

当然，任何勤奋的 javascript 向导都知道，它不会工作:当 getter 或 时，this 不会绑定(bind)到正确的值。 >setter 被调用。

尽管我尽了最大努力将 .bind(this) 撒在所有正确的位置，但我仍然没有让它发挥作用。这应该相对简单，但是我缺少什么？

更新

这里有一些富有想象力和优雅的答案，我仍然选择Bryan Chen's answer由于之前的默认原因:我的 setter 和 getter 需要做的不仅仅是简单地引用对象属性。例如，在我的实际应用程序中，我对 createGetterSetter 的调用如下所示:

Command.prototype.messageType = utils.createGetterSetter(
    function() { return messageType(this._payload).toString(); },
    function(str) { messageType(this._payload).write(str); });

...因此，仅在对象中获取或设置插槽的解决方案在我的情况下不起作用。但谢谢大家的精彩回答!

Answer 1

如您所知，问题是 this 未在 getter 和 setter 上设置，那么为什么不设置它呢？

function createGetterSetter(getter, setter) {
  return function(arg) {
    if (arguments.length === 0) {
      return getter.call(this); // pass this to getter
    } else {
      setter.call(this, arg); // pass this to setter
      return this;
    };
  };
};

function Shoes() { this._color = null; this._style = null; }
Shoes.prototype.constructor = Shoes;

Shoes.prototype.color = createGetterSetter(
    function() { return this._color; },
    function(arg) { this._color = arg; });

Shoes.prototype.style = createGetterSetter(
    function() { return this._style; },
    function(arg) { this._style = arg; });

var cool_shoes = new Shoes().color('glitter').style('platform')
document.write(cool_shoes.color())