Question

请查看功能Y＆＃34;重用＆＃34;功能X的itemCount getter。我认为我应该能够将其定义为 itemCount：x.ItemCount ，但这并不起作用。

问题：有人可以解释为什么我必须执行以下操作才能从Y返回X的itemCount吗？必须有一些能使正常功能变得特别的东西。

// Returns simple object literal with 2 properties.
function X () {
    return {
        items: {
            1: {},
            2: {}
        },
        get itemCount () {
            return Object.keys(this.items).length;
        }
    }
}

// Returns a simple object literal with the same 2 properties as its "x" arg.
function Y (x) {
    return {
        items: x.items,
        get itemCount () {
            return x.itemCount;
        }
    };
}

var x = new X();
var y = new Y(x);
y.itemCount; // returns 2

Answer 1

如果使用函数而不是getter，则必须绑定this的值。

例如：

function X () {
    return {
        items: {
            1: {},
            2: {}
        },
        itemCount: function() {
            return Object.keys(this.items).length;
        }
    }
}

function Y (x) {
    return {
        items: x.items,
        itemCount: x.itemCount.bind(x)
    };
}

当您致电x.itemCount()时，this的值位于x的上下文中，但是如果您致电y.itemCount()（y是从Y(x)创建的对象{1}}）this将位于y。

的上下文中

要解决此问题，您需要使用this绑定bind()变量。

Answer 2

您正在运行代码return x.itemCount。因此，预期return语句返回的值是itemCount上x属性的计算值 - x.itemCount可能还有什么？

如果你想在另一个对象上运行itemCount getter的代码，最好的方法是将项目计数代码提取到一个由getter使用的单独函数中：

function itemCounter(obj) {
    return Object.keys(obj.items).length
}

然后每个itemCount吸气者都可以return itemCounter(this)。

如果您无法修改x，则可以使用call的{{1}}来优雅地提取getter和this：

返回在对象文字上定义的getter？

2 个答案: