为什么data是一个函数？

最新推荐文章于 2023-12-24 19:37:45 发布
最新推荐文章于 2023-12-24 19:37:45 发布
阅读量326 收藏
点赞数
分类专栏： 小吴的vue学习之路 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42337801/article/details/107976534
版权

首先： 这是一个我注册的一个组件，里面data存放了内容
Vue.component(‘cpn’, {
data: function(){
return {
count: 0
}
},
我们要知道组件是一个独立单功能的组件，他有独立的html代码，那么当然，他有自己独立的数据，
也应该有自己单独存放数据的地方，和其他的组件区分开来，以免其他组件数据改变，影响当前组件的data,避免产生冲突，

可爱的橙子大爷
关注
专栏目录
前端开发：关于Vue组件中的data属性值是函数而不是对象的详解
软贱开发攻城狮
10-29 2137
最近在搞关于前端开发的基础知识归纳，发现了不少经典知识点，那么本篇博文就来分享一个经典的知识点：Vue组件中的data属性值为什么是函数而不是对象。 首先来了解一下Vue组件的使用理念：在Vue组件使用中，组件复用是需要秉承的理念，组件创建好之初就要考虑到后期可复用性，考虑到可复用性，那么就涉及到组件中data数据是要相互独立、互不影响的，不管组件复用多少次，data数据都要被复制一遍，这样当某一处复用的组件数据发生变化的时候，其他地方的复用组件的data数据不受影响。而且由于JS的特性所致的原因，在co
Vue组件为什么data必须是一个函数
11-20
前言 我们需要先复习下原型链的知识，其实这个问题取决于 js ，而并非是 vue 。 function Component(){ this.data = this.data } Component.prototype.data = { name:'jack', age:22, } 首先我们达成一个共识（没有这个共识，请补充下 js 原型链部分的知识）： 实例它们构造函数内的this内容是不一样的。 Component.prototype ，这类底下的方法或者值，都是所有实例公用的。 解开疑问 基于此，我们来看看这个问题： function Component(){ }
data 为什么是一个函数
最新发布
NXZ13419918873的博客
12-24 955
在前端开发中，特别是在使用Vue.js框架时，"data" 通常是一个函数，而不是一个变量。这是因为在Vue组件中，"data" 是一个函数，用于返回包含组件状态的对象。
为什么data是一个函数
jia632133535的博客
12-27 527
为什么data是一个函数 1.根实例对象data可以是对象也可以是函数（根实例是单例），不会产生数据污染情况。 如果是一个对象的话，每个组件实例的data都是同一个引用数据，当该组件作为公共组件共享使用，一个地方的data更改，所有的data一起改变，如果data是一个函数，每个实例的data都在闭包中，就不会各自影响了。 ...
data为什么是一个函数
weixin_49757430的博客
04-29 496
组件中data为什么是一个函数？ vue实例中的data属性既可以是一个对象，也可以是一个函数 const app = new Vue({ el: "#app", data: { foo: "foo" }, data() { return {
简单理解Vue的data为啥只能是函数
郊眠寺
11-07 2036
在学习vue的时候vue2只有在组件中严格要求data必须是一个函数，而在普通vue实例中，data可以是一个对象，但是在vue3出现后data必须一个函数，当时看着官方文档说的是好像是对象的引用问题，但是内部原理却不是很了解，今天通过一个简单的例子来说明为啥data必须是一个函数整理了一套《前端大厂面试宝典》，包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法，一共201道面试题，并对每个问题作出了回答和解析。
Vue2|为什么vue组件中的data是函数而不是对象？
weixin_62395055的博客
02-18 2184
初学vue的小伙伴可能会感到疑惑，为什么在vue实例中存取变量的data是一个对象，而组件中的data不是一个对象而是一个函数？ 我们先来看这个例子 function foo() { return { name: 'sherry', age: 18 } } let obj1 = foo() let obj2 = foo() let obj3 = foo() obj1.n...
Vue源码解析：this.$data、this._data、this.xxx 为什么都能获取数据？data为什么是个函数？
热门推荐
全端菜鸟小姐
12-26 2万+
data中定义了一个数据msg, vue实例上访问这个数据有两种方式，this.$data.msg 和 this.msg，请问，为vue如何实现this.msg能直接访问到data中的msg变量？？？data又为什么是个函数？ 分析： clone 下 vue 的项目源码，然后打开src/core/instance/index.js 调用 init 方法时先进行了检查，确保已经使用 n...
vue源码研究--Data为啥要写成函数？
qq_36711388的博客
06-03 2988
大家在使用vue的时候，肯定有想过为什么 data 要写成函数，而不允许写成对象？ 首先我们要想到： data是 Vue 实例上的一个属性。 对象是对于内存地址的引用。 函数有自己的作用域空间。 第一点无可厚非，data属性附着于 Vue 实例上。 第二点，JS 的数据类型分为基本类型和引用类型，基本类型存储在栈内存中，引用类型存储在堆内存中，并且引用类型指向的是栈内存中的堆区地址。下面两个例...
组件中data为什么是函数
weixin_45638909的博客
02-03 437
data是一个函数，但是返回的是一个对象，如果data直接是一个对象，会造成联动反应，即改变其中一个组件中的数据，其他的数据也会进行变化 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="app"> <cpn></cpn&gt
Data为什么必须是函数1
Mr_xiaoxuboke的博客
06-01 1804
1.vue中组件是用来复用的，为了防止data复用，将其定义为函数。 2.因为当 data 是函数时，组件实例化的时候这个函数将会被调用，返回一个对象，计算机会给这个对象分配一个内存地址，实例化几次就分配几个内存地址，他们的地址都不一样，所以每个组件中的数据不会相互干扰，改变其中一个组件的状态，其它组件不变 3.如果data是对象时，这些实例用的是同一个构造函数，由于JavaScript的特性所导致，所有的组件实例共用了一个data，就会造成一个变了全都会变的结果。
data为什么设置成函数
yusun1234的博客
01-11 900
data为什么是函数
vue中的data为什么是一个函数？起到什么作用？
在写作的路上持续输出。
05-04 1万+
vue中的data为什么是一个函数？起到什么作用？
data为什么是一个函数，而不是方法。
qq_49643195的博客
05-16 567
根实例对象data可以是对象也可以是函数（因为根实例是单例），不会产生数据的污染。 (根实例是:vue,组件实例是vuecomponents) 组件实例对象data必须为函数，目的是为了防止多个组件实例对象之间公用一个data，产生数据污染。如果用函数的形式，initData时会将其作为工厂函数都会返回全新data对象。 Object是引用数据类型,如果不用function返回，每个组件的data都是内存的同一个地址，一个数据改变了其他也就改变了，javascipt 只有构造函数构成作用域，data是
组件中 data 为什么是一个函数？
Menqq的博客
04-27 3596
因为，如果**data是一个对象则会造成数据共享**，在多次使用该组件时，改变其中一个组件的值会影响全部该组件的值。而如果是通过函数的形式返回出一个对象的话，在每次使用该组件时返回出的对象的地址指向都是不一样的，这样就能让各个组件的数据独立。 ...
vue核心面试题：组件中的data为什么是一个函数
王三六博客
08-17 2万+
一、总结 1.vue中组件是用来复用的，为了防止data复用，将其定义为函数。 2.vue组件中的data数据都应该是相互隔离，互不影响的，组件每复用一次，data数据就应该被复制一次，之后，当某一处复用的地方组件内data数据被改变时，其他复用地方组件的data数据不受影响，就需要通过data函数返回一个对象作为组件的状态。 3.当我们将组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，拥有自己的作用域，类似于给每个组件实例创建一个私有的数据空间，
组件中的data为什么是一个函数而不是一个对象
qq_43592064的博客
03-21 2828
官方的解释为： 通俗的讲就是： 因为对象是一个引用数据类型，如果data是一个对象的情况下会造成所有组件共用一个data。而当data是一个函数的情况下，每次函数执行完毕后都会返回一个新的对象，这样的话每个组件都会维护一份独立的对象（data） ...
为什么data必须是一个函数
weixin_50736511的博客
03-24 493
如果data是一个函数的话，那么我们每次创建一个新的实例之后，就会调用一个新的data函数。也就是给每一个data数据定义一个新的内存地址。这样的话，修改A而不会影响B. 主要也是受到javascript的特性影响，跟vue本身设计无关。 大家都知道.vue的组件是可以复用的，这也就意味着如果我们的data是一个普通对象的话，所有复用了这个实例的组件都会引用同一份数据，就造成了数据污染。 摘抄：https://blog.csdn.net/weixin_45811884/article/details/107
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值