Question

我有以下代码：

var o = {};
o.a = 1;

var _value = 1;
Object.defineProperty(o,"a",{
    set: function(value){
        _value = value + 1;
        console.log("log: ", value, _value);
        return _value;
    },
    get: function(){
        return _value;
    }
});

在setter方法中，我在返回之前将_value递增1。因此，如果我设置o.a = 5，我希望控制台打印6（即使我意识到从setter返回一个值通常没有意义）。但是，如下面的代码段所示，控制台会打印5：

> o.a = 5;
log: 5 6 // from console.log;
5 // return; why does it == value and not value + 1?
> o.a;
6
> var i = o.a = 5;
> i;
5
> o.a;
6

所以我的问题是为什么它会返回5而不是6？

我希望这不是因为我在代码中犯了一些愚蠢的错误。

Answer 1

您无法从属性设置器返回任何内容，只是获取了分配的值（5，因为您已分配5）。

在setter中返回什么？

无。最好删除return语句。至多它被忽略了。

Answer 2

让我们看一下simple assignment：

11.13.1 Simple Assignment ( = )

生产 AssignmentExpression：LeftHandSideExpression = AssignmentExpression 评估如下：


让 lref 成为评估 LeftHandSideExpression 的结果。

让 rref 成为评估 AssignmentExpression 的结果。

让 rval 为GetValue（ rref ）。

因此为rval分配了将分配给左侧（o.a）的值。在您的情况下5。

如果满足以下条件，则抛出SyntaxError异常：[...]

致电PutValue（ lref ， rval ）。

这是将值分配给左侧（PutValue(o.a, 5)）的位置。如您所见，PutValue返回的内容没有任何效果（它不会返回任何内容）。

返回 rval 。

它简单地返回已分配的值，在您的情况下为5。

赋值表达式始终返回已分配的值。

Answer 3

赋值表达式的值始终等于分配的值：

var a;
console.log(a = 7); // logs 7

无论您分配的内容是变量，普通属性，setter，只读属性还是其他内容，都是如此：

var a = {};
Object.defineProperty(a, "b", { value: 8, writable: false });
console.log(a.b = 9);  // logs 9
console.log(a.b);      // logs 8, because a.b is read-only

正如你自己说的那样，setter中的返回值是没有意义的，所以当你在setter中使用返回值时，你为什么期望它实际上做了什么特别的事？

Answer 4

对我而言，如果我不做parseInt，它会把它看作一个字符串......而且，你不应该在setter上返回一个值。这段代码正在运行：

<html>
<head>
  <script language="javascript" type="text/javascript">
    var o = {};
    o.a = 1;

    var _value = 1;
    Object.defineProperty(o,"a",{
      set: function(value){
        _value = parseInt(value) + 1;
        console.log("log: ", value,_value);
      },
      get: function(){
        return _value;
      }
    });

    function setValueAndRefresh() {
      before = o.a;
      o.a = document.forms["myform"].input.value;
      alert("before: " + before + "; after: " + o.a);
    }
  </script>
</head>

<body>
  <form name="myform">
    value: <input type="text" name="input" value="5" /> <input type="button" value="set" onclick="setValueAndRefresh()"/>
  </form>
</body>
</html>

return语句在setter中做了什么？

4 个答案:

11.13.1 Simple Assignment ( = )