数组对象嵌套的数组对象查找某一个属性的值，并返回一个新数组。比如多级评论列表，我们需要在页面中显示某个ID的数据。

示例如下：

var arr=[
  {
    id: 1,
    text: "hello word！",
    child: [
      {id: 2,text: "你好呀！",child: []},
      {id: 3,text: "感谢评论",child: []},
    ],
  },
 {
    id: 2,
    text: "回来看看,感谢使用fly63前端网", 
    child: [],
  },
];

需要获取：

[
  {id: 2, text: '你好呀！', child: []},
  {id: 2, text: '回来看看，感谢使用fly63前端网', child: []},
]

方式一：利用reduce方法和递归

function find(data, id) {
  const result = data.reduce((re, obj) => {
    if(obj.id === id) {
      re.push(obj);
    } else if(obj.child.length) {
      const found = find(obj.child, id);
      if(found.length) re.push(found);
    }
    return re;
  }, []);
  return result.flat();
}
var results = find(arr,2)

方式二：JSON.stringify方式

function find(data, fn) {
    let found = []
    JSON.stringify(data, (key, val) => {
        if (fn(val))
            found.push(val)
        return val
    })
    return found
}
var results = find(arr, x => x.id === 2)

使用该方法更优雅。

JSON.stringify第二参数

它的第二个参数用于过滤、格式化。参数说明：

1、没有或者是null，则所有属性被序列化。
2、为数组，则属性名在该数组内的属性被序列化。
3、为函数，则该函数会遍历属性，return undefined的属性会被忽略。

JSON.stringify第三参数

它的第三个参数用于缩进、美化：

1、没有或者是null，则正常打印。
2、为数字，则代表缩进多少个空格，最大为10，小于1则没有空格。
3、为字符串，则作为缩进使用。

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/12351