如何使用Javascript或Lodash搜索嵌套对象数组。

huangapple
go评论103阅读模式
英文:

How to search through array of nested objects using Javascript or Lodash

问题

以下是您要求的翻译部分：

  1. 我有一个如下的对象数组：
  3. const data = [
  4.   {
  5.     slug: "home",
  6.     content_one: [],
  7.     content_two: [
  8.       {
  9.         title: "Some title",
  10.         description: 'Some description'
  11.       }
  12.     ],
  13.     content_three: [
  14.       {
  15.         main_title: "Some title",
  16.         content: 'Here comes some content'
  17.       }
  18.     ],
  19.   },
  20.   {
  21.     slug: "contact",
  22.     content_one: [
  23.       {
  24.         title: "Some title",
  25.         description: 'Some description'
  26.       }
  27.     ],
  28.     content_two: [],
  29.     content_three: [],
  30.   },
  31.   {
  32.     slug: "about-us",
  33.     content_one: [],
  34.     content_two: [],
  35.     content_three: [],
  36.   }
  37. ]
  39. 而且我有一个搜索词的数组如下：
  41. const search_terms = ['Some', 'title']
  43. 我想要在数据数组中搜索，并找到包含其中一个搜索词的所有对象。
  45. 结果应该如下：
  47. const res = [
  48. 	{
  49.   	slug: 'home',
  50.     text: 'Some title',
  51.     count: 2
  52.   },
  53.   {
  54.   	slug: 'contact',
  55.     text: 'Some title',
  56.     count: 1
  57.   }
  58. ]
  60. 我不确定如何做，因为嵌套数组的属性不同。
  62. 需要像下面这样做：
  64. let result = []
  65. search_terms.map(term => {
  66. 	data.filter(item => {
  67.   	console.log(item)
  68.   })
  69. })
  71. 但不确定如何做。
  73. [这是示例链接。][1]
  75. 有什么想法吗？
  77.   [1]: https://jsfiddle.net/tox4dqj6/

如果您需要进一步的解释或代码示例，请随时告诉我。

英文:

I have an array of objects as follows:

  1. const data = [
  2. {
  3. slug: "home",
  4. content_one: [],
  5. content_two: [
  6. {
  7. title: "Some title",
  8. description: 'Some description'
  9. }
  10. ],
  11. content_three: [
  12. {
  13. main_title: "Some title",
  14. content: 'Here comes some content'
  15. }
  16. ],
  17. },
  18. {
  19. slug: "contact",
  20. content_one: [
  21. {
  22. title: "Some title",
  23. description: 'Some description'
  24. }
  25. ],
  26. content_two: [],
  27. content_three: [],
  28. },
  29. {
  30. slug: "about-us",
  31. content_one: [],
  32. content_two: [],
  33. content_three: [],
  34. }
  35. ]

And I have an array of search terms as follows:

  1. const search_terms = ['Some', 'title']

I want to search through the data array, and find all objects which have one of those searched terms.

The result should be as follows:

  1. const res = [
  2. {
  3. slug: 'home',
  4. text: 'Some title',
  5. count: 2
  6. },
  7. {
  8. slug: 'contact',
  9. text: 'Some title',
  10. count: 1
  11. }
  12. ]

I'm not sure how to do that, because the properties of the nested arrays are not the same.

It needs to be something as follows:

  1. let result = []
  2. search_terms.map(term => {
  3. data.filter(item => {
  4. console.log(item)
  5. })
  6. })

But not sure how to do that.

Here is the fiddle.

Any idea?

答案1

得分: 2

以下是代码的翻译部分：

