Why is the Proxy API used in Vue 3.0 instead of the defineProperty API?
One: Disadvantages of the defineProperty API
1) Vue2 responds to data by hijacking the getter and setter functions in Object.defineProperty
2) Cannot directly listen to add and delete attributes
Can’t listen on arrays directly (although the array is overwritten by hack, it can only listen on 7 arrays) Advantages of Proxy 1) As a new API to replace defineProperty in VUe3, it is equivalent to adding a layer of interception to the outer layer of an object. This layer of interception can do many operations, such as [filtering] [modifying] or [collecting data information].
2) Because the interception is performed on the entire outer layer of the object, it is possible to operate on the attributes of the object and listen for the attributes of the [add] and [delete].
3) Proxy can listen for array changes
Proxy application Scenario 1) Data response: Intercept data before reading and setting data, collect data dependency in the intercept trap, and trigger view update
2) Realize the negative index access of array
3) Get the corresponding value of the attribute, in the case that the value has no return value or is undefined
4: Disadvantages of Proxy 1) Poor compatibility, the new API in VUe3 has certain disadvantages, so the key point is that it is not fully compatible with browsers, the lower version of some browsers is not compatible, qq browser, IE browser, Baidu browser is completely incompatible
2) Performance problem, Proxy performance is worse than promise performance
Five: Note: When using Proxy, you need to weigh its performance and practicality before using it