Vue——面试题:关于组件(data)

66 阅读1分钟

1.组件中的data为什么要设计成函数?

  1. 这样的设计,当组件被复用时,data数据源才不会共用(因为,每一次使用组件时,就调用了一次data函数,返回了一个对象,虽然使用同一个组件标签,生成的对象看起来是一样的,但是对象是引用数据,它们之间是不会共用的,这样相同组件标签操作了事件,才不会影响其他组件标签)

  2. 函数的设计就像懒加载一样,当使用组件时,数据源的对象才会创建,这样设计性能更好(当组件没有使用数据源,data函数就不会被调用,那么data函数就是一串字符串,只占用很小的空间,但如果将data设计 成对象,就是一个引用空间,它会占用很大的内存,性能就不太好)

2.在使用计算属性的时候,函数名和 data 数据源中的数据可以 同名吗?(也就是分析数据被劫持的顺序)

可以同名,但 data 会覆盖 methods。并且本就不该同名同名说明你命名不规范

覆盖的原因是 Props、 methods、 data、 computed、 watch 都是在 initState 函数中被初始 化的。初始化顺序为 computed, methods, data, props本质上这些都是要挂载到 this 上面 的,你如果重名的话,后面出现的属性自然而然会覆盖之前挂载的属性了。如果你的esl int 配置比较严格的话,同名是编译不通过的