Javascript json 带箭头功能的过滤器

Question

我想知道如何使用箭头函数过滤上面 json 中的“标签”值：

const ttag = [{
    "code": 795302828,
    "code_integration": "123",
    "company": "ACME LTD",
    "phone": "135575788",
    "tags": [{"tag": "companyAA"},
             {"tag": "companyBB"},
             {"tag": "companyCC"},
             {"tag": "companyDD"}
            ],
    "status": "Y"
}]

const onlyTags = ttag.filter(f => f.tags)
console.log(onlyTags)

预期结果： ['companyAA', 'companyBB', 'companyCC', 'companyDD']

Answer 1

您可以遍历您的数组并将结果推送到一个新数组，就像这样

const ttag = [{
    "code": 795302828,
    "code_integration": "123",
    "company": "ACME LTD",
    "phone": "135575788",
    "tags": [{"tag": "companyAA"},
             {"tag": "companyBB"},
             {"tag": "companyCC"},
             {"tag": "companyDD"}
            ],
    "status": "Y"
}]

const res = [];
ttag.forEach(x => {
    x.tags.forEach(y => {
        res.push(y.tag);
    })
})

console.log(res);

Answer 2

首先，这不是 filter 方法的工作原理。 Filter returns 一个数组，其值为 true 作为参数传递的函数。更多你可以阅读 here.

您可以使用 map & flatMap，像这样：

ttag.flatMap(f => f.tags.map(t => t.tag));

map returns array of values specified in the passed method. flatMap 做同样的事情，但是如果结果是一个数组，它会将它展平，所以结果是一个字符串数组而不是字符串数组的数组。

重要

flatMap 在 Internet Explorer 中不受支持，但它已经是不受支持的浏览器，所以我不会打扰。

Answer 3

这可能是一种丑陋的方式，但是第一个 .map 你得到主数组的每个项目，第二个 .map 里面有一个标签数组。

const ttag = [{
    "code": 795302828,
    "code_integration": "123",
    "company": "ACME LTD",
    "phone": "135575788",
    "tags": [{"tag": "companyAA"},
             {"tag": "companyBB"},
             {"tag": "companyCC"},
             {"tag": "companyDD"}
            ],
    "status": "Y"
}]

const onlyTags = ttag.map(f => f.tags.map(t => t.tag));
console.log(onlyTags);
console.log(onlyTags[0]); // expected output

Answer 4

这是一种使用 map 和 reduce 的解决方案。最后数组被展平，所以它 returns 只有一个包含城市名称的数组

const ttag = [{
  "code": 795302828,
  "code_integration": "123",
  "company": "ACME LTD",
  "phone": "135575788",
  "tags": [{
      "tag": "companyAA"
    },
    {
      "tag": "companyBB"
    },
    {
      "tag": "companyCC"
    },
    {
      "tag": "companyDD"
    }
  ],
  "status": "Y"
}]

const result = ttag.map(obj => obj.tags.reduce((acc, next) => [...acc, next.tag], [])).flat()
console.log(result)

Answer 5

我认为这应该适用于所有浏览器：

const ttag = [
  {
      "code": 795302828,
      "code_integration": "123",
      "company": "ACME LTD",
      "phone": "135575788",
      "tags": [{"tag": "companyAA"},
               {"tag": "companyBB"},
               {"tag": "companyCC"},
               {"tag": "companyDD"}
              ],
      "status": "Y"
  },
  {
      "code": 795302829,
      "code_integration": "124",
      "company": "ACME2 LTD",
      "phone": "135575789",
      "tags": [{"tag": "companyEE"},
               {"tag": "companyFF"},
               {"tag": "companyJJ"}
              ],
      "status": "Y"
  }
]

const onlyTags = ttag.map(f => f.tags.map(t => t.tag)).reduce((p, c) => [].concat(p,c));
console.log(onlyTags);

Javascript json 带箭头功能的过滤器

Javascript json filter with arrow function

javascript

arrow-functions

重要