Javascript:'；单击'；按钮不存在'；按下按钮时不工作？

我是Gordon Zhu（www.watchandcode.com）的《实用JS》。我不明白为什么这些按钮会出现在浏览器/UI/客户端，但出于某种原因，当我点击它时，按钮会产生动画，而不会产生任何效果。你知道，有点像一些公司和招聘委员会使用的那种古老的软件程序

我得到一份工作

VM3950:1未捕获引用错误：未定义todoList 时间：1:1

当通过displayTodos.addTodo（'first'）定义todoList时

var todoList={
待办事项：[]，
displayTodos:function（）{
if（this.todos.length==0）{
log（'您的待办事项列表为空！'）；
}否则{
log（'My todos:'）；
for（var i=0；i
待办事项列表
显示待办事项
切换所有
此
关键字在Javascript中的工作方式与其他语言不同，
此
取决于函数的调用方式（运行时绑定）。在处理程序中，您可以调用
todoList.displayTodos（）
，也可以更新以使用箭头函数，因为在箭头函数中，这保留了封闭词法上下文的
this
的值，请参见下面的代码：


var todoList={
待办事项：[]，
displayTodos:function（）{
if（this.todos.length==0）{
log（'您的待办事项列表为空！'）；
}否则{
log（'My todos:'）；
for（var i=0；i{
this.todoList.displayTodos（）；
});
toggleAllButton.addEventListener（'单击'，（）=>{
this.todoList.toggleAll（）；
});
待办事项列表
显示待办事项
全部切换
错误显示为：未捕获引用错误：未定义todoList
这就意味着当从这个上下文引用todoList对象时，它不会被定义，因为这个这里是你的html元素，而不是窗口对象，因此如果你想引用对象，你必须删除此关键字仅此而已（javascript此关键字的行为与许多其他语言不同）。
最后，如果您想在java脚本中阅读更多关于此行为的信息，您可以访问：
看起来您还没有掌握
此
在JavaScript中的工作原理如果其余代码正确，那么如果您编写
todoList.displayTodos（）
和
todoList.toggall（），它可能会工作
相反？你有几个打字错误，可能对你没有帮助。。。靠近底部：
var displayTodosButton=document.getElementById（'dislayTodosButton'）-拼写错误“displayTodosButton”。另外，我认为在定义
toggleAll
函数的地方还有一个额外的结束括号


       

        var todoList = {
  todos: [],
  displayTodos: function() {
    if (this.todos.length === 0) {
      console.log('Your todo list is empty!');
    } else {
      console.log('My todos:');
      for (var i = 0; i < this.todos.length; i++) {
        if (this.todos[i].completed === true) {
          console.log('(x)', this.todos[i].todoText);
        } else {
          console.log('( )', this.todos[i].todoText);
        }
      }
    }
  },
  addTodo: function(todoText) {
    this.todos.push({
      todoText: todoText,
      completed: false
    });
    this.displayTodos();
  },
  changeTodo: function(position, todoText) {
    this.todos[position].todoText = todoText;
    this.displayTodos();
  },
  deleteTodo: function(position) {
    this.todos.splice(position, 1)
    this.displayTodos();
  },
  toggleCompleted: function(position) {
    var todo = this.todos[position];
    todo.completed = !todo.completed;
    this.displayTodos();
  },
  toggleAll: function() {
    var totalTodos = this.todos.length;
    var completedTodos = 0;

    for (var i = 0; i < totalTodos; i++) {
      if (this.todos[i].completed === true) {
        completedTodos++;
      }
    }
  }

if (completedTodos === totalTodos) {
      for (var i = 0; i < totalTodos; i++) {
        this.todos[i].completed = false;
      }

    } else {
      for (var i = 0; i < totalTodos; i++); {
        this.todos[i].completed = true;
      }
    }

  this.displayTodos();
  }
};

var displayTodosButton = document.getElementById('displayTodosButton');

displayTodosButton.addEventListener('click', function() {
  todoList.displayTodos();
});