How can I use the” map” function in JavaScript to transform the array of tasks into an object?

 In the context of Salesforce, here is the approach given of how you can use the “map” function in javascript to convert an array of tasks into an object with the task IDs as keys and task details as values:-

// Sample array of tasks
Const tasksArray = [
  { id: 1, title: ‘Task 1’, description: ‘Description of Task 1’ },
  { id: 2, title: ‘Task 2’, description: ‘Description of Task 2’ },
  { id: 3, title: ‘Task 3’, description: ‘Description of Task 3’ }
];
// Initialize an empty object to store the converted tasks
Const tasksObject = {};
// Using the map function to convert array to object
tasksArray.map(task => {
  // Extracting task properties
  Const { id, title, description } = task;
  // Adding task to tasksObject
  tasksObject[id] = { title, description };
});

Console.log(tasksObject);
Here is the example given in python programming language:-
# Sample list of tasks (array in JavaScript)
Tasks_list = [
    {‘id’: 1, ‘title’: ‘Task 1’, ‘description’: ‘Description of Task 1’},
    {‘id’: 2, ‘title’: ‘Task 2’, ‘description’: ‘Description of Task 2’},
    {‘id’: 3, ‘title’: ‘Task 3’, ‘description’: ‘Description of Task 3’}
]
# Initialize an empty dictionary to store the converted tasks
Tasks_dict = {}
# Using a for loop to convert list to dictionary
For task in tasks_list:
    # Extracting task properties
    Task_id = task[‘id’]
    Title = task[‘title’]
    Description = task[‘description’]
    # Adding task to tasks_dict
    Tasks_dict[task_id] = {‘title’: title, ‘description’: description}
Print(tasks_dict)
Here is the example given in HTML:-
 
    Task Management System
    
        /* CSS styles for tasks */
        .task {
            Margin-bottom: 10px;
            Padding: 10px;
            Border: 1px solid #ccc;
            Border-radius: 5px;
        }
        .task-title {
            Font-size: 18px;
            Font-weight: bold;
        }
        .task-description {
            Font-size: 14px;
            Color: #666;
        }

    Task Management System
        
        // Sample array of tasks (similar to JavaScript)
        Const tasksArray = [
            { id: 1, title: ‘Task 1’, description: ‘Description of Task 1’ },
            { id: 2, title: ‘Task 2’, description: ‘Description of Task 2’ },
            { id: 3, title: ‘Task 3’, description: ‘Description of Task 3’ }
        ];
        // Function to render tasks in the HTML
        Function renderTasks(tasks) {
            Const taskListDiv = document.getElementById(‘taskList’);
            taskListDiv[removed] = ‘’; // Clear existing content
            tasks.forEach(task => {
                const taskDiv = document.createElement(‘div’);
                taskDiv.classList.add(‘task’);
                const titleElem = document.createElement(‘div’);
                titleElem.classList.add(‘task-title’);
                titleElem.textContent = task.title;
                const descElem = document.createElement(‘div’);
                descElem.classList.add(‘task-description’);
                descElem.textContent = task.description;
                taskDiv.appendChild(titleElem);
                taskDiv.appendChild(descElem);
                taskListDiv.appendChild(taskDiv);
            });
        }
        // Render tasks on page load
        Document.addEventListener(‘DOMContentLoaded’, () => {
            renderTasks(tasksArray);
        });