假设我有一个对象:

{
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
}

我想通过过滤上面的对象来创建另一个对象这样我就有了。

 {
    item1: { key: 'sdfd', value:'sdfd' },
    item3: { key: 'sdfd', value:'sdfd' }
 }

我正在寻找一种干净的方法来实现这一点使用Es6,所以扩散操作符是可用的。


当前回答

你可以这样做:

const base = {
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

const filtered = (
    source => { 
        with(source){ 
            return {item1, item3} 
        } 
    }
)(base);

// one line
const filtered = (source => { with(source){ return {item1, item3} } })(base);

这是可行的,但不是很清楚,加上with语句不推荐(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with)。

其他回答

我知道这个问题已经有很多答案了,这是一个相当老的问题。但我刚想出了一句简洁的俏皮话

JSON.parse(JSON.stringify(raw, ['key', 'value', 'item1', 'item3']))

这将返回另一个具有白名单属性的对象。注意,键和值包含在列表中。

如果你有一个允许值的列表,你可以很容易地将它们保留在一个对象中:

Const raw = { Item1: {key: 'sdfd', value:'sdfd'}, Item2: {key: 'sdfd', value:'sdfd'}, Item3:{键:'sdfd',值:'sdfd'} }; Const allowed = ['item1', 'item3']; const filtered = Object.keys(raw) .filter(key => allowed.includes(key)) .reduce((obj, key) => { Obj [key] = raw[key]; 返回obj; }, {}); console.log(过滤);

这个用途:

对象。键来列出原始(原始数据)中的所有属性 Array.prototype.filter选择允许列表中出现的键,使用 Array.prototype.includes以确保它们存在 reduce构建一个只包含允许属性的新对象。

这将使用允许的属性创建一个浅拷贝(但不会复制属性本身)。

你也可以使用对象扩展操作符来创建一系列对象而不改变它们(感谢rjerue提到了这一点):

Const raw = { Item1: {key: 'sdfd', value:'sdfd'}, Item2: {key: 'sdfd', value:'sdfd'}, Item3:{键:'sdfd',值:'sdfd'} }; Const allowed = ['item1', 'item3']; const filtered = Object.keys(raw) .filter(key => allowed.includes(key)) .reduce((obj, key) => { 返回{ obj, (例子):生(例子) }; }, {}); console.log(过滤);

出于琐事的目的,如果你想从原始数据中删除不需要的字段(我不建议这样做,因为它涉及一些丑陋的突变),你可以像这样反转includes检查:

Const raw = { Item1: {key: 'sdfd', value:'sdfd'}, Item2: {key: 'sdfd', value:'sdfd'}, Item3:{键:'sdfd',值:'sdfd'} }; Const allowed = ['item1', 'item3']; 种(生) .filter(key => !allowed.includes(key)) .forEach(key => delete raw[key]); console.log(生);

我使用这个示例是为了展示一个基于突变的解决方案,但我不建议使用它。

没有什么之前没有说过的,但是把一些答案结合到ES6的一般答案中:

Const raw = { Item1: {key: 'sdfd', value: 'sdfd'}, Item2: {key: 'sdfd', value: 'sdfd'}, Item3:{键:'sdfd',值:'sdfd'} }; const filteredKeys = ['item1', 'item3']; const filtered = filteredKeys .reduce((obj, key) =>({…Obj, [key]: raw[key]}), {}); console.log(过滤);

如果你可以使用ES6语法,我发现最干净的方法是:

const data = {
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

const { item2, ...newData } = data;

现在,newData包含:

{
  item1: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

或者,如果你将键存储为字符串:

const key = 'item2';
const { [key]: _, ...newData } = data;

在后一种情况下,[key]被转换为item2,但由于您使用的是const赋值,因此需要为赋值指定一个名称。_表示丢弃值。

更普遍的:

const { item2, ...newData } = data; // Assign item2 to item2
const { item2: someVarName, ...newData } = data; // Assign item2 to someVarName
const { item2: _, ...newData } = data; // Assign item2 to _
const { ['item2']: _, ...newData } = data; // Convert string to key first, ...

这不仅将您的操作减少到一行程序,而且还不需要知道其他键是什么(那些您想要保留的键)。

一个简单的效用函数是这样的:

function removePropFromObject(obj, prop) {
  const { [prop]: _, ...rest } = obj
  return { ...rest }
}

在循环过程中,当遇到某些属性/键时,不返回任何内容,并继续执行其余的:

const loop = product =>
Object.keys(product).map(key => {
    if (key === "_id" || key === "__v") {
        return; 
    }
    return (
        <ul className="list-group">
            <li>
                {product[key]}
                <span>
                    {key}
                </span>
            </li>
        </ul>
    );
});