如何在JavaScript Proxy中正确拦截sort数组方法？

问题原因 #

• Proxy 仅支持 ECMAScript 标准规定的固定陷阱列表，不存在 sort 这个独立陷阱。数组的 sort 本质是挂载在数组原型上的方法属性，访问 proxy.sort 的操作本质是触发 get 陷阱，读取 key 为 sort 的属性，你在 handler 中直接配置 sort 字段不属于 Proxy 的有效规则，自然不会生效。
• 另外你代码中用到的 Reflect.sort 是不存在的 API，Reflect 对象的方法和 Proxy 陷阱一一对应，没有提供 sort 相关的静态方法。

正确实现方案 #

只需要在现有的 get 陷阱中判断当前访问的属性名是否为 sort，如果是就返回自定义的拦截包装函数即可，示例代码如下：

function get(target, prop, receiver) {
  console.log("Intercepted get: " + prop);
  // 匹配到sort方法访问时返回拦截函数
  if (prop === 'sort') {
    return function(...args) {
      console.log("Intercepted sort");
      // 调用原始sort方法，绑定正确的执行上下文，透传入参
      return Reflect.apply(Array.prototype.sort, target, args);
    }
  }
  return Reflect.get(target, prop, receiver);
}
const handler = { get };
const proxy = new Proxy([7, 1, 2, 3, 4, 5], handler);

// 测试调用
proxy.sort((a, b) => b - a);
console.log(proxy); // 输出倒序后的数组 [7,5,4,3,2,1]

如果需要拦截其他数组方法（比如 push、shift 等），也可以用同样的逻辑，在 get 陷阱中补充对应属性名的判断即可。

内容的提问来源于stack exchange，提问作者Blue Granny