Home > OS >  Vue/Vuex: Distinguish arrays from objects in Proxy objects
Vue/Vuex: Distinguish arrays from objects in Proxy objects

Time:11-29

As stated here, reactive Vuex objects are returned as Proxy objects. This may not be a problem in most cases, but how do I determine if the Proxy originated from an array or object?

CodePudding user response:

The Proxy is a transparent layer on top of the array/object, so you would not need to determine the Proxy's original source.

The variable itself should be treated as if the Proxy layer were not there. If it's a Proxy of an Array, treat the variable as an Array, and the same for Object. Run the following code snippet for examples.

const arr = [1,2,3]
const arrProxy = new Proxy(arr, {})             // value is identical to `arr`
console.log(arrProxy.map(x => x * 10))          // => [ 10, 20, 30 ]
console.log('isArray', Array.isArray(arrProxy)) // => true

const obj = { foo: true, bar: false }
const objProxy = new Proxy(obj, {})            // value is identical to `obj`
console.log(Object.keys(objProxy))             // => [ 'foo', 'bar' ]
console.log('objArray type:', typeof objProxy) // => object
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

  • Related