如何在Javascript中使用getter和setter

Can somebody please explain to me why this simple piece of code is not working?

谁能给我解释一下为什么这个简单的代码不能工作?

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

When I put this in the Firebug console in Firefox 21.0 it gives me this error:

当我把这个放到Firefox 21.0的Firebug控制台时，它会给我一个错误:

InternalError: too much recursion
this.name = value;

Why? What is the proper way to define getters and setters in Javascript?

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

3 个解决方案

#1

When you attempt to set name, the function will set this.name = value.

当您尝试设置名称时，函数将设置this.name = value。

But the function is now attempting to set name. Therefore it will call the function again and set this.name to value.

但是函数现在正在尝试设置名称。因此，它将再次调用该函数并将其设置为值。

But the function is now attempting to set name. Therefore it will call the function again and set this.name to value.

但是函数现在正在尝试设置名称。因此，它将再次调用该函数并将其设置为值。

But the function is now attempting to set name. Therefore it will call the function again and set this.name to value.

但是函数现在正在尝试设置名称。因此，它将再次调用该函数并将其设置为值。

....... SOME TIME LATER .......

.......一段时间以后.......

But the function is now attempting to set name. Therefore it will call the function again and set this.name to value.

但是函数现在正在尝试设置名称。因此，它将再次调用该函数并将其设置为值。

But the browser has determined that the call stack is too deep, the function has called itself too many times, and therefore to prevent a complete crash it causes the function to fail with the error you see.

但是浏览器已经确定调用堆栈太深，函数已经调用了太多次，因此为了防止完全崩溃，它会导致函数在出现错误时失败。

---

Try using a different property name, such as this._name, to store and retrieve the value.

尝试使用不同的属性名，比如这个。_name，用于存储和检索值。

#2

Your setter is calling itself.

你的setter正在调用自己。

Here's a solution :

这里有一个解决方案:

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

Side note : Be careful that the get and set operators aren't supported in IE8.

附加说明:注意，在IE8中不支持get和set操作符。

#3

Try,

试,

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

Note the use of _name instead of name. Setting the value of name in the setter of name is a recursive call, hence the exception.

注意使用_name而不是name。在name的setter中设置name值是递归调用，因此出现异常。