Question

我收到一个看起来像这样的对象：

k8-dashboard-ops-jenkins-lab

我想按kubernetes-dashboard过滤并删除this.tokensData = { O: { id: 0, name: value1, organization: organization1, ..., }, 1: { id: 1, name: value1, organization: organization1, ..., }, 2: { id: 2, name: value2, organization: organization2, ..., }, ... }与我从id收到的Object匹配的id。到目前为止我尝试过的：

id

这将store替换为const filteredObject = Object.keys(this.tokensData).map((token) => { if (this.$store.state.id !== this.tokensData[token].id) { return this.tokensData[token]; } });-可以满足我的目的，但显然并不理想。任何帮助深表感谢！

Answer 1

尝试使用Lua，然后使用GNU awk从键值对列表中创建对象：

let store = [0 , 1];

const result = Object.entries(tokensData).filter(([k, v]) => !store.some(s => s == v.id));

console.log(Object.fromEntries(result));

一个例子：

let tokensData = {
   O: {
       id: 0,
       name: '',
       organization: '',
      },
   1: {
       id: 1,
       name: '',
       organization: '',
       },
   2: {
       id: 2,
       name: '',
       organization: '',
       }
  }

let store = [0 , 1];

const result = Object.entries(tokensData).filter(([k, v]) => !store.some(s => s == v.id));

console.log(Object.fromEntries(result));

Answer 2

这可以通过克隆对象并删除ID中的对象来完成：

const removeObjectByID = (obj, id) => {
  // first create a copy of the object
  const copy = JSON.parse(JSON.stringify(obj))
  // next, delete the one entry you don't want
  delete copy[id]
  // finally, return the new object
  return copy
}

// Test
const data = {a:1, b: 2, c: 3}

console.log(removeObjectByID(data, 'b')) // { a: 1, c: 3 }

Answer 3

您可以使用Object.entries和Object.fromEntries来做到这一点：

import React, { useState, useEffect } from 'react';
import connect from '@vkontakte/vk-connect';
import View from '@vkontakte/vkui/dist/components/View/View';
import ConfigProvider from '@vkontakte/vkui/dist/components/ConfigProvider/ConfigProvider';
import '@vkontakte/vkui/dist/vkui.css';
import { Panel, PanelHeader, Tabbar, TabbarItem, Epic } from '@vkontakte/vkui';
import Icon28AddOutline from '@vkontakte/icons/dist/28/add_outline';
import Icon28NewsfeedOutline from '@vkontakte/icons/dist/28/newsfeed_outline';
import Icon28SettingsOutline from '@vkontakte/icons/dist/28/settings_outline';

class App extends React.Component {
    constructor (props) {
      super(props);

      this.state = {
        scheme: 'space_gray',
        activeStory: 'feed'
      };
      this.scheme = this.scheme.bind(this);
      this.onStoryChange = this.onStoryChange.bind(this);
   }

    onStoryChange (e) {
      this.setState({ activeStory: e.currentTarget.dataset.story })
    }

    render () {
      return (
        <Epic activeStory={this.state.activeStory} scheme={this.state.scheme} tabbar={
          <Tabbar>
            <TabbarItem
              onClick={this.onStoryChange}
              selected={this.state.activeStory === 'feed'}
              data-story="feed"
              text="Главная"
            ><Icon28NewsfeedOutline /></TabbarItem>
            <TabbarItem
              onClick={this.onStoryChange}
              selected={this.state.activeStory === 'add_skin'}
              data-story="add_skin"
              text="Добавить скин"
            ><Icon28AddOutline /></TabbarItem>
            <TabbarItem
              onClick={this.onStoryChange}
              selected={this.state.activeStory === 'settings'}
              data-story="settings"
              label="12"
              text="Настройки"
            ><Icon28SettingsOutline /></TabbarItem>
          </Tabbar>
        }>
          <View id="feed" activePanel="feed">
            <Panel id="feed">
              <PanelHeader>Главная</PanelHeader>
            </Panel>
          </View>
          <View id="add_skin" activePanel="add_skin">
            <Panel id="add_skin">
              <PanelHeader>Добавить скин</PanelHeader>
            </Panel>
          </View>
          <View id="settings" activePanel="settings">
            <Panel id="settings">
              <PanelHeader>Настройки</PanelHeader>
            </Panel>
          </View>
        </Epic>
      )
    }
}
  export default App;

Answer 4

undefined的问题是由于在箭头函数中使用this引起的。如果函数是箭头函数，则Javascript范围定义为this赋予了不同的含义。

此外，我建议使用过滤器。

.map用于转换A-> B。

.filter用于过滤对象。

现在，如果我们结合起来，它将变成这样。

function filterById(token) {
  return this.$store.state.id !== this.tokensData[token].id;
}

function getTokenData(token) {
  return this.tokensData[token]
}

const token = Object.keys(this.tokensData)
  .filter(filterById)
  .map(getTokenData);
});

请注意，我没有使用箭头功能。由于JavaScript处理作用域的方式，箭头功能无法引用this。

另一种方法是将this引用到变量中，以便您的箭头函数可以访问该变量。

const self = this;
const token = Object.keys(this.tokensData)
  .filter(token => self.$store.state.id !== self.tokensData[token].id)
  .map(token => self.tokensData[token]);

也可以使用Object.entries使其变得更好。这将返回键和值的数组，您可以按照[key, value]使用es6语法对其进行解构。

const self = this;
const token = Object.entries(this.tokensData)
  .filter(([key, value]) => self.$store.state.id !== value.id)
  .map(([key, value]) => value);

过滤嵌套对象

4 个答案: