javascript - 将对象值作为单独的项目推送到数组中

Question

我想将下面对象的所有粉红色值作为项目添加到粉红色数组中。

const mainObj = [
{
    image: 'test_icon.jpg',
    colour: "pink",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "pink",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "pink",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "pink",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "green",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "green",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "blue",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "blue",
    text: "text",
    link: ""
},
{
    image: 'test_icon.jpg',
    colour: "green",
    text: "text",
    link: ""
}
];

到目前为止我所拥有的：

for(let i = 0; i < mainObj.length; i++) {
    if(mainObj[i].colour == "pink") {
        const pink = [];
        pink.push(mainObj[i].colour);   
    }
}

我遇到的问题是，目前它没有将所有粉红色值推送到一个粉红色数组中，而是单独创建一个粉红色数组并为每个数组添加一个。

标签： javascriptarraysobject

Answer 1

基本的

您可以使用 filter 方法执行此操作，该方法将自动创建一个包含您想要的值的数组。

let pinkArray = ;
console.log(pinkArray);

https://jsfiddle.net/1pjh56a3/2/

特定值/列

您还可以创建一个仅包含对象中特定字段的数组：

 let pinkArray = mainObj.filter( e =>  e.colour == 'pink');
console.log(pinkArray);

var pinkArrayCopy = [];
for(i in pinkArray){
        let item = pinkArray[i];
    pinkArrayCopy.push({"colour": item.colour, "text": item.text});
 }

console.log(pinkArrayCopy);

https://jsfiddle.net/1pjh56a3/6/

甚至更多功能（新对象）

 let pinkArray = mainObj.filter( e =>  e.colour == 'pink').map( 
 j =>  {
                    return {"a": j.colour, "b": j.text}; 
            }
 );

console.log(pinkArray);

https://jsfiddle.net/1pjh56a3/16/