如何在Javascript中使用getter和setter

Question

有人可以向我解释为什么这段简单的代码无效吗？

var user = {
    get name() {
        return this.name;
    },    
    set name(value) {
        this.name = value;
    }
};
user.name = 'David';

当我把它放在Firefox 21.0的Firebug控制台中时，它给了我这个错误：

InternalError: too much recursion
this.name = value;

为什么呢？在Javascript中定义getter和setter的正确方法是什么？

Answer 1

当您尝试设置name时，该功能将设置this.name = value。

但该功能现在正在尝试设置name。因此，它会再次调用该函数并将this.name设置为value。

但该功能现在正在尝试设置name。因此，它会再次调用该函数并将this.name设置为value。

但该功能现在正在尝试设置name。因此，它会再次调用该函数并将this.name设置为value。

.......稍后......

但该功能现在正在尝试设置name。因此，它会再次调用该函数并将this.name设置为value。

但是浏览器已经确定调用堆栈太深，函数调用了太多次，因此为了防止完全崩溃，它会导致函数失败并显示您看到的错误。

---

尝试使用其他属性名称（例如this._name）来存储和检索值。

Answer 2

你的二传手正在自言自语。

这是一个解决方案：

var user = {
    get name() {
        return this._name;
    },    
    set name(value) {
        this._name = value;
    }
};
user.name = 'David';

附注：请注意IE8中不支持get和set运算符。

Answer 3

尝试，

var user = {
    get name() {
        return this._name;
    },    
    set name(value) {
        this._name = value;
    }
};
user.name = 'David';

请注意使用_name代替name。在name的setter中设置name的值是一个递归调用，因此是例外。