2022年3月17日复盘

1. 介绍一下自己学习心得和经验，遇到问题怎么处理？（关于个人博客）

2. 介绍一下目前所在用的项目和技术栈？公司用的什么架构？有了解吗？

项目如实介绍使用的技术栈以及自己在其中担任何种角色，完成了哪些工作。

由于自己主动说出了框架名称，所以才会有后面的问题（切记自己不熟悉的千万不要从自己的嘴里说出来）

微服务架构qiankun：帮助大家能更简单、无痛的构建一个生产可用微前端架构系统

白话就是：能够集成多个项目，让一个大项目分成不同模块的子项目，方便企业项目的维护。

3. 工作中没有遇到什么问题吗？怎么解决的？

1. 数组转树结构：通过递归把父级id和当前id关联起来

   function ArrToTree(arr, parentId = 0) {
     const tree = []
     arr.forEach(item => {
       if (item.pid === parentId) {
         item.children = []
         item.children.push(...ArrToTree(arr, item.id))
         tree.push(item)
       }
     })
     return tree
   }
   

2. 抽离组件解耦尽量满足大部分相同页面的处理（数据传输，slot）

3. threejs工作中用到了吗？webGL和openGL区别？

工作上实话实说

webgl和openGl的区别：

• webGL：
  • 3D模型和场景的绘图协议，并提供了3D图形的API
  • webGL利用底层的图形硬件加速功能进行的图形渲染作，无需任何浏览器插件支持
• OpenGL：
  • 用于渲染2D、3D矢量图形的跨语言、跨平台的应用程序编程接口（API）
  • openGL通过HTML脚本本身实现Web交互式三维动画的制作，需要浏览器插件支持

4. mvvm，mvc什么意思？自己平常用到了哪些？比如说？

M：model数据模型 V：view视图

• MVC：MVC允许在不改变视图的情况下改变视图对用户输入的响应方式，用户对View的操作交给了Controller处理，在Controller中响应View的事件调用Model的接口对数据进行操作，一旦Model发生变化便通知相关视图进行更新。

• MVVM：和MVC相比，将C变成了VM，它实现了 View 和 Model 的自动同步，也就是当 Model 的属性改变时，我们不用再自己手动操作 Dom 元素，来改变 View 的显示，而是改变属性后该属性对应 View 层显示会自动改变（对应Vue数据双向绑定的思想）

• MVP：当 View 需要更新数据时，首先去找 Presenter，然后 Presenter 去找 Model 请求数据，Model 获取到数据之后通知 Presenter，Presenter 再通知 View 更新数据，这样 Model 和 View 就不会直接交互了，所有的交互都由 Presenter 进行，Presenter 充当了桥梁的角色。

5. 说到了双向绑定，能否解释一下vue怎么进行双向绑定的？用到了哪些设计模式？

设计模式当时巴拉巴拉双向绑定一大堆给忘记了，后来才想起来漏了一个问题。

设计模式：

1. 工厂模式：传参数就能够创建实例
2. 单例模式：整个程序有且只有一个实例：vuex和vue-router给所有组件绑定属性
3. 发布订阅模式：vue事件机制 evenBus
4. 观察者模式：响应式数据原理

6. 生命周期有哪些？说一说各个生命周期中做了什么事？你平常怎么用生命周期的？

• beforeCreate：创建前，将一些属性挂载到组件实例上，如$store,$router等
• created：创建实例后，能够拿到data属性，可以用来初始化数据，执行一些方法和请求，拿不到dom节点，可以通过nexttick方法
• beforeMount：在挂载开始之前被调用：相关的 render 函数首次被调用（存在子组件，子组件开始创建）
• mounted：挂载后，能够拿到dom节点，数据完成双向绑定（存在子组件，子组件已经在mounted调用前挂载完毕）
• beforeUpdate：数据更新之前调用，还未更新数据和节点（存在子组件，子组件也开始更新）
• updated：数据更新之后调用，切记不能在此处修改数据，会引起循环调用（存在子组件，子组件在此之前更新完毕）
• beforeDestroy：组件销毁前，内部属性和方法还可以使用（存在子组件，子组件也开始销毁）
• destroyed：组件销毁后，所有属性和方法都会解绑（存在子组件，子组件在此前销毁完毕）

注：mixin混入中的生命周期函数也会调用

keepalive周期：

• activated：组件被激活时调用
• desactivated：组件失活时调用

7. vuex平常怎么使用的？

vuex全局状态，刷新时会初始化，可搭配localStorage使用

8. ts和js相比有什么优势？性能上面也有优势吗？

优势：类型检测，类的修饰符等，参考上一个文章。

性能优势暂不明确。