【问题标题】:Filter array by obj field and get new array with this obj field按 obj 字段过滤数组并使用此 obj 字段获取新数组
【发布时间】:2018-03-22 00:04:56
【问题描述】:

我有 const 数据,我需要 obj field company 的过滤卡数组 例如按公司:'Symu.co'

const data = {
  lanes: [
        {
            id: 'lane1',
            header: 'Quened',
            label: '',
            cards: [
                {id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'},
        ]
    },
    {
        id: 'lane2',
        header: 'Planning',
        label: '',
        cards: [
            {id: 'Task2', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},
            {id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'},
            {id: 'Task4', title: 'Dashboard', company: 'Microsoft', price: 1500, user: 'john'},
            {id: 'Task5', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'dominic'},
        ]
    },

    {
        id: 'lane3',
        header: 'Design',
        label: '',
        cards: [
            {id: 'Task6', title: 'New Logo', company: 'Google', price: 1500, user: 'michelle'},
            {id: 'Task7', title: 'New website', company: 'JCD.pl', price: 1500, user: 'dominic'},
            {id: 'Task8', title: 'New website', company: 'Themeforest', price: 1500, user: 'john'},
            {id: 'Task9', title: 'Dashboard', company: 'JCD.pl', price: 1500, user: 'jolene'},
        ]
    },

    {
        id: 'lane4',
        header: 'Development',
        label: '()',
        cards: [
            {id: 'Task10', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'},
            {id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
            {id: 'Task12', title: 'Dashboard', company: 'Google', price: 1500, user: 'dominic'},
        ]
    },
    {
        id: 'lane5',
        header: 'Testing',
        label: '()',
        cards: [
            {id: 'Task13', title: 'Landing page', company: 'JCD.pl', price: 1500, user: 'lyall'},

        ]
    },
    {
        id: 'lane6',
        header: 'Production',
        label: '()',
        cards: [
            {id: 'Task14', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},
            {id: 'Task15', title: 'New website', company: 'Themeforest', price: 1500, user: 'michelle'},
            {id: 'Task16', title: 'Dashboard', company: 'Facebook', price: 1500, user: 'lyall'},
        ]
    },
    {
        id: 'lane7',
        header: 'Completed',
        label: '()',
        cards: [
            {id: 'Task17', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'},
            {id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
        ]
    },
]

};

我的代码,但我不知道该怎么做

 for(let i = 0; i < data.lanes.length; i++) {
                var changeCards = data.lanes[i].cards.filter(function(obj) {
                    return obj.company === 'Symu.co';
                    console.log(changeCards);
                });
            }

在输出中我需要获取新的 var 新数组作为示例 在输出中,我需要获取新的 var 新数组作为示例 在输出中,我需要获取新的 var 新数组作为示例 在输出中,我需要获取新的 var 新数组作为示例 在输出中,我需要获取新的 var 新数组作为示例 在输出中,我需要获取新的 var 新数组作为示例 在输出中我需要获取新的 var 新数组作为示例

  var newArray = {
            lanes: [
                {
                    id: 'lane1',
                    header: 'Quened',
                    label: '',
                    cards: [
                        {id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'

},
            ]
        },
        {
            id: 'lane2',
            header: 'Planning',
            label: '',
            cards: [
                {id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'}
            ]
        },

        {
            id: 'lane3',
            header: 'Design',
            label: '',
            cards: [
            ]
        },

        {
            id: 'lane4',
            header: 'Development',
            label: '()',
            cards: [
                {id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
            ]
        },
        {
            id: 'lane5',
            header: 'Testing',
            label: '()',
            cards: [
            ]
        },
        {
            id: 'lane6',
            header: 'Production',
            label: '()',
            cards: [
            ]
        },
        {
            id: 'lane7',
            header: 'Completed',
            label: '()',
            cards: [
                {id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},
            ]
        },
    ]
};

但我不知道该怎么做

请帮忙!

非常感谢

【问题讨论】:

  • 您需要提供代码来演示您尝试过的内容以及可能在哪里找到问题。
  • 发布代码本身比截图更容易使用。
  • 想要的输出是什么?
  • 我编辑我想在输出中得到的内容

标签: javascript sorting filter array-filter


【解决方案1】:

您可以使用函数reduceforEachfilter 来构建所需的输出。

const data = {    lanes: [    {        id: 'lane1',        header: 'Quened',        label: '',        cards: [            {id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'},        ]    },    {        id: 'lane2',        header: 'Planning',        label: '',        cards: [            {id: 'Task2', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},            {id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'},            {id: 'Task4', title: 'Dashboard', company: 'Microsoft', price: 1500, user: 'john'},            {id: 'Task5', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'dominic'},        ]    },    {        id: 'lane3',        header: 'Design',        label: '',        cards: [            {id: 'Task6', title: 'New Logo', company: 'Google', price: 1500, user: 'michelle'},            {id: 'Task7', title: 'New website', company: 'JCD.pl', price: 1500, user: 'dominic'},            {id: 'Task8', title: 'New website', company: 'Themeforest', price: 1500, user: 'john'},            {id: 'Task9', title: 'Dashboard', company: 'JCD.pl', price: 1500, user: 'jolene'},        ]    },    {        id: 'lane4',        header: 'Development',        label: '()',        cards: [            {id: 'Task10', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'},            {id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},            {id: 'Task12', title: 'Dashboard', company: 'Google', price: 1500, user: 'dominic'},        ]    },    {        id: 'lane5',        header: 'Testing',        label: '()',        cards: [            {id: 'Task13', title: 'Landing page', company: 'JCD.pl', price: 1500, user: 'lyall'},        ]    },    {        id: 'lane6',        header: 'Production',        label: '()',        cards: [            {id: 'Task14', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},            {id: 'Task15', title: 'New website', company: 'Themeforest', price: 1500, user: 'michelle'},            {id: 'Task16', title: 'Dashboard', company: 'Facebook', price: 1500, user: 'lyall'},        ]    },    {        id: 'lane7',        header: 'Completed',        label: '()',        cards: [            {id: 'Task17', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john'},            {id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle'},        ]    },]};

function filterBy(target) {
  return data.lanes.reduce((a, {id, header, label, cards}) => {
    a.lanes.push({id, header, label, cards: cards.filter(({company}) => company === target)});
    return a;
  }, {lanes: []});
}

var result = filterBy('Symu.co');
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】:

  • 你能解释一下如何工作 var result = Object.keys(data).reduce((a, k)
  • @ВоваМагдич 我删除了Object.keys
  • 我可以把这个例子改写成带参数字符串的函数吗?
  • 谢谢很多人)我开始学习 react 和 js,你能给我一些建议)
  • @ВоваМагдич 先开始学习js,访问MDN的网站
【解决方案2】:
const filteredCards = cards.filter({ company } => company === 'Google');

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

【讨论】:

    【解决方案3】:

    var data = { lanes: [ { id: 'lane1', header: 'Quened', label: '', cards: [ { id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle' }, ] }, { id: 'lane2', header: 'Planning', label: '', cards: [ { id: 'Task2', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene' }, { id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall' }, { id: 'Task4', title: 'Dashboard', company: 'Microsoft', price: 1500, user: 'john' }, { id: 'Task5', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'dominic' }, ] }, { id: 'lane3', header: 'Design', label: '', cards: [ { id: 'Task6', title: 'New Logo', company: 'Google', price: 1500, user: 'michelle' }, { id: 'Task7', title: 'New website', company: 'JCD.pl', price: 1500, user: 'dominic' }, { id: 'Task8', title: 'New website', company: 'Themeforest', price: 1500, user: 'john' }, { id: 'Task9', title: 'Dashboard', company: 'JCD.pl', price: 1500, user: 'jolene' }, ] }, { id: 'lane4', header: 'Development', label: '()', cards: [ { id: 'Task10', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john' }, { id: 'Task11', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle' }, { id: 'Task12', title: 'Dashboard', company: 'Google', price: 1500, user: 'dominic' }, ] }, { id: 'lane5', header: 'Testing', label: '()', cards: [ { id: 'Task13', title: 'Landing page', company: 'JCD.pl', price: 1500, user: 'lyall' }, ] }, { id: 'lane6', header: 'Production', label: '()', cards: [ { id: 'Task14', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene' }, { id: 'Task15', title: 'New website', company: 'Themeforest', price: 1500, user: 'michelle' }, { id: 'Task16', title: 'Dashboard', company: 'Facebook', price: 1500, user: 'lyall' }, ] }, { id: 'lane7', header: 'Completed', label: '()', cards: [ { id: 'Task17', title: 'Mobile App', company: 'Facebook', price: 1500, user: 'john' }, { id: 'Task18', title: 'New website', company: 'Symu.co', price: 1500, user: 'michelle' }, ] },] }
    
    var filter = c => data.lanes.reduce((a, v) => 
                  (a.push( { ...v, cards: v.cards.filter(v => v.company == c) } ), a), [])
    
    console.log( filter('Symu.co') )

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-01-13
      • 1970-01-01
      • 2016-04-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多