Javascript:将事件侦听器附加到Array以进行Push()事件

Question

有没有办法知道用户何时(通过push())将项目推送到数组？

基本上我有一个异步脚本,允许用户将命令推送到数组.加载脚本后,它会执行命令.问题是,用户可能会在我的脚本运行后将其他命令推送到阵列上,我需要在发生这种情况时收到通知.请记住,这只是用户自己创建的常规数组.Google Analytics(分析)会执行类似的操作.

我也发现这是我认为谷歌所做的,但我不太了解代码:Aa = function(k){return Object.prototype [ha] .call(Object(k))=="[object阵列]"

我还找到了一个很好的例子,似乎涵盖了基础,但我不能让我添加的推送方法正常工作:http: //jsbin.com/ixovi4/4/edit

Answer 1

你可以使用'eventify'函数来覆盖传入数组中的push.

var eventify = function(arr, callback) {
    arr.push = function(e) {
        Array.prototype.push.call(arr, e);
        callback(arr);
    };
};

在下面的示例中,应该引发3个警报,因为这是在调用eventify之后事件处理程序(回调)所执行的操作.

var testArr = [1, 2];

testArr.push(3);

eventify(testArr, function(updatedArr) {
  alert(updatedArr.length);
});

testArr.push(4);
testArr.push(5);
testArr.push(6);

Answer 2

唯一明智的做法是编写一个包装数组的类:

function EventedArray(handler) {
   this.stack = [];
   this.mutationHandler = handler || function() {};
   this.setHandler = function(f) {
      this.mutationHandler = f;
   };
   this.callHandler = function() { 
      if(typeof this.mutationHandler === 'function') {
         this.mutationHandler();
      }
   };
   this.push = function(obj) {
      this.stack.push(obj);
      this.callHandler();
   };
   this.pop = function() {
      this.callHandler();
      return this.stack.pop();
   };
   this.getArray = function() {
      return this.stack;
   }
}

var handler = function() {
   console.log('something changed');
};

var arr = new EventedArray(handler);

//or 

var arr = new EventedArray();
arr.setHandler(handler);


arr.push('something interesting'); //logs 'something changed'

Answer 3

试试这个:

var MyArray = function() { };
MyArray.prototype = Array.prototype;
MyArray.prototype.push = function() {
    console.log('push now!');
    for(var i = 0; i < arguments.length; i++ ) {
        Array.prototype.push.call(this, arguments[i]);
    }
};

var arr = new MyArray();
arr.push(2,3,'test',1);

你可以在推或推之前添加功能