js运用代理实现数组负索引_proxy(array)

熟悉Python、Ruby或Perl的同学，可能习惯了数组的负索引，它使得你可以使用负索引来逆向检索数组元素，代码如下所示：

但是我们知道 JS 中并不存在负索引这种用法，今天我们就来模拟一下负索引的实现。

function createNegativeArrayProxy(array){
      // 如果传入的参数不是数组，则抛出异常
      if(!Array.isArray(array)){
        throw new TypeError('Expected an array');
      }

      //返回新的代理，新代理用传入的数组为代理目标。
      return new Proxy(array, {
        get: (target, index)=>{
          index= +index;
          return target[index<0?target.length+index:index];
        },
        set: (target, index, val)=>{
          index = + index;
          return target[index<0?target.length+index:index]=val;
        }
      })
    }

    const arr = ['aa', 'bb', 'cc'];
    const proxyArr = createNegativeArrayProxy(arr);
    console.log(arr[-2]);//undefinded
    console.log(proxyArr[-2]);//bb
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

到这里，我们就实现了数组的负索引。但是需要注意的是，在Chrome浏览器，代理数组的执行时间大约为正常数组的50倍，在Firefox浏览器大约为20倍。因此，要谨慎使用代理，尽管使用代理可以创造性地控制对象的访问，但是大量的控制操作将带来性能问题。