为何deleteTask()拼写错误会引发addTask()的Uncaught ReferenceError？

这是因为JavaScript是先做语法解析再执行的解释型语言——一旦脚本里出现语法错误，整个脚本的执行会直接中断，哪怕错误代码在后面，前面的函数也不会被正确注册到全局作用域。

具体到你的情况：

• 你在deleteTask函数里把const写成了cosnt，这是个语法错误，浏览器解析到这里时直接抛出错误，停止继续执行脚本。
• 虽然addTask函数定义在错误代码前面，但由于脚本执行被中断，addTask并没有被成功挂载到全局环境里。当你点击按钮调用addTask()时，自然就会提示“addTask is not defined”。
• 修正cosnt为const后，语法错误消失，脚本完整执行，所有函数都被正确注册，点击按钮就能正常调用addTask了。

你的错误代码（标记错误行） #

const taskList = [];
const taskListInPage = document.getElementById("todo-list");
renderTasks();

function renderTasks() {
  taskListInPage.innerHTML = "";
  taskList.forEach(function(taskInList) {
    const taskItem = document.createElement("div");
    taskItem.innerText = taskInList.title + " " + taskInList.dueDate;

    const deleteButton = document.createElement("button");
    deleteButton.innerHTML = "&#128465";
    deleteButton.style = "margin-left:12px";
    deleteButton.id = taskInList.id;
    deleteButton.onclick = deleteTask;
    taskItem.appendChild(deleteButton);

    taskListInPage.appendChild(taskItem);
  });
}

function addTask() {
  const textboxInPage = document.getElementById("textbox");
  const title = textboxInPage.value;

  const datePicker = document.getElementById("datepicker");
  const dueDate = datePicker.value;

  const taskId = new Date().getTime();

  taskList.push({
    title: title,
    dueDate: dueDate,
    id: taskId
  });
  renderTasks();
}

function clearList() {
  taskList.splice(0, taskList.length);
  renderTasks();
}

function deleteTask(event) {
  const deleteButtonIP = event.target;
  // 这里的cosnt是语法错误！
  cosnt idToDelete = deleteButtonIP.id;
}

错误提示 #

Uncaught ReferenceError: addTask is not defined

内容的提问来源于stack exchange，提问作者Oreneus