Object.defineProperty和proxy

Object.defineProperty問題

• Object.defineProperty() 沒法監控到數組下標的變化。vue只能經過如下幾種方法來監聽

push()
pop()
shift()
unshift()
splice()
sort()
reverse()

以上幾種方法也是通過vue內部處理後才能監聽的。

• 只能劫持對象的屬性,所以咱們須要對每一個對象的每一個屬性進行遍歷

Proxy

特色：

• 能夠劫持整個對象，並返回一個新對象
• 有13種劫持操做
• Proxy是es6提供的，兼容性很差,沒法用polyfill磨平

Proxy使用：

es6提供proxy構造函數，第一個參數target:是所要代理的目標對象，能夠是空對象。第二個handler是攔截器，一個攔截器能夠有多個攔截操做

var proxy = new Proxy(target, handler);

全部的對target的操做都落在proxy上了。

攔截操做一共有13個

更多攔截操做信息>>

Reflect

反射：經過類的類類型來操做類的屬性。包含來對象語言內部的方法，一共有13種，和proxy一一對應，若是在Proxy中調用Reflect的話，其實對應的就是默認行爲。

Proxy的this指向

雖然 Proxy 能夠代理針對目標對象的訪問， 但它不是目標對象的透明代理，即不作任何攔截的狀況下，也沒法保證與目標對象的行爲一致。主要緣由就是在 Proxy 代理的狀況下，目標對象內部的this關鍵字會指向 Proxy 代理。