你可以首先使用递归查找所有具有匹配文本的对象，然后进行计数并移除重复项。

  1. const data = [
  2.   {"slug": "home", "content_one": [], "content_two": [{"title": "一些标题", "description": "一些描述"}], "content_three": [{"main_title": "一些标题", "content": "这里是一些内容"}]},
  3.   {"slug": "contact", "content_one": [{"title": "一些标题", "description": "一些描述"}], "content_two": [], "content_three": []},
  4.   {"slug": "about-us", "content_one": [], "content_two": [], "content_three": []}
  5. ];
  7. const search_terms = ['一些', '标题'];
  9. function search(data, terms, slug = '') {
  10.   const result = [];
  12.   if (data.slug) {
  13.     slug = data.slug;
  14.   }
  16.   if (Array.isArray(data)) {
  17.     data.forEach(e => result.push(...search(e, terms, slug)))
  18.   } else {
  19.     let added = false;
  20.     for (let i in data) {
  21.       if (typeof data[i] == 'object') {
  22.         result.push(...search(data[i], terms, slug));
  23.       } else {
  24.         const check = terms.some(t => data[i].toLowerCase().includes(t.toLowerCase()));
  25.         if (check && !added) {
  26.           result.push({
  27.             slug,
  28.             text: data[i]
  29.           });
  30.           added = true;
  31.         }
  32.       }
  33.     }
  34.   }
  36.   return result;
  37. }
  39. function uniq(data) {
  40.   return data.reduce((r, e) => {
  41.     const match = r.find(({ count, ...rest }) => _.isEqual(rest, e));
  42.     if (match) match.count++
  43.     else r.push({ ...e, count: 1 });
  44.     return r;
  45.   }, [])
  46. }
  48. const array = search(data, search_terms);
  49. const result = uniq(array);
  51. console.log(result);

希望这有所帮助！如果您需要进一步的翻译或解释，请告诉我。

英文:

You could first find all objects with matching text using recursion and then do the count and remove duplicates.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

  1. const data = [{&quot;slug&quot;:&quot;home&quot;,&quot;content_one&quot;:[],&quot;content_two&quot;:[{&quot;title&quot;:&quot;Some title&quot;,&quot;description&quot;:&quot;Some description&quot;}],&quot;content_three&quot;:[{&quot;main_title&quot;:&quot;Some title&quot;,&quot;content&quot;:&quot;Here comes some content&quot;}]},{&quot;slug&quot;:&quot;contact&quot;,&quot;content_one&quot;:[{&quot;title&quot;:&quot;Some title&quot;,&quot;description&quot;:&quot;Some description&quot;}],&quot;content_two&quot;:[],&quot;content_three&quot;:[]},{&quot;slug&quot;:&quot;about-us&quot;,&quot;content_one&quot;:[],&quot;content_two&quot;:[],&quot;content_three&quot;:[]}]
  2. const search_terms = [&#39;Some&#39;, &#39;title&#39;]
  3. function search(data, terms, slug = &#39;&#39;) {
  4. const result = [];
  5. if (data.slug) {
  6. slug = data.slug;
  7. }
  8. if (Array.isArray(data)) {
  9. data.forEach(e =&gt; result.push(...search(e, terms, slug)))
  10. } else {
  11. let added = false;
  12. for (let i in data) {
  13. if (typeof data[i] == &#39;object&#39;) {
  14. result.push(...search(data[i], terms, slug));
  15. } else {
  16. const check = terms.some(t =&gt; data[i].toLowerCase().includes(t.toLowerCase()));
  17. if (check &amp;&amp; !added) {
  18. result.push({
  19. slug,
  20. text: data[i]
  21. });
  22. added = true;
  23. }
  24. }
  25. }
  26. }
  27. return result;
  28. }
  29. function uniq(data) {
  30. return data.reduce((r, e) =&gt; {
  31. const match = r.find(({ count, ...rest }) =&gt; _.isEqual(rest, e));
  32. if (match) match.count++
  33. else r.push({ ...e, count: 1 });
  34. return r;
  35. }, [])
  36. }
  37. const array = search(data, search_terms);
  38. const result = uniq(array);
  39. console.log(result)

<!-- language: lang-html -->

  1. &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js&quot;&gt;&lt;/script&gt;

<!-- end snippet -->

huangapple
  • 本文由 发表于 2020年1月6日 17:30:10
  • 转载请务必保留本文链接：https://go.coder-hub.com/59609600.html
  • javascript
  • lodash
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定