Lodash 的 pick() 函数介绍和使用

Question

给定一个对象 obj 和一个字符串数组 paths, Lodash 的 pick() 函数 返回一个只有键的新对象 paths 从 obj。

const obj = {
  name: 'Will Riker',
  rank: 'Commander',
  age: 29
};
const picked = _.pick(obj, ['name', 'rank']);

picked === obj; // false
picked.name; // 'Will Riker'
picked.rank; // 'Commander'
picked.age; // undefined

这 pick() 任何其他语法 Lodash 的 get() 功能 支持。 例如，如果 name 是具有 2 个属性的嵌套对象， first 和 last，你可以只选 name.last 并省略 name.first。

const obj = {
  name: {
    first: 'Will',
    last: 'Riker'
  },
  rank: 'Commander',
  age: 29
};
const picked = _.pick(obj, ['name.last', 'rank']);

picked === obj; // false
picked.name.first; // undefined
picked.name.last; // 'Riker'
picked.rank; // 'Commander'
picked.age; // undefined

pick() 在缺少属性时是允许的。 如果你尝试 pick() 如果父属性未定义，Lodash 将忽略该路径。

const obj = {
  name: 'Will Riker',
  rank: 'Commander',
  age: 29
};
// Lodash will ignore 'this.is.not.in.the.object', because
// that path isn't in the object.
const picked = _.pick(obj, ['name', 'this.is.not.in.the.object']);

picked === obj; // false
picked.name; // 'Will Riker'
picked.rank; // undefined
picked.age; // undefined

其他几个框架也有类似的 pick() 功能。 例如， Mongoose 模式有一个 pick()函数 创建新模式的

Vanilla JS 替代品

您可以使用几种不同的模式来近似 Lodash 的 pick() 原生 JavaScript 中的函数。 我们最喜欢使用 IIFE ，如下所示：

const obj = {
  name: 'Will Riker',
  rank: 'Commander',
  age: 29
};

// Looks tricky, but the idea is that you're calling an anonymous arrow
// function that returns just the `name` and `rank` properties of the passed
// in object.
const picked = (({ name, rank }) => ({ name, rank }))(obj);
picked.name; // 'Will Riker'
picked.rank; // 'Commander'
picked.age; // undefined

下面是一种更易于阅读但不太简洁的方法：

const pickNameRank = ({ name, rank }) => ({ name, rank });
const picked = pickNameRank(obj);

这种 IIFE 方法有一些缺点：

1. 您需要提前知道属性名称。 扩展此模式以对一组键进行操作会很棘手。
2. 不支持虚线键。 你不能做类似的事情 ({ 'name.first' }) => ....

我们喜欢的另一种方法是定义一个函数 for 创建一个新对象的循环，如下所示。 这种方法不太简洁，但更灵活。

function pick(obj, keys) {
  const ret = {};
  for (const key of keys) {
    ret[key] = obj[key];
  }
  return ret;
}