是否可以为普通的 JavaScript 数组对象实现“addEventListener”类型的功能？

Question

我当时正在用 JS 开发一个可视化库，想知道这样的事情是否可行？

const my_arr = [];

my_arr.addEventListener('push', (item) => {
    console.log(`${item} was pushed in my_arr`);
})


my_arr.push(3);        //should give "3 was pushed in my_arr"

Answer 1

你可以重载推送方法：

const my_arr = [];

my_arr.real_push = my_arr.push;  // save my_arr.push  real method

my_arr.push = function( item )   // overload my_arr.push  method
  {
  my_arr.real_push( item );      // perform the push...
  console.log(`${item} was pushed in my_arr`);
  }


/// test :
my_arr.push(3);  //  3 was pushed in my_arr  
my_arr.push(55); // 55 was pushed in my_arr

console.log(  my_arr) 

Answer 2

参见关于自定义事件的文档。

document.body.addEventListener('addItem', e => {
  this.my_arr.push(e.detail.item)
  cosole.log(`${item} was pushed in my_arr`)
})