如何让自定义的Array.prototype.len与默认length属性表现一致？

要让Array.prototype.len和原生length属性行为完全一致，你需要用属性描述符定义一个带getter（可选加setter）的访问器属性，而不是定义方法或者直接赋值固定值。

为什么之前的方法不行？ #

• 第一种把len定义成方法的方式，必须调用arr.len()才能获取长度，和直接访问arr.length的体验完全不符；
• 第二种直接赋值Array.prototype.len = Array.prototype.length，只是把原型数组（Array.prototype本身是个空数组，length为0）的固定值赋给了len，所有数组实例的len都会是0，不会随数组内容变化。

正确实现 #

在你的Vue插件里，用Object.defineProperty来定义len属性：

import { createApp } from 'vue'
import App from './App.vue'

const arrayLenPlugin = {
  install() {
    Object.defineProperty(Array.prototype, 'len', {
      // 访问arr.len时触发getter，返回当前数组实例的length
      get() {
        return this.length;
      },
      // 可选：支持给arr.len赋值，同步修改数组长度
      set(value) {
        this.length = value;
      },
      // 和原生length保持一致：不可枚举，避免for...in遍历数组时被列出
      enumerable: false,
      configurable: true
    });
  }
}

const app = createApp(App)
app.use(arrayLenPlugin)
app.mount('#app')

效果验证 #

现在你可以像使用length一样使用len：

const arr = [1,2,3];
console.log(arr.len); // 输出3
arr.push(4);
console.log(arr.len); // 输出4
arr.len = 2;
console.log(arr); // 输出[1,2]

这样实现的len会和原生length完全同步，动态响应数组的变化，完美贴合你想要的Python风格使用体验。

内容的提问来源于stack exchange，提问作者Yu Da Chi