javascript - 为什么 jQuery 的深层复制不复制描述性属性？

Question

同时了解Object.defineProperty() ，我正在为深度克隆的对象尝试它。考虑以下片段，

var obj = {};
Object.defineProperty(obj, 'key', {
  get: () => {return key},
  set: (value) => {
          if (typeof(value) == 'number'){
              key = value;
          }
       }
});

obj.key = 54;
console.log(obj.key);                 // Output: 54
obj.key = ['a', 'b'];
console.log(obj.key);                 // Output: 54

var clone = $.extend(true, {}, obj);

clone.key = 44;
console.log(obj.key, clone.key);      // Output: 54 44
clone.key = 'hello';
console.log(clone.key);               // Output: hello

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

为什么 jQuery 创建的克隆不维护对象的原始 getter 和 setter。如果我确实需要此功能，我如何才能使深度克隆的对象具有与其父对象相同的 getter 和 setter？

Answer 1

当您使用 Object.defineProperty 定义属性时，使用 set 的描述符，您可以为要更改的值添加一个事件。此事件与对象的引用相关联。

当您使用 $.extend 时，它所做的是复制它的值。

以下是$.extend的部分代码

for (; i < length; i++) {

  // Only deal with non-null/undefined values
  if ((options = arguments[i]) != null) {

    // Extend the base object
    for (name in options) {
      src = target[name];
      copy = options[name];

如您所见，只有值被复制。未复制描述符的原因可能是，拥有描述符的意图将仅特定于该对象而不是其子对象。

Object.assign 也共享此行为

var obj = {};
Object.defineProperty(obj, 'key', {
  get: () => {
    return key
  },
  set: (value) => {
    if (typeof(value) == 'number') {
      key = value;
    }
  }
});

obj.key = 54;
console.log(obj.key); // Output: 54
obj.key = ['a', 'b'];
console.log(obj.key); // Output: 54

var clone = Object.assign({}, obj)

clone.key = 44;
console.log(obj.key, clone.key); // Output: 54 44
clone.key = 'hello';
console.log(clone.key); // Output: hello