Question

我正在试图找出代理如何运作。

所以似乎Array.observe（）似乎是deprecated，这很容易实现。无论如何，经过一些研究，似乎代理功能是可行的。

我设法创建一个可观察的数组（不确定我是否创建它的方式，但是很好地编写了），无论什么时候被推送......但是Proxy似乎拦截了每个proto功能。所以我似乎无法获得长度，也不能简单地使用它的索引检索一个值，没有......

出于设计原因，我不能拥有2个数组，那么我如何设法继续使用数组功能，但只观察它的推送功能？

function observableArray (arr, callback) {
  console.log('create observableArray');
  return new Proxy(arr, {
    'get': function (target, prop) {
      console.log('prop', prop);
      if (prop === 'push') {
        return function (elem) {
          console.log('pushed element', elem);
          console.log('callback', callback);
          return Array.prototype[prop].apply(target, arguments);
        }
      }
    }
  });
}

var list = [1, 2, 3];

list = observableArray(list, function () {
  console.log('test');
});

list.push(4);

console.log('list', list);

// Doesn't work, is being intercepted
for(var i = 0; i < list.length; i++) {
  console.log(list[i]);
}

Answer 1

最后在休息后自己找到它：）

您只需要返回使用的道具。像这样：

function createObservableArray (arr, callback) {
    console.log('create observableArray');
    return new Proxy(arr, {
        'get': function (target, prop) {
            console.log('prop', prop);
            if (prop === 'push') {
                return function (elem) {
                    console.log('pushed element', elem);
                    console.log('callback', callback);
                    return Array.prototype[prop].apply(target, arguments);
                }
            }
            return target[prop]; // <-
        }
    });
}

使用Proxy的可观察数组删除了Array功能

1 个答案: