InterviewSolution
| 1. |
What will the output of the following code be and why? |
|
Answer» <script> export default { data() { return { someObject: {} } }, methods:{ print(){ const newObject = {} this.someObject = newObject console.log(newObject === this.someObject)} }, mounted() { this.print(); } } </script> >> Output False. The Vue JavaScript framework is "reactive," which can automatically refresh your data. Reactivity is when changes in the application state are automatically reflected in the DOM (DOCUMENT Object Model), a programming API for HTML and XML documents. In this case, we have a Proxy object (in our case someObject) that ENABLES us to create a proxy for another object (in our case newObject), which can intercept and redefine fundamental operations for that object. When this.someObject object is accessed, the value is a reactive proxy of the original newObject. The original newObject is left unchanged and will not be made reactive. The use of Proxy does introduce a new CAUTION to be aware of: the proxied object(someObject) is not equal to the original object(newObject) in terms of identity comparison (===).That is why the actual output is false rather than true, EVEN if the value assigned to each object is the same. |
|