Pu sh объект в сложный массив

Question

Я пытаюсь превратить sh объект в сложный массив. Я думаю о чем-то вроде этого: "DUMMY_PLACES [0] .todos.byIds.pu sh", но мне это не удается. . У меня есть (id, content), и заполненное должно быть по умолчанию 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

Может вам понадобится что-то вроде этого

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 2

Здесь взгляните на функцию 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"
  }
]

Answer 3

В вашем коде отсутствует инкапсуляция. Лучшим подходом здесь было бы создать новый класс и создать для этого сеттер.

EDIT с примером:

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 ) );