js遍历arr树状结构数据
时间: 2023-12-08 11:05:23 浏览: 32
可以使用递归函数来遍历树状结构的数据。假设数据结构如下:
```javascript
const data = [
{
id: 1,
name: "Node 1",
children: [
{
id: 2,
name: "Node 1.1",
children: [
{
id: 3,
name: "Node 1.1.1",
children: []
},
{
id: 4,
name: "Node 1.1.2",
children: []
}
]
},
{
id: 5,
name: "Node 1.2",
children: []
}
]
},
{
id: 6,
name: "Node 2",
children: []
}
];
```
可以使用以下递归函数来遍历这个数据结构:
```javascript
function traverseTree(data, callback) {
if (!data || !Array.isArray(data)) {
return;
}
for (let i = 0; i < data.length; i++) {
const item = data[i];
callback(item);
traverseTree(item.children, callback);
}
}
```
使用方式:
```javascript
traverseTree(data, node => {
console.log(node.id, node.name);
});
```
这个函数会遍历整个数据结构,并且对每个节点执行回调函数。回调函数的参数是当前节点的信息。
相关推荐
![application/octet-stream](https://img-home.csdnimg.cn/images/20210720083646.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)