面试补漏知识点

麦风科技(深圳)

面试时间:2023-11-6

无限列表（前端分页）

• 通过Web Worker做子线程实现（使用worker来开辟一个独立于主线程的子线程来进行哪些大量运算，这样就不会造成页面卡死。)

• 虚拟列表

• 分批渲染

路由钩子

• 全局前置守卫 router.beforeEach

• 全局解析守卫 router.beforeResolve

• 全局后置钩子 router.afterEach

• 路由独享的守卫 beforeEnter

• 组件内的守卫 beforeRouteEnter 、 beforeRouteUpdate 、 beforeRouteLeave

多端适配

• 根据不同根据不同的分辨率，加载不同的CSS样式文件（可切换的固定布局）自适应布局

• 媒体查询

• rem布局（弹性布局）

• 百分比布局 (流式布局)

新略信息(上海)

面试时间:2023-11-15

ajax底层原理

1. AJAX = 异步 JavaScript 和 XML。

2. AJAX 是一种用于创建快速动态网页的技术。

3. 通过在后台与服务器进行少量数据交换，可以使网页实现异步更新。

4. 可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

解构赋值是什么拷贝

• 当数组是一维数组或对象时是深拷贝,多维时就是浅拷贝

BFC

• BFC，全称为Block Formatting Context，翻译过来即块格式化上下文。

• W3C对BFC的定义如下： 浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks, tablecells, 和 table-captions），以及overflow值不为"visiable"的块级盒子，都会为他们的内容创建新的 BFC（Block Fromatting Context， 即块级格式上下文）。

• 渲染规则

  1. BFC垂直方向边距重叠

  2. BFC的区域不会与浮动元素的box重叠

  3. BFC是一个独立的容器，外面的元素不会影响里面的元素

  4. 计算BFC高度的时候浮动元素也会参与计算

盛视科技(武汉)

面试时间:2023-11-16

字符串数组互转

• 字符串转数组

1. Sting.split()

2. 展开运算符

3. 解构赋值

4. Array.from()

• 数组转字符串

1. Array.toString()

2. Array.join()

跨域

浏览器的同源策略导致。同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号（port）

• 解决方案

1. jsonp

2. CORS

3. 服务器代理(正向/反向)

4. 前端脚手架配置

得物

面试时间:2023-11-19

闭包实现

JavaScript 中的闭包是由函数和其周围的词法环境组合而成的。当函数在其外部作用域中引用了某些变量时，即使该外部作用域已经执行完毕，这些变量依然会被保存在内存中，因为函数依赖于这些变量

垃圾回收机制

JavaScript 中的垃圾回收机制是自动管理内存的过程，用于识别不再被程序使用的内存，并将其释放以便重复利用。在 JavaScript 中，垃圾回收器通过标记清除（Mark-and-Sweep）算法和其他辅助算法来完成这个任务。

标记清除算法：

1. 标记阶段：

   • 垃圾回收器会从根对象（全局对象、当前执行上下文中的变量等）开始，标记所有能从根对象访问到的对象。

   • 通过一种追踪机制，标记所有被引用的对象，确保它们不会被回收。

2. 清除阶段：

   • 垃圾回收器会扫描堆（存储对象的区域），清除未标记的对象，即认为未被引用的对象是垃圾，可以安全释放占用的内存空间。

   • 这样的对象会被从内存中移除，释放相应的资源。

JavaScript中一些情况下可能导致内存泄漏的情形包括：

1. 未正确清理的引用：意外地保留了对不再需要的对象的引用，导致它们无法被垃圾回收。

2. 闭包：在闭包中，内部函数持有对外部函数作用域的引用，如果这些闭包长时间存在，可能会导致相关作用域的变量无法被回收。

3. 定时器和事件监听器：如果定时器或事件监听器没有被适当清理，它们也可能引发内存泄漏。

对于开发者来说，减少内存泄漏的最佳实践包括：

• 及时释放不再需要的对象和资源（比如清除定时器、移除事件监听器）。

• 注意循环引用，避免长期保持引用链。

• 使用现代框架和工具可以减少内存泄漏的概率，但也需要注意不要滥用资源。

总体来说，JavaScript 的垃圾回收机制是自动进行的，但开发者也需要意识到可能导致内存泄漏的情况，并且编写代码时考虑如何避免这些情况。

源启科技

面试时间:2023-11-24

透明的三种方式

opacity、rgba、transparent

1. opacity是样式名，通过样式值的不同设置透明效果,rgba、transparent是样式值，必须跟在特定的样式名后，才可以设置透明效果

2. opacity可以给任何元素设置透明效果，就像在元素前面加一个模糊镜子一样

3. opacity具有继承性，rgba、transparent不具有继承

null和undeafind

null表示"没有对象"，即该处不应该有值。典型用法是：

1. 作为函数的参数，表示该函数的参数不是对象。

2. 作为对象原型链的终点。

undefined表示"缺少值"，就是此处应该有一个值，但是还没有定义。典型用法是：

1. 变量被声明了，但没有赋值时，就等于undefined。

2. 调用函数时，应该提供的参数没有提供，该参数等于undefined。

3. 对象没有赋值的属性，该属性的值为undefined。

4. 函数没有返回值时或者return后面什么也没有，返回undefined。

图片懒加载的原理

在图片没有进入可视区域时，先不给的src赋值，这样浏览器就不会发送请求了，等到图片进入可视区域再给src赋值。图片的真实地址需要存储在data-src中

symbol类型

// @param  {any} description 描述信息。可以是任何可以被转型成字符串的值，如：字符串、数字、对象、数组等
function Symbol(description?: any): symbol

应用场景

• 作为类的键名

• 生成唯一常量

• 定义私有属性/方法

解决浏览器缓存

• 用户自行清除缓存

• index.html页面加meta标签

  <meta http-equiv="pragram" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
  <meta http-equiv="expires" content="0">

• 后端nginx配置，让index.html不被缓存(vue默认打包后会自动将js、css等资源加上哈希值)

• 前端脚手架配置

• 引入第三方库解决