【问题标题】:JS ES6 Correct way to filter object by array of keysJS ES6 通过键数组过滤对象的正确方法
【发布时间】:2019-09-23 12:41:59
【问题描述】:

我想获取一个对象数组并过滤每个对象以仅返回键与数组中的项目匹配的属性。

例如:

const myKeys    = ['key_1', 'key_3'];
const myArray   = [
    { 
        key_1: 'Some Value A',
        key_2: 'Some Other Value A', 
        key_3: 'Some Final Value A',
    },
    { 
        key_1: 'Some Value B',
        key_2: 'Some Other Value B', 
        key_3: 'Some Final Value B',
    },
    { 
        key_1: 'Some Value C',
        key_2: 'Some Other Value C', 
        key_3: 'Some Final Value C',
    },
];

应该产生以下结果:

const result   = [
    { 
        key_1: 'Some Value A',
        key_3: 'Some Final Value A',
    },
    { 
        key_1: 'Some Value B',
        key_3: 'Some Final Value B',
    },
    { 
        key_1: 'Some Value C',
        key_3: 'Some Final Value C',
    },
];

我相信这应该可以通过 .map().filter() 的组合实现,但我不确定如何最好地使用 ES6 实现以下等效:

const filteredData = (array, keys) => {
    const newArr = [];

    for (let i = 0; i < myArray.length; i++) {
        const item      = myArray[i];
        let newObj      = {};

        for (let j = 0; j < myKeys.length; j++) {
            const filter = myKeys[j];
            newObj[filter] = item[filter];
        }

        newArr.push(newObj);
    }

    return newArr;
}

console.log(filteredData(myArray, myKeys));

【问题讨论】:

    标签: javascript


    【解决方案1】:

    您可以映射 wnated 条目并使用它构建对象。

    const 
        keys = ['key_1', 'key_3'],
        data = [{ key_1: 'Some Value A', key_2: 'Some Other Value A', key_3: 'Some Final Value A' }, { key_1: 'Some Value B', key_2: 'Some Other Value B', key_3: 'Some Final Value B' }, { key_1: 'Some Value C', key_2: 'Some Other Value C', key_3: 'Some Final Value C' }],
        result = data.map(o => Object.fromEntries(keys.map(k => [k, o[k]])));
    
    console.log(result);
    .as-console-wrapper { max-height: 100% !important; top: 0; }

    【讨论】:

      【解决方案2】:

      您可以简单地循环 keys 并构建一个仅包含这些键和相应值的新对象

      const myKeys = ['key_1', 'key_3'];
      const myArray = [{key_1: 'Some Value A',key_2: 'Some Other Value A',key_3: 'Some Final Value A',},{key_1: 'Some Value B',key_2: 'Some Other Value B',key_3: 'Some Final Value B',},{key_1: 'Some Value C',key_2: 'Some Other Value C',key_3: 'Some Final Value C',},];
      
      let final = myArray.map(v => {
        return myKeys.reduce((op, key) => {
          op[key] = v[key]
          return op
        }, {})
      })
      
      console.log(final)

      【讨论】:

        【解决方案3】:

        const myKeys    = ['key_1', 'key_3'];
        const myArray   = [
        	{
        		key_1: 'Some Value A',
        		key_2: 'Some Other Value A',
        		key_3: 'Some Final Value A',
        	},
        	{
        		key_1: 'Some Value B',
        		key_2: 'Some Other Value B',
        		key_3: 'Some Final Value B',
        	},
        	{
        		key_1: 'Some Value C',
        		key_2: 'Some Other Value C',
        		key_3: 'Some Final Value C',
        	},
        ];
        
        const result = myArray.map(i => Object.fromEntries(Object.entries(i).filter(([k]) => myKeys.includes(k))));
        
        console.log(result);

        【讨论】:

          【解决方案4】:

          你可以.map 每个对象到它的条目,这样你就可以.filter 删除任何在myKeys 中没有键的条目,然后使用.fromEntries() 来构建你的新对象,如下所示:

          const myKeys = ['key_1', 'key_3'];
          const myArray = [{
              key_1: 'Some Value A',
              key_2: 'Some Other Value A',
              key_3: 'Some Final Value A',
            },
            {
              key_1: 'Some Value B',
              key_2: 'Some Other Value B',
              key_3: 'Some Final Value B',
            },
            {
              key_1: 'Some Value C',
              key_2: 'Some Other Value C',
              key_3: 'Some Final Value C',
            },
          ];
          
          const res = myArray.map(obj => Object.fromEntries(Object.entries(obj).filter(([k, v]) => myKeys.includes(k))));
          
          console.log(res);

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 2019-07-18
            • 1970-01-01
            • 1970-01-01
            • 2018-11-12
            • 2018-07-31
            • 2022-09-24
            • 2021-07-08
            • 1970-01-01
            相关资源
            最近更新 更多