2024前端常见面试题

1.vue用的那种设计模式？
属于发布订阅模式，在vue中使用observer和definereactive两个方法的结合对数据进行递归劫持，然后通过watch这个类来对属性进行订阅，Dep类用于解耦，当数据变更的时候先触发数据的set方法，然后调用dep.notify通知视图更新。
2.谈谈vue的token存储？
1.第一次登陆的时候，前端调后端的登录接口，发送用户名和密码。
2.后端接受到请求，验证用户名和密码，验证成功，就给前端返回一个token.
3.前端拿到token会将token存储到localstorage或者vuex中，并跳转路由。
4.前端每次跳转路由，就判断localstorage中有无token，有就跳转到相应的页面，没有就跳转到登陆页面。
5.每次调用后端接口，都要在请求头中添加token。
6.后端判断请求头中有无token,有token就验证token,验证失败或者无token的情况下会返回401。
7.如果前端拿到状态码是401，就会清除token并跳转到登陆页面。
3.es6转换为es5的原理是什么?
ES6（ECMAScript 2015）转换为ES5的原理主要是通过转码工具（如Babel）将ES6代码转换为兼容ES5的代码。Babel本质上是一个编译器，它可以将ES6+代码转换为向后兼容的ES5代码。
转换的主要过程包括以下几个步骤：
解析（Parsing）：Babel首先将ES6代码转换为抽象语法树（AST）。
转换（Transformation）：Babel会遍历AST，对其进行变换，以将ES6特性转换为ES5兼容的代码。
生成（Code Generation）：最后，Babel将转换后的AST再次转换为字符串形式的ES5代码。
4.什么是递归，优缺点是什么？
递归就是函数调用自己。
优点：简洁、易于理解。
缺点：(1)时间复杂度高。
(2)调用栈可能会溢出。其实每一次函数调用会在内存栈中分配空间，而每个进程的栈的容量是有限的，当调用的层次太多时，就会超出栈的容量，从而导致栈溢出。
5.js中怎么把树形结构扁平化处理?
https://blog.csdn.net/m0_55564216/article/details/135764833
1.递归循环。
2.使用reduce方法实现。
6.低代码的原理是什么？
(1)可视化建模。低代码开发工具提供可视化建模界面，允许开发者通过拖拽和配置组件来创建应用程序的各种组件，如表单、按钮、数据表格等。这些组件基于预定义的模板和插件设计，便于定制和设置。
(2)可重用组件。低代码工具通常包含一个组件库，供开发者选择并组合以满足特定需求。这些组件在不同应用中可以重复使用，提高开发效率和代码可维护性。
自动化代码生成。低代码工具内置代码生成器，能够自动生成大部分应用程序代码。开发者只需进行部分编码，其他部分由工具自动完成，减少手动编码工作量，提高开发速度和一致性。
(3)数据驱动开发。低代码开发强调以数据为中心，通过绑定数据源和应用组件实现数据自动更新和同步，减少数据操作复杂性。开发者关注数据逻辑和业务规则，而非数据存储和传输细节。
(4)快速迭代开发。低代码开发提供快速迭代模式，通过实时预览和调试功能，即时查看应用程序效果，快速发现和修复问题，加快开发速度并降低风险。
(5)元数据驱动。低代码平台采用元数据来描述组件和模块的属性、行为和关系。通过配置元数据，开发者定义组件的外观和功能，实现灵活定制化。
(6)模型驱动。低代码平台通过建模定义业务逻辑，包括数据关系、流程逻辑等，实现应用开发管理自动化。这种方式使开发者更加专注于应用程序的设计和逻辑。
(7)预置组件和模板。低代码平台提供预置的组件和模板，用于快速搭建应用程序的常见功能。这些组件和模板经过可视化修改后，满足特定业务需求，提高开发效率。
总的来说，低代码开发通过简化开发流程、提供预构建组件和自动化代码生成等技术，降低了技术门槛，提高了开发效率和应用程序的可维护性。