将一个对象推入一个复杂的数组

Question

我正在尝试将一个对象推入一个复杂的数组中我正在考虑类似的事情DUMMY_PLACES[0]。todos.byIds.push”但我没有成功.我有一个（id，内容），并且完成需要默认为 false。希望得到帮助我相信这并不太复杂，但我无法弄清楚。 ps: 如果有人也可以帮助删除选项，我会很高兴。

例如，我得到 (5,test5)。我要。

     const DUMMY_PLACES = [
          {
            todos: {
              allIds: [1, 2, 3, 4,],
              byIds: {
                "1": {
                  content: "test1",
                  completed: false,
                },
                "2": {
                  content: "test2",
                  completed: false,
                },
                "3": {
                  content: "test3\",
                  completed: false,
                },
                "4": {
                  content: "test4",
                  completed: false,
                },
              },
            },
            visibilityFilter: "all",
          },
        ];

 const DUMMY_PLACES = [
      {
        todos: {
          allIds: [1, 2, 3, 4,5],
          byIds: {
            "1": {
              content: "test1",
              completed: false,
            },
            "2": {
              content: "test2",
              completed: false,
            },
            "3": {
              content: "test3\",
              completed: false,
            },
            "4": {
              content: "test4",
              completed: false,
            },
            "5": {
              content: "test5",
              completed: false,
            },
          },
        },
        visibilityFilter: "all",
      },
    ];

Answer 1

您的代码缺乏封装。这里最好的方法是创建一个新的 class 并为此创建一个 setter。

编辑示例：

class UserTodo
{
    constructor( visibilityFilter = 'all' )
    {
        this._visibilityFilter  = visibilityFilter;
        this._byIds             = new Map();
    }
    /**
     * @details Add a todo with the content text
     */
    addTodo( title, content )
    {
        const value = {
            content,
            completed: false
        }
        this._byIds.set( title, value );
    }

    /**
     * @Details Decide if you want to get the entire object or just the content here
     */
    getTodo( title )
    {
        return this._byIds.get( title );
    }

    completeTodo( title )
    {
        this._byIds.get( title ).completed  = true;
    }

    /**
     * @details As a bonus on how to delete a specific todo
     */
    deleteTodo( title )
    {
        this._byIds.delete( title );
    }

    /**
     * @details this will return allIds from the example
     */
    getAllIds()
    {
        return Array.from( this._byIds.keys() );
    }

    /**
     * @details this will return visibilityFilter from the example
     */
    getVisibility()
    {
        return this._visibilityFilter;
    }

    // Implement other getters
}

// Why is this an array even?
const DUMMY_PLACES  = [];
DUMMY_PLACES.push( new UserTodo( 'all' ) );

const toDoTitle = 'Some Title';

// Add a new todo
DUMMY_PLACES[0].addTodo( toDoTitle, 'Do Something' );

// Check that the todo is added
console.log( DUMMY_PLACES[0].getTodo( toDoTitle ) );

// Complete it
DUMMY_PLACES[0].completeTodo( toDoTitle );

// Check that it is completed
console.log( DUMMY_PLACES[0].getTodo( toDoTitle ) );

Answer 2

也许你需要这样的东西

const DUMMY_PLACES = [ { todos: { allIds: [1, 2, 3, 4], byIds: { "1": { content: "test1", completed: false, }, "2": { content: "test2", completed: false, }, "3": { content: "test3\", completed: false, }, "4": { content: "test4", completed: false, }, }, }, visibilityFilter: "all", }, ];

function pushObject(id, content) {
  DUMMY_PLACES[0].todos.allIds.push(id);
  DUMMY_PLACES[0].todos.byIds[id] = { ...content, completed: false };
}
pushObject(5, { content: "test5" });
console.dir(DUMMY_PLACES);

Answer 3

这里看看 addTodo 函数，它创建了 todoList 的一个新实例，并在其末尾添加了一个新元素。而且它还修改了 Ids 的列表。几乎每一行我都注释了，所以它应该很简单。

let todoList = [
  {
    todos: {
      allIds: [1, 2, 3, 4],
      byIds: {
        "1": {
          content: "test1",
          completed: false,
        },
        "2": {
          content: "test2",
          completed: false,
        },
        "3": {
          content: "test3",
          completed: false,
        },
        "4": {
          content: "test4",
          completed: false,
        },
      },
    },
    visibilityFilter: "all",
  },
];

let addTodo = (sourceArray, el) => {
  // Create a copy of an original array
  let targetArray = [];
  Object.assign(targetArray, sourceArray);

  let todos = targetArray[0].todos;

  // Calculate the Id for a new element
  let newId = Object.keys(todos.byIds).length + 1;

  // Add new Id to the `allIds` list
  todos.allIds.push(newId);

  // Create a new element
  todos.byIds[newId] = {
    content: el,
    completed: false
  }

  return targetArray;
}

todoList = addTodo(todoList, 'test5');
todoList = addTodo(todoList, 'test6');
todoList = addTodo(todoList, 'test7');

console.log(JSON.stringify(todoList));

输出应该是：

[
  {
    "todos":{
      "allIds":[
        1,
        2,
        3,
        4,
        5,
        6,
        7
      ],
      "byIds":{
        "1":{
          "content":"test1",
          "completed":false
        },
        "2":{
          "content":"test2",
          "completed":false
        },
        "3":{
          "content":"test3",
          "completed":false
        },
        "4":{
          "content":"test4",
          "completed":false
        },
        "5":{
          "content":"test5",
          "completed":false
        },
        "6":{
          "content":"test6",
          "completed":false
        },
        "7":{
          "content":"test7",
          "completed":false
        }
      }
    },
    "visibilityFilter":"all"
  }
]

将一个对象推入一个复杂的数组

Push an Object Into a complicated arra

javascript

arrays

push