假设我有一个对象:
elmo = {
color: 'red',
annoying: true,
height: 'unknown',
meta: { one: '1', two: '2'}
};
我想用它的属性子集创建一个新对象。
// pseudo code
subset = elmo.slice('color', 'height')
//=> { color: 'red', height: 'unknown' }
我怎样才能做到呢?
假设我有一个对象:
elmo = {
color: 'red',
annoying: true,
height: 'unknown',
meta: { one: '1', two: '2'}
};
我想用它的属性子集创建一个新对象。
// pseudo code
subset = elmo.slice('color', 'height')
//=> { color: 'red', height: 'unknown' }
我怎样才能做到呢?
当前回答
在这个问题中,解构为动态命名的变量在JavaScript中是不可能的。
要动态设置键,可以使用reduce函数而不改变对象,如下所示:
const get子集= (obj,…keys) =>个key。Reduce ((a, c) =>({…A, [c]: obj[c]}), {}); Const elmo = { 颜色:红色, 讨厌:没错, 高度:“未知”, Meta: {1: '1', 2: '2'} } const子集= get子集(elmo, 'color', '烦人') console.log(子集)
应该注意的是,你是在每次迭代中创建一个新对象,而不是更新一个克隆。——mpen
下面是一个使用reduce和单个克隆的版本(更新传入的初始值以reduce)。
const get子集= (obj,…keys) =>个key。Reduce ((acc, curr) => { Acc [curr] = obj[curr] 返回acc }, {}) Const elmo = { 颜色:红色, 讨厌:没错, 高度:“未知”, Meta: {1: '1', 2: '2'} } const子集= get子集(elmo, '烦人','height', 'meta') console.log(子集)
其他回答
我建议看看Lodash;它有很多实用函数。
例如,pick()就是你要找的东西:
var subset = _.pick(elmo, ['color', 'height']);
小提琴
对象数组
const aListOfObjects = [{
prop1: 50,
prop2: "Nothing",
prop3: "hello",
prop4: "What's up",
},
{
prop1: 88,
prop2: "Whatever",
prop3: "world",
prop4: "You get it",
},
]
创建一个或多个对象的子集可以通过这种方式解构对象来实现。
const sections = aListOfObjects.map(({prop1, prop2}) => ({prop1, prop2}));
还有一个解决方案:
var subset = {
color: elmo.color,
height: elmo.height
}
到目前为止,这看起来比任何答案都更具可读性,但也许这只是我的想法!
打印稿的解决方案:
function pick<T extends object, U extends keyof T>(
obj: T,
paths: Array<U>
): Pick<T, U> {
const ret = Object.create(null);
for (const k of paths) {
ret[k] = obj[k];
}
return ret;
}
输入信息甚至允许自动补全:
Credit to definitelytyping for U extends keyof T trick!
打印稿操场
这适用于我在Chrome控制台。有什么问题吗?
var { color, height } = elmo
var subelmo = { color, height }
console.log(subelmo) // {color: "red", height: "unknown"}