JS 多层级数组遍历

问题描述

处理一个多层级（多维）的数据，每层遍历来实现赋值或者获取对应的值，在JavaScript中，多层级数组的遍历可以使用递归函数来实现

递归函数：在函数体内调用本函数。是一种调用模式，是一种逻辑程序基础的体现。

解决方案

案例

let arrList = [
	{
		id: '1',
		title: '生鲜果蔬',
		child: [
			{
				id: '1-1',
		        title: '蔬菜',
		        child: [
		        	{
		        		id: '1-1-1',
		        		title: '西兰花',
		        	},
		        	{
		        		id: '1-1-2',
		        		title: '辣椒'
		        	},
		        ]
			},
			{
				id: '1-2',
		        title: '水果',
		        child: [
		        	{
		        		id: '1-2-1',
		        		title: '葡萄',
		        	},
		        	{
		        		id: '1-2-2',
		        		title: '荔枝'
		        	},
		        ]
			}
		]
	},
    {
		id: '2',
		title: '快消品',
		child: [
			{
				id: '2-1',
		        title: '家居用品',
		        child: [
		        	{
		        		id: '2-1-1',
		        		title: '垃圾袋',
		        	},
		        	{
		        		id: '2-1-2',
		        		title: '扫把'
		        	},
		        ]
			}
		]
	}
]

获取arrList 中所有title值

let titleList = []
function getTitle(arr) {
	arr.forEach(line => {
		titleList.push(line.title)
		if (line.child && line.child.length) {
			getTitle(line.child)
		}
	})
}

getTitle(arrList)  // [生鲜果蔬, 蔬菜, 西兰花, 辣椒, 水果, 葡萄, 荔枝, 快消品, 家居用品, 垃圾袋, 扫把]

以上是个人经验，希望对大家有所帮助！