VUE中的data数据为什么需要return

                                                                                     VUE中的data数据为什么需要return

每次面试都会问到的问题

              直接上代码

 var obj={
        name:"zhangsan",
        age:20
      }
      var a=obj;
      var b=obj;
      a.age=18
      console.log(a,b)   // {name: "zhangsan", age: 18} {name: "zhangsan", age: 18}

你不难发现，当我直接修改这个值的时候，a，和b都修改了，这是js中赋值对象时，只是赋值了该对象的地址，而并没有深拷贝其中的值

 这是为什么呢 因为JS中Object是引用数据类型,我定义变量a和b等于obj对象时只是进行了对象的浅拷贝，a和b的值其实只是一个指向obj对象的地址(也就是栈)，
在我修改a.age时，JS 会通过变量a这个路径 去找到obj对象的堆空间里面的值，进行修改。。。在我输出 a,b时，都是通过栈空间里面的这条路径，去找到堆

接下来我们再实现，用return的方式

var data=function(){
        return{
          name:"zhangsan",
          age:20
        }
      }
      var a=data();
      var b=data();
      a.age=18
      console.log(a,b)   //{name: "zhangsan", age: 18} {name: "zhangsan", age: 20}

这又是为什么呢？因为在JS 中只有函数才存在作用域,data是一个函数时，每个组件实例都有自己的作用域，每个实例相互独立,不会相互影响！！又学到了。也解释了自己的疑惑，分享给大家。

如果你学到了，请帮忙点赞，评论，转发，收藏，或者打赏，谢谢了。