前端面试-总结2

前端面试-总结2

• ts中的元祖是什么？
  如果js数组中元素类型不一样，在ts中成为元祖；如果js数组的元素类型是统一的，就是ts中的数组。

• this指向问题
  箭头函数的this执行问题不会改变，也就是箭头函数所在的作用域在哪里this就指向哪里；
  new调用函数this指向时，this指向js创建的新对象；

• 修改this指向
  bind修改this指向，bind会创建函数实例，返回一个新的函数，需要手动调用才会执行；
  call，apply修改this指向，唯一区别在于接收参数不同，call是参数数量且顺序确定使用，apply则是参数数量顺序不确定用，他们两个都会直接调用函数执行；

• vue3的7中组件通讯方式
  props用于子接收父的数据
  emit用于子传父
  v-model用于子传父
  refs在vue3中需要借助生命周期使用等到模板挂载之后使用mounted获取元素
  provide和inject，父传子的数据传递
  事件总线，官方不再维护
  状态管理工具vuex或者pinia

• 如果现在有一个父组件，3个子组件。 每个组件展示的数据不同， 现在有2种数据获取方式。
  第一种，在父组件中获取所有的数据，然后使用props传递给每个子组件。 第二种：各个子组件中获取各自的数据。 你觉得哪种好？为什么？
  答：根据实际业务来
  如果数据其他组件用不到,那么可以由子组件自己获取，
  如果数据可能被同级组件 复用 共享 那么由父组件统一获取然后分发下去

• vue3和vue2有什么区别
  生命周期变化：setup替代原有的created和beforecreate，销毁生命周期使用onberforeUnmount和onunmounted替代
  多根节点：vue2中模板下会有div
  组合式api和选项式api：setup包含所有内容，并且按需引入
  响应原理不同：vue3使用proxy，vue2中不能监听对象和数组的增删，使用vue.set监听对象、数组的新增属性
  更好地ts支持：vue2中需要使用vue-class-component强化vue原来的组件，也需要vue-property-decorator增加更多装饰器

• 伪类和伪元素
  :hover和:active，：focus，：link 伪类使用单冒号
  ::before和::after等伪元素，伪元素使用双冒号

• 原型，原型链，构造函数，实例的关系
  原型：用来生产实例对象。需要函数的prototype属性和实例的__proto__属性来区别。
  原型链：原型对象有个指针指向构造函数，实例对象又有一个指针指向原型对象，就形成了一条原型链，最终指向null
  实例：实例是通过构造函数创建
  构造函数：一个普通的函数前面加了new运算符，其本质也是一个函数，所以构造函数都有函数的prototype属性