21. 为什么data属性是一个函数而不是一个对象
在 Vue 组件中，data 属性可以是一个对象，也可以是一个函数。将 data 属性定义为函数的主要原因是为了实现每个组件实例都可以拥有独立的数据对象，而不会出现共享数据的问题。
当 data 是一个对象时，对象中的属性将被共享，即如果一个组件实例修改了其中的属性，其他实例也会受到影响，这可能会导致数据混乱或不一致的问题。
而当 data 是一个函数时，每次创建组件实例时都会调用该函数，这样每个实例都会返回一个新的数据对象，从而避免了数据的共享问题，确保了组件之间的数据独立性。
22. TypeScript 熟悉吗
TypeScript 是 JavaScript 的一个超集，添加了静态类型检查功能。TypeScript 提供了更强大的工具和语法来帮助开发者在编写大型复杂应用时更加安全、高效地工作。了解 TypeScript 的主要特性和语法，包括类型系统、接口、类、泛型、枚举等，能够有效地提高代码的质量和可维护性。
23. Axios 封装过没封装过哪些组件
Axios 是一个基于 Promise 的 HTTP 客户端，用于浏览器和 Node.js 的异步请求。在实际项目中，通常会对 Axios 进行封装，以便统一管理请求和处理错误，提高开发效率。
封装 Axios 可以包括以下方面：
请求拦截器和响应拦截器：用于在请求发送前和响应返回后进行拦截和处理，例如添加公共参数、设置请求头、统一处理错误等。
统一错误处理：对请求错误进行统一处理，例如处理 HTTP 状态码、网络错误、超时等。
封装请求方法：封装常用的请求方法，如 GET、POST、PUT、DELETE 等，简化使用方式。
取消请求：对于一些特殊场景，如页面跳转或组件卸载时需要取消未完成的请求，可以添加取消请求的功能。
设置默认配置：设置默认的请求配置，如 baseURL、超时时间、请求头等，避免在每次请求时都需要重复设置。
封装 Axios 可以提高代码的复用性和可维护性，使得整个项目的请求管理更加规范和方便。
24. Vue 的自定义指令用过没
是的，我使用过 Vue 的自定义指令。Vue 提供了自定义指令的功能，通过 directive 选项或全局方法 Vue.directive() 可以创建自定义指令。自定义指令允许我们在 DOM 渲染时修改其行为，例如控制元素的可见性、监听滚动事件、自定义输入框的格式化等。我曾经在项目中使用自定义指令来实现一些特定的交互效果，比如点击外部区域关闭弹窗的功能，或者实现懒加载图片等。
25. 图片懒加载和预加载
图片懒加载和预加载是常用的前端优化技术。懒加载是指延迟加载页面中的图片，只有当图片进入可视区域时才进行加载，以减少页面的初始加载时间和节省带宽资源。而预加载则是指提前加载页面中未出现但即将出现的图片，以便在用户需要查看时能够立即呈现，提高用户体验。在项目中，我曾经使用图片懒加载技术来优化页面加载性能，尤其是对于图片较多的网页，效果非常显著。
26. ES6 新增了哪些特性
ES6（ECMAScript 2015）引入了许多令人激动的新特性，包括箭头函数、模板字符串、解构赋值、let 和 const 关键字、Promise、class 类、模块化等。箭头函数简化了函数的书写形式；模板字符串提供了更灵活的字符串拼接方式；解构赋值可以方便地提取对象和数组中的值；let 和 const 关键字改变了变量声明的方式，提供了块级作用域；Promise 简化了异步操作的处理；class 类和模块化使得 JavaScript 更加面向对象化和模块化。我熟悉并经常使用 ES6 中的这些特性，它们大大提高了 JavaScript 开发的效率和质量。
27. 深拷贝和浅拷贝
深拷贝和浅拷贝是在复制对象或数组时的两种不同方式。浅拷贝只复制对象或数组的一层引用，而深拷贝则会递归复制对象或数组的所有子对象和元素，使得拷贝后的对象与原始对象完全独立。在项目中，我常常使用深拷贝来确保操作的安全性，尤其是在处理嵌套对象或数组时。
28. 防抖和节流
防抖（Debounce）和节流（Throttle）是两种常见的前端优化技术，用于限制函数执行的频率。防抖是指在一定时间内多次触发事件时，只执行最后一次操作，常用于输入框搜索等频繁触发的场景；而节流则是指在一定时间间隔内只执行一次操作，常用于滚动事件或页面 resize 事件等频繁触发的场景，以减少函数执行的次数和提升性能。我在项目中经常使用这两种技术来优化页面性能和用户体验，确保函数不被过度触发，提高页面的响应速度和流畅度。
29. 用递归实现阶乘，比如传入 5，返回 5
function factorial(n) { // 基线条件：当 n 等于 1 或 0 时，阶乘为 1 if (n === 1 || n === 0) { return 1; } // 递归条件：n 乘以 (n-1) 的阶乘 return n * factorial(n - 1);}// 测试console.log(factorial(5)); // 输出 120
30. 箭头函数和普通函数的区别
箭头函数（Arrow Function）和普通函数（Regular Function）之间有几个重要的区别：
语法：
箭头函数使用 => 符号来定义，普通函数使用 function 关键字定义。
this 的指向：
箭头函数没有自己的 this，它会捕获所在上下文的 this 值。而普通函数的 this 则取决于函数的调用方式。
arguments 对象：
箭头函数没有自己的 arguments 对象，但可以访问到外部的 arguments 对象。而普通函数有自己的 arguments 对象。
构造函数：
箭头函数不能作为构造函数使用，不能使用 new 关键字调用，也没有 prototype 属性。普通函数可以作为构造函数使用。
适用场景：
箭头函数适合于匿名函数的情况，简洁并且更容易理解。普通函数则适合于需要 this 和 arguments 对象的情况。
例如：
// 普通函数function regularFunction() { console.log(this); // this 指向全局对象}// 箭头函数const arrowFunction = () => { console.log(this); // this 指向外层作用域的 this}
