文章目录
- 前端面试题:一个是铺平的数组改成树的结构
- 问题一解析一
- 问题一解析二
- 前端面试题:for循环100个接口,每次只调3个
- 方法一:使用 `async/await` 和 `Promise`
- 代码解释(1):
- 代码解释(2):
- 1. `fetchApi` 函数
- 2. `concurrentFetch` 函数
- 3. 生成 100 个接口地址
- 4. 每次并发调用 3 个接口
- 总结
- 方法二:使用递归和 `Promise`
- 代码解释:
- 深拷贝 forwardref 用法
- 深拷贝
- 概念
- 实现方法
- 1. 使用递归实现深拷贝
- 2. 使用 `JSON.parse` 和 `JSON.stringify` 实现深拷贝
- `forwardRef`
- 概念
- 用法示例
- 代码解释
1、一个是铺平的数组改成树的结构,递归一下就可以了,第二个是用react写一个短信验证码发送,第三个是链表翻转
2、写个hoc实现传入一个组件,渲染这个组件,在组件染失败的情况下渲染特定的失败组件并上报失败信息,渲染成功上报渲染成功信息,点击上报点击信息
3、for循环100个接口,每次只调3个
4、然后是深拷贝 forwardref用法
前端面试题:一个是铺平的数组改成树的结构
问题一解析一
在前端开发中,将一个铺平的数组转换为树结构是一个常见的需求。通常,铺平的数组中的每个元素会有一个 id 和一个 parentId,通过这两个属性可以确定元素之间的父子关系。下面我们使用递归的方法来实现这个转换。
示例代码
// 定义一个函数,用于将铺平的数组转换为树结构
function arrayToTree(arr, parentId = null) {// 创建一个空数组,用于存储当前层级的子节点const tree = [];// 遍历铺平的数组for (const item of arr) {// 检查当前元素的 parentId 是否等于传入的 parentIdif (item.parentId === parentId) {// 递归调用 arrayToTree 函数,查找当前元素的子节点const children = arrayToTree(arr, item.id);// 如果存在子节点,将子节点添加到当前元素的 children 属性中if (children.length > 0) {item.children = children;}// 将当前元素添加到当前层级的树结构中tree.push(item);}}// 返回当前层级的树结构return tree;
}// 示例铺平数组
const flatArray = [{ id: 1, parentId: null, name: 'Root' },{ id: 2, parentId: 1, name: 'Child 1' },{ id: 3, parentId: 1, name: 'Child 2' },{ id: 4, parentId: 2, name: 'Grandchild 1' },{ id: 5, parentId: 2, name: 'Grandchild 2' }
];// 调用 arrayToTree 函数,将铺平数组转换为树结构
const tree = arrayToTree(flatArray);
// 打印转换后的树结构
console.log(tree);
代码解释
函数定义:arrayToTree 函数接受两个参数,arr 是铺平的数组,parentId 是当前层级的父节点 id,默认为 null,表示根节点。
遍历数组:使用 for…of 循环遍历铺平的数组,对于每个元素,检查其 parentId 是否等于传入的 parentId。
递归查找子节点:如果当前元素的 parentId 等于传入的 parentId,则递归调用 arrayToTree 函数,查找当前元素的子节点。
添加子节点:如果递归调用返回的子节点数组不为空,则将子节点数组添加到当前元素的 children 属性中。
返回树结构:将符合条件的元素添加到当前层级的树结构中,并返回该树结构。
复杂度分析
时间复杂度:,因为对于每个元素,都需要遍历整个数组来查找其子节点。
空间复杂度:,主要用于存储递归调用栈和最终的树结构。
问题一解析二
将一个平铺的数组改成树的结构,可以通过递归的方法来实现。以下是一个示例代码,展示了如何将平铺的数组转换为树的结构:
javascript">function arrayToTree(arr, pid = '') {const tree = [];const map = {};// 首先将所有元素存入map中,key为id,value为元素本身arr.forEach(item => {map[item.id] = { ...item, children: [] };});// 然后根据pid来构建树arr.forEach(item => {if (item.pid === pid) {tree.push(map[item.id]);} else if (item.pid in map) {map[item.pid].children.push(map[item.id]);}});return tree;
}// 示例用法
const flatArray = [{ id: '1', pid: '', name: 'root' },{ id: '2', pid: '1', name: 'child1' },{ id: '3', pid: '1', name: 'child2' },{ id: '4', pid: '2', name: 'grandchild1' },{ id: '5', pid: '2', name: 'grandchild2' }
];const tree = arrayToTree(flatArray);
console.log(JSON.stringify(tree, null, 2));
在上述代码中:
arrayToTree
函数接受两个参数:arr
(平铺的数组)和pid
(当前处理的父ID,初始为空字符串表示根节点)。- 首先创建了一个空数组
tree
用于存放结果,以及一个空对象map
用于快速查找元素。 - 遍历平铺数组,将所有元素存入
map
中,同时初始化每个元素的children
属性为空数组。 - 再次遍历平铺数组,如果当前元素的
pid
等于pid
参数(即当前处理的父ID),则将其添加到结果数组tree
中;否则,如果当前元素的pid