其它面试题

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第5天，点击查看活动详情

1.sync

2.NaN的数据类型

3.单点登录

cookie 是网站为了辨别用户身份，由服务端生成，发给客户端暂时或永久保存的信息。

4.后端一次返回10万条数据

懒加载+分页

懒加载和分页方式一般用于做长列表优化, 类似于表格的分页功能, 具体思路就是用户每次只加载能看见的数据, 当滚动到底部时再去加载下一页的数据.

虚拟滚动

虚拟滚动技术也可以用来优化长列表, 其核心思路就是每次只渲染可视区域的列表数,当滚动后动态的追加元素并通过顶部padding来撑起整个滚动内容,实现思路也非常简单.

最好使用插件实现：vue3-infinite-list

juejin.cn/post/707963…

5.web缓存

浏览器缓存

1. localStorage 数据量5M，永久保存
2. sessionStorage 数据量5M 关闭页面，清除数据
3. cookie 数据量4k，可以设置失效时间

http缓存

为什么要进行http缓存

1. 减少不必要的网络传输
2. 减少服务器负载
3. 更快的加载速度

例如vue的首屏加载，将请求到的数据进行存储，之后就不进行http请求，直接从缓存中拿取。

强制缓存

通过cache-control控制资源缓存时间

//往响应头中写入需要缓存的时间  
res.writeHead(200,{  
    'Cache-Control':'max-age=10'  
});

从该资源第一次返回的时候开始，往后的10秒钟内如果该资源被再次请求，则从缓存中读取。

协商缓存

基于 last-modified 实现

1. 首先需要在服务器端读出文件修改时间，
2. 将读出来的修改时间赋给响应头的last-modified字段。
3. 最后设置Cache-control:no-cache

6.ref和reactive的区别

ref和reactive都是用来处理响应式数据的。

reactive

reactive是利用proxy来实现的响应式数据的，一般用来处理Object类型的对象

ref

ref将数据包装成一个ref对象，通过给value属性添加getter/setter来实现对数据的劫持，利用“.value”的形式在setup中访问数据，在模板中不需要“.value”。一般处理Object对象以外的对象。