从数组中提供的属性中解构对象属性

Question

我需要创建一个函数 getPropertiesData(list)，它接受一个属性列表和一个包含这些属性的对象，并且只有 return 个在列表中匹配的对象的属性。

插图：

function getPropertiesData(['x', 'y']){
    const o = {
        'x': 1, 
        'y': 2, 
        'z': 3
       }

    // Will return 
    return {
        'x': 1,
        'y': 2
       }
    // not including the 'z' variable since it was not specified as input in the list array
}

如何在 javascript 中做到这一点？

Answer 1

您可以通过遍历对象中的 key/value 对来执行此操作，并使用数组 reduce 来隔离您要查找的对象。在这里，reduce 在遍历所有对象值的同时构建一个新对象。

const getPropertiesData = (obj, props) =>
  Object.entries(obj)
    .reduce((result, [key, value]) =>
      props.includes(key) ? {...result, [key]:value} : result
    , {})

然后您可以使用您的对象对其进行测试，o:

const o = {
 'x': 1, 
 'y': 2, 
 'z': 3
}

console.log(getPropertiesData(o, ['x', 'y']))

Answer 2

您可以使用 Object.entries to obtain an array of key/value pair arrays of an object. Next, filter the entries array by inclusion in the wantedKeys array. Finally, create an object from the selected pairs using Object.fromEntries.

const o = {a: 1, b: 2, c: 3};
const wantedKeys = ["a", "c"];

const selected = Object.fromEntries(
  Object.entries(o)
        .filter(([k, v]) => wantedKeys.includes(k))
);

console.log(selected);

这在大型对象上可能会很慢，因此您可以使用 map 和 filter 将复杂度绑定到 wantedKeys 数组。

如果您要将它变成一个函数，则对对象进行硬编码是没有意义的。我也将其添加为参数：

const pickFromObj = (o, wantedKeys) => Object.fromEntries(
  wantedKeys.filter(e => e in o)
            .map(e => [e, o[e]])
);

console.log(pickFromObj({a: 1, b: 2, c: 3}, ["a", "c"]));

Answer 3

您可以使用 Object.assign() 方法满足此要求，例如：

function getPropertiesData(arr) {
  const o = { 'x': 1, 'y': 2, 'z': 3 }
  return Object.assign({}, ...arr.map(a => ({[a]: o[a]})));
}

console.log(getPropertiesData(['x', 'y']))

如果您只需要获取对象 o 中存在的键的值，您可以使用：

function getPropertiesData(arr) {
  const o = { 'x': 1, 'y': 2, 'z': 3 }
  return Object.assign({}, ...arr.map(a => o.hasOwnProperty(a) ? ({[a]: o[a]}) : null));
}

console.log(getPropertiesData(['x', 'y']))
console.log(getPropertiesData(['w', 'x']))

Answer 4

该函数应接受对象 o 和属性数组 props。在输入 props 上使用 Array.prototype.reduce 以使用 Object.assign.

创建新的输出对象

const getProperties = (o = {}, props = []) =>
  props.reduce
    ( (r, k) => Object.assign(r, { [k]: o[k] })
    , {}
    )

const result =
  getProperties({ a: 1, b: 2, c: 3 }, [ 'a', 'b', 'z' ])

console.log(result)
// { a: 1, b: 2, z: undefined }

Answer 5

只需通过将所需键与值映射来创建一个新对象。

function getPropertiesData(properties) {
    const o = { x: 1, y: 2, z: 3 };
    return Object.fromEntries(properties.map(k => [k, o[k]]));
}

console.log(getPropertiesData(['x', 'y']));

从数组中提供的属性中解构对象属性

Destructure object properties from properties provided in an array

javascript

arrays

javascript-objects

object-destructuring