你不知道的js遞歸技巧

遞歸找對應的節點

要求以下輸入一個id, 找出對應的id所對應的結構

var arr =[
    {id: 1,children: []},
    {id: 2,children: []},
    {id: 3,children: []},
    {id: 4,children: []},
    {id: 5,children: []},
    {
      id: 6,
      children: [
        {
          id: 7,
          children: [{id: 9, children:[]}]
        },{
          id: 8,
          children: []
        }
      ]
    },
  ];
  
  
  方法以下: 
  function digui(arr, id) {
    for(let i = 0; i< arr.length; i++) {
      if(arr[i].id === id){
        return arr[i]
      } else {
        if(arr[i].children.length !== 0){
          return digui(arr[i].children, id)
        }
      }
    }
  }
  
console.log(digui(arr, 9));   //{id: 9, children:[]}
console.log(digui(arr, 6));   
// 結果: 
// {
// id: 6,
// children: [
// {
// id: 7,
// children: [{id: 9, children:[]}]
// },{
// id: 8,
// children: []
// }
// ]
// }
複製代碼

遞歸找到沒有children的全部子節點name

var data = [
    {
      name: "全部物品",
      children: [
        {
          name: "水果",
          children: [{name: "蘋果", children: [{name: '青蘋果',children: [{name: '北方米飯'}, {name: '南方米飯'}]}, {name: '紅蘋果'}]}]
        },
        {
          name: '主食',
          children: [
            {name: "米飯"}
          ]
        },
        {
          name: '生活用品',
          children: [
            {name: "電腦類", children: [{name: '聯想電腦'}, {name: '蘋果電腦'}]},
            {name: "工具類", children: [{name: "鋤頭"}, {name: "錘子"}]},
            {name: "生活用品", children: [{name: "洗髮水"}, {name: "沐浴露"}]}
          ]
        }
      ]
    }]
    
    function didui(arr) {
      let arrList = ''
      function f(arr) {
        arr.forEach(item => {
          if(item.children) {
            arguments.callee(item.children)
          } else {
            arrList += item.name + ';';
          }
        })
      }
      f(arr)
      return arrList;
    }

  console.log(didui(data));  //北方米飯;南方米飯;紅蘋果;米飯;聯想電腦;蘋果電腦;鋤頭;錘子;洗髮水;沐浴露;

複製代碼