Vue 中再说一下 vue2.x 中如何监测数组变化？

在 Vue 2.x 中，Vue 使用了侦测数组变化的方法来实现响应式数据。Vue 的响应式系统通过一些技巧来捕获并响应对数组的变化。

Vue 2.x 中监测数组变化的方法：

1. 重写数组方法：Vue 重写了数组的一些方法（如 push、pop、shift、unshift、splice、sort 和 reverse 等），在执行这些数组方法时会触发通知。

2. 使用 Object.defineProperty：对数组的每个索引进行 Object.defineProperty 的劫持，当数组的某个索引被修改时，会触发对应属性的 setter。

这种方法的实现允许 Vue 跟踪到数组变化，从而能够在数组变动时通知相关的视图进行更新。但是，它并不监听数组内非索引属性的变化，比如直接通过索引赋值新增属性，Vue 是无法检测到的。

示例：

// 示例数组
const vm = new Vue({
  data: {
    arr: [1, 2, 3]
  }
});

// 当执行以下操作时，Vue 会检测到数组变化并触发响应
vm.arr.push(4); // 触发数组变化通知，更新视图
vm.arr[0] = 10; // 触发数组索引变化通知，更新视图

// 但是下面的操作 Vue 是无法检测到的
vm.arr[3] = 5; // 无法触发响应式更新，因为直接通过索引赋值新增属性

为了解决无法检测到的数组变化，Vue 提供了一些变异方法（Mutation Methods），如 vm.$set 或 Vue.set 可以用来向响应式对象添加响应式属性，并确保这些属性被观察。