重写数组的七个响应式方法

const objProxy = reactive(obj)
const infoProxy = reactive(info)
const arrProxy = reactive([1,2,3,4])

function ReactiveArr() {
  const arr = Array.apply(this, arguments)
  arr.__proto__ = ReactiveArr.prototype
  return arr
}

Object.defineProperty(ReactiveArr, 'contructor', {
  enumerable: false,
  configurable: true,
  writable: true,
  value: ReactiveArr,
})

const ways = ['push', 'pop', 'shift', 'unshift', 'reverse', 'sort', 'splice']
ways.forEach(way => {
  ReactiveArr.prototype[way] = function () {
    const result = Array.prototype[way].apply(this, arguments)
    console.log(way, ': ' + arguments[0] + ', result: ', result)
    return result
  }
})

objProxy.movies = new ReactiveArr('不能说的秘密', '大灌篮', '头文字D')

console.log(objProxy.movies)

objProxy.movies.push('黑色幽默')
objProxy.movies.pop()
objProxy.movies.splice(0, 0, '搁浅')
objProxy.movies.shift()
objProxy.movies.unshift('爱在西元前', '龙拳')
objProxy.movies[0] = 'dasdasd'

/*
* 用class的形式
*             class OBArray extends Array {
                constructor (...args) {
                    super(...args);
                }
                push (...args) {
                    const len = super.push(...args);
                    console.log('push: ' + args + ' 新的数组长度为:' + len);
                    return len;
                }
            }
            const a = new OBArray(...[1,2]);
            a.push(20); // "push: 20 新的数组长度为:3"

*
*
* */

附上源码地址:vue的array方法重写