feat: add TypeScript lessons and learning panel

- Introduced a new script to check TypeScript lesson files for errors.
- Created a main TypeScript file to render lessons and their details.
- Added lesson definitions with starter and answer codes.
- Implemented a user interface for navigating and running lessons.
- Styled the application with CSS for a better user experience.
- Updated README to reflect the new TypeScript section and usage instructions.

04-dom-events-async/10-final-dashboard/answer.js

@@ -0,0 +1,84 @@
+const lessons = [
+  { title: "获取元素", done: false },
+  { title: "修改 DOM", done: true },
+];
+
+function fakeLoadExtraLessons() {
+  return new Promise(function (resolve) {
+    setTimeout(function () {
+      resolve([
+        { title: "事件委托", done: false },
+        { title: "异步渲染", done: false },
+      ]);
+    }, 900);
+  });
+}
+
+const statusText = document.getElementById("status-text");
+const loadButton = document.getElementById("load-btn");
+const lessonList = document.getElementById("lesson-list");
+const lessonForm = document.getElementById("lesson-form");
+const lessonInput = document.getElementById("lesson-input");
+
+function renderLessons() {
+  lessonList.innerHTML = "";
+
+  lessons.forEach(function (lesson, index) {
+    const item = document.createElement("li");
+    item.className = "lesson-item";
+
+    if (lesson.done) {
+      item.classList.add("done");
+    }
+
+    item.dataset.index = index;
+    item.textContent = lesson.title;
+    lessonList.appendChild(item);
+  });
+}
+
+lessonList.addEventListener("click", function (event) {
+  const currentItem = event.target.closest(".lesson-item");
+
+  if (!currentItem) {
+    return;
+  }
+
+  const index = Number(currentItem.dataset.index);
+  lessons[index].done = !lessons[index].done;
+  renderLessons();
+});
+
+lessonForm.addEventListener("submit", function (event) {
+  event.preventDefault();
+
+  const value = lessonInput.value.trim();
+
+  if (!value) {
+    return;
+  }
+
+  lessons.push({
+    title: value,
+    done: false,
+  });
+
+  lessonInput.value = "";
+  statusText.textContent = "已新增一门课程";
+  renderLessons();
+});
+
+loadButton.addEventListener("click", async function () {
+  statusText.textContent = "正在异步加载课程...";
+
+  const newLessons = await fakeLoadExtraLessons();
+  newLessons.forEach(function (lesson) {
+    lessons.push(lesson);
+  });
+
+  statusText.textContent = "额外课程加载完成";
+  renderLessons();
+});
+
+statusText.textContent = "页面初始化完成";
+renderLessons();