递归遍历取出数组中的某一属性

在很多情况下我们需要对从后端拿的数据进行处理，例如从多层嵌套中获取某一属性。
例如下面这个数组，这个数组有多层嵌套的结构。如果我们需要用到数组结构中所有的name属性，并将之生成一个新的数组，这时我们就需要通过循环获取内层的name属性。但如果层级稍微多一点，有三层或以上的嵌套（当然这样的数据结构本身就不合理，这里我们仅作一种假设）。这时我们就需要用到三层及以上的循环次数。
显然这样是并不高效和并不符合代码格式美观的，这时我们就可以用到递归遍历的方法。
如下时一个模拟的数组，我们需要取出其中的name属性，并就将它拼接成一个新的字符串。

var data = [
        {
          name: "所有物品",
          children: [
            {
              name: "水果",
              children: [
                {
                  name: "苹果",
                  children: [{ name: "青苹果" }, { name: "红苹果" }],
                },
              ],
            },
            {
              name: "主食",
              children: [
                {
                  name: "米饭",
                  children: [{ name: "北方米饭" }, { name: "南方米饭" }],
                },
              ],
            },
            {
              name: "生活用品",
              children: [
                {
                  name: "电脑类",
                  children: [{ name: "联想电脑" }, { name: "苹果电脑" }],
                },
                {
                  name: "工具类",
                  children: [{ name: "锄头" }, { name: "锤子" }],
                },
                {
                  name: "生活用品",
                  children: [{ name: "洗发水" }, { name: "沐浴露" }],
                },
              ],
            },
          ],
        },
      ];

function getName(list){
    let str = ''
    function fn(list) {
        list.forEach(it=>{
            if(it.children){
                str += it.name
                fn(it.children)
            } else {
                str += it.name
            }
        })
    }
    fn(list)
    return str
}

如上代码即可实现