Question

我已经看到了在模块模式中实现getter / setter的两种不同方法。一个使用＆＃34; defineProperty＆＃34;，而另一个不使用。一个与另一个的优点/缺点是什么？

var MyModule = (function() {

  var _val;

  var api = {
    get value1() {
      return _val
    },
    set value1(value) {
      _val = value
    }
  };

  Object.defineProperty(api, 'value2', {
    get: function() {
      return _val;
    },
    set: function(value) {
      _val = value
    }
  });
  return api;

}());

https://plnkr.co/edit/TbJSD4noZTew8II83eTH?p=preview

Answer 1

使用getter syntax创建一个属性，在ES2015之前，您必须知道编写代码时的名称。

Object.defineProperty允许您执行与上述相同的操作，但即使在ES2015之前，也不需要您知道高级属性的名称。它还允许您决定属性是可配置的，可枚举的还是可写的，这是使用get/set语法无法实现的。

回答你的确切问题：两者都没有更好。它们适用于不同的情况。 get/set语法更易于读写，但不如Object.defineProperty强大。

Answer 2

如文档中所述。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty

通过赋值添加正常属性会创建在属性枚举期间显示的属性（对于... in循环或Object.keys方法），其值可能会更改，并且可能会被删除。此方法允许从默认值更改这些额外的详细信息。默认情况下，使用Object.defineProperty（）添加的值是不可变的。

Answer 3

一个优点＆＃34; Object.defineProperty与get / set表示法的关系是，defineProperty可以在任何时候使用，甚至可以在已经创建的对象上使用（在这些对象上你不能使用速记＆＃39; get＆＃39;表示法）。来自mdn：

To append a getter to an existing object later at any time, use Object.defineProperty().

模块模式中get / set和Object.defineProperty之间的差异

3 个答案: