为什么组件data必须用函数表达,深入理解
2020-06-07 04:46
253 查看
1、首先我们做一个类比,如下代码:
对三个不同的变量obj1,obj2,obj3进行赋值,并且都是调用方法abc(),也就是说创建了三个不一样的实例,所以返回的此方法返回的值,就被赋值给了不同的地址。
因此这三个变量的内存地址是不同的,此时改变其中一个变量的值,其他两个变量的值是不会跟随发生改变的。
2、我们此时在做一个类比,如下图:
我们首先声明一个常量obj(假设被储存在内存地址0x100),再写一个函数abc()其返回值为刚刚定义的常量obj(返回的值指向地址0x100)。
所以我们对三个变量obj1,obj2,obj3进行赋值abc(),都是指向0x100的地址,此时更改其中一个变量的值,我们就会发现其他两个变量的值也随之改变。如下图解释:
3、我们回过头来看当前组件
当前组件为,如果我们在实例中多次使用当前组件的话如下:
如果我们把组件里面的data改成一个对象的话,如下图:
data此时是一个对象,里面存放着很多数据,都是指向同一个地址。
此时如果重复的使用相同的当前组件,每一个组件用的值都是从这个data:{}对象中取得(也就是说都是从同一个地址中取值),就对组件之间造成了相互干扰。
同理,我们就可以知道组件中的data使用函数然后返回一个对象的话,就不会存在这个问题了,因为在创建不同组件的时候,会return出不同地址的对象,并不存在干扰组件之间的数据绑定之类的问题
相关文章推荐
- Vue 组件中 data 为什么必须是函数?
- Vue组件中data选项为什么必须是函数
- 组件data存放及为什么必须是函数~VUE学习笔记(4)
- Vue组件data必须是函数的理解
- Vue 组件中的data为什么必须是函数
- 为什么Vue子组件中的data必须是函数?
- vue组件中 data 为什么是一个函数
- 深入理解javascript的作用域--函数声明为什么会前置
- jQuery源码分析之深入理解jQuery.data,jQuery._data以及data实例函数十八问
- vue组件中data必须要写成函数的原因
- vue 为什么组件的data要写成返回对象的函数
- Vue的组件中data必须是函数,其返回值是一个对象
- Vue 组件 data为什么是函数?
- vue-为什么子组件中的data选项必须是函数?
- 为什么vue中data必须是一个函数
- Vue 组件 data为什么是函数?
- 为什么vue中data必须是一个函数
- 为什么基类的析构函数必须为虚函数的原因-个人理解
- 关于js深入理解:json作为函数参数 类似于jQuery的post函数,具有url,data ,和回调函数
- 为什么Vue组件中的data是一个函数原理(详细易懂)