1、js是单线程还是多线程？
单线程执行。一次只能执行一个任务，处理任务的方式是通过一个任务队列（也称为消息队列）来实现的。如果某个操作（如网络请求或定时器）需要花费较长时间才能完成，它不会阻塞其他代码的执行。相反，这些操作会被挂起，并在它们完成时，将回调函数添加到任务队列中等待执行。
Web Workers 提供了一种在后台线程中运行脚本的方法。这些后台线程可以执行复杂的计算或处理任务，而不会阻塞用户界面。如大文件的处理、复杂的数学计算或图像处理等。Web Workers 不能直接访问 DOM，它们必须通过消息传递机制与主线程进行通信。
2、 单线程JS如何实现异步执行，更底层一点描述？
单线程JavaScript环境中，异步执行通常是通过事件循环（Event Loop）和非阻塞I/O操作来实现的。promise、async/await
3、JS引擎方面有哪些?
V8是一个由Google开发的高性能JavaScript引擎，采用即时编译（JIT）技术将JavaScript代码转换为本机机器码，以实现快速执行和优化。V8引擎可以独立运行，也可以嵌入到C++应用程序中执行。
JavaScriptCore是苹果公司为其Safari浏览器开发的JavaScript引擎，是WebKit渲染引擎的一部分。
4、浏览器缓存机制？
- Service Worker：首先检查Service Worker是否有可用的缓存资源。
- Memory Cache：然后检查内存缓存中是否有该资源的副本。
- Disk Cache：如果内存缓存中没有找到，浏览器会查看硬盘缓存。
- Push Cache：如果以上缓存都没有命中，且使用了HTTP/2协议，浏览器会尝试使用推送缓存。
- 网络请求：如果所有缓存都没有命中，浏览器会向服务器发起网络请求。
5、Vue的虚拟DOM树机制？
虚拟DOM（Virtual DOM）是一个用JavaScript对象（通常是VNode节点）来模拟真实DOM结构的机制。它是Vue.js等现代前端框架为提高页面渲染效率而采用的一种技术。虚拟DOM的引入旨在减少直接操作DOM的次数，因为DOM操作是昂贵的，涉及到浏览器的渲染过程，频繁的操作会导致性能问题。创建一系列的VNode节点（标签名、属性、子节点）构建虚拟DOM树，并将虚拟DOM树挂载到DOM元素上实现首次渲染。
6、Vue如何利用虚拟DOM提高性能？
减少直接操作 DOM：最后只将必要的变更应用到真实的 DOM 上。
高效的 DOM 更新：Vue 使用高效的算法（如 diff 算法）来比较新旧虚拟 DOM 树，以计算出最小的 DOM 更新集合。Vue 的 diff 算法只关注同级节点的比较，而不是对整个树进行深度遍历。这意味着，只要子节点的位置没有变动，Vue 就不会去动它们，这进一步减少了不必要的 DOM 操作。
组件化的开发模式：
异步更新队列：Vue 实现了一个异步更新队列，这意味着所有的数据变化不会立即导致 DOM 更新。Vue 会等待一个“tick”（即异步操作完成后），然后将所有的数据变化合并，只执行一次 DOM 更新。
优化策略：Vue 还提供了一些优化策略，如 v-if 和 v-show 的使用（v-if 是真正的条件渲染，而 v-show 只是简单地切换 CSS 属性），以及 key 属性的使用（帮助 Vue 跟踪每个节点的身份，从而重用和重新排序现有元素），这些都可以进一步提高性能。
7、Vue和MVC架构相比有什么优势？
Vue 和 MVC（Model-View-Controller）架构之间的比较，实际上是在比较一个前端框架（Vue）和一个广泛使用的软件设计模式（MVC）之间的不同点。MVC 是一种设计思想，用于将应用程序分割成三个主要逻辑组件：模型（Model）、视图（View）和控制器（Controller），以提高代码的可维护性、可扩展性和可重用性。而 Vue 是一个用于构建用户界面的渐进式JavaScript框架，它本身也遵循了类似 MVC 的设计模式，但更侧重于视图层（View）的抽象和管理。
vue优势：
轻量级和高效
数据绑定和组件化
易于学习和使用
灵活性
生态系统丰富
8、webpack的工作机制？
初始化与配置
确定入口：入口点（Entry）
编译模块：Webpack会递归地分析模块之间的依赖关系，构建出一个依赖图。对于非JavaScript文件（如CSS、图片等），Webpack会使用配置的Loader进行转换。
打包输出：生成Chunk，Webpack会根据依赖图将模块组织成不同的代码块（Chunk），每个Chunk可以是一个独立的文件，也可以与其他Chunk组合成一个捆绑包（Bundle）。
插件扩展
优化输出文件
9、Vue数据双向绑定怎么实现？
它通过 MVVM（Model-View-ViewModel）模式实现。在 Vue 中，这种双向绑定主要是通过 v-model 指令在表单输入和应用状态之间创建的。
通过其响应式系统和 v-model 指令共同实现的。Vue 的响应式系统确保了数据的实时性和一致性，而 v-model 则提供了一种简洁的语法来声明双向绑定关系。
10、Vue2的生命周期（vue3改了！！！）
创建阶段：
beforeCreate：Vue实例刚刚被创建，数据观测(data observer)和event/watcher事件配置都还未开始。此时，实例的data、methods、computed等属性都还未被初始化，无法访问到它们。
created：Vue实例的data、methods、computed等属性已经被初始化完成，但是模板还没有被编译成DOM节点，因此还无法访问到DOM元素。这个钩子适合进行异步请求（如从服务器获取数据）或开启定时器等操作。
beforeMount：模板已经被编译成渲染函数，但是还没有挂载到页面上，因此还无法看到渲染后的DOM元素。
mounted：Vue实例已经被挂载到页面上，可以访问到渲染后的DOM元素。这个钩子适合进行DOM操作、开启定时器、监听事件等操作。
更新阶段：
beforeUpdate：当Vue实例的数据发生变化时，会触发更新操作。在更新之前，会调用beforeUpdate钩子。页面上的DOM元素还未更新，但是Vue实例的data中的数据已经是更新后的数据。
updated：当Vue实例的数据更新完成，并且DOM元素也重新渲染后，会调用updated钩子。
销毁阶段：
beforeDestroy：Vue实例仍然完全可用，可以访问到所有的数据和DOM元素。比如清除定时器、解绑事件监听器等。
destroyed：Vue实例的所有指令都已经解绑，所有的事件监听器也都被移除，所有的子实例也都被销毁。
11、浏览器里面还有什么线程？
主线程（UI）、JavaScrip引擎线程、定时器触发线程、事件触发线程、Web Worker线程、GUI渲染线程、网络线程等。
12、html常用的单位？
绝对长度单位
像素（px）
点（pt）
派卡（pc）
英寸（in）
厘米（cm）和毫米（mm）
相对长度单位
em 相对于当前对象内文本的字体尺寸。如果当前行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。例如，如果当前元素的字体大小为16px，那么width: 2em; 表示元素的宽度为32px（16px × 2）。
rem：相对于根元素（即<html>元素）的字体大小
百分比（%）
视口相关单位
视口宽度（vw）相对于浏览器视口宽度的百分比
视口高度（vh）
13、怎么让1rem=1px（根元素字体大小设置为6.25%）
浏览器会将根元素的字体大小设置为16px，16*0.0625=1
font-size: 6.25%;
14、position属性？（详细说说relative和absolute的区别，分别是相对于谁的偏移）
relative是相对自身
absolute 是相对父元素
