Waqas Arshi Waqas Arshi - 22 days ago 7
Javascript Question

A function is not working in javaScript

I am learning javaScript and developing a todoList app. I have put everything in an object called todoList,then at very first there's an array of objects that stores tasks in todoList. Every object has two properties i.e (todo=text, status=boolean). After that is a function called

showTasks
to display tasks in todoList. There is an if statement in
showTasks
function to check if the todoList is empty or not. After that is a for loop to display all the tasks in the array. Another if statement comes after the for loop to display the status of the tasks. The
addTask
function is for adding new tasks in the list that adds only the text for the task without the status (status is false by default). The
editTask
and
deleteTask
functions are pretty self explanatory. The last function called toggleStatus is to switch the status of a task and it is not working and i can't figure out why.

var todoList = {

// Storing tasks
tasks: [],

// Displaying tasks
showTasks: function() {
if (this.tasks.length === 0) {
console.log("There's no tasks in the list.");
} else {
console.log("My Tasks:");
for (var i = 0; i < this.tasks.length; i++) {
if (this.tasks.status === true) {
console.log("(X)", this.tasks[i].todo);
} else {
console.log("( )", this.tasks[i].todo);
}
}
}
},

// Adding a new task
addTask: function(task) {
this.tasks.push({
todo: task,
status: false
});
this.showTasks();
},

// Editing an existing task
editTask: function(count,task) {
this.tasks[count].todo = task;
this.showTasks();
},

// Deleting a task
deleteTask: function(count) {
this.tasks.splice(count,1);
this.showTasks();
},
// Changing status
toggleStatus: function(count) {
var task = this.tasks[count];
task.status = !task.status;
this.showTasks();
}

};

Answer

Your if statement in for loop have a typo :D

This is the good syntax:

if (this.tasks[i].status) {

By the way I would wrote it like that, prototyping is kind better because your object don't store as many functions as objects declared and then is faster to create ;) see JS - Why use Prototype?

function TodoList() {
    // Storing tasks
    this.tasks = [];
}


TodoList.prototype = {
    // Displaying tasks
    showTasks: function() {
        if (this.tasks.length === 0) {
            console.log("There's no tasks in the list.");
        } else {
            console.log("My Tasks:");
            for (var i = 0; i < this.tasks.length; i++) {
                if (this.tasks[i].status) {
                    console.log("(X)", this.tasks[i].todo);
                } else {
                    console.log("( )", this.tasks[i].todo);
                }
            }
        }
    },

    // Adding a new task
    addTask: function(task) {
        this.tasks.push({
            todo: task,
            status: false
        });
        this.showTasks();
    },

    // Editing an existing task
    editTask: function(count, task) {
        this.tasks[count].todo = task;
        this.showTasks();
    },

    // Deleting a task
    deleteTask: function(count) {
        this.tasks.splice(count, 1);
        this.showTasks();
    },
  
    // Changing status
    toggleStatus: function(count) {
      var taskStatus = !this.tasks[count].status;
      this.tasks[count].status = taskStatus;
      this.showTasks();
    }
};

var t = new TodoList();
t.addTask("yowwww");
t.addTask("miaou");
t.editTask(1, "miawwwwwou");
t.toggleStatus(0)