练习Practice

动手做Get your hands on it

练习跟着课文走 —— 每节课尾都有本课的练习。这一页是全部练习的总库，想集中刷题的时候来。每个练习都写清了它来自哪一节，卡住了就回去看那一节。Practice follows the lessons — every lesson ends with the exercises for that lesson. This page is the whole library, for when you want to drill in one sitting. Each exercise names the lesson it came from, so you can go back when you stall.

0 / 148个做对过you got right

同一批本事的四个难度档，区别是「给你多少东西」—— 它们分布在「背知识点 / 做练习 / 模拟考」三个模式里Four fidelity levels of the same skill — the difference is how much you are given. They live across the Review, Practice and Assess modes.

说得出Say it八股Drills105给你问题，你用嘴答You get the question, you answer out loud
认得出Spot it课内练习Lesson exercises148填空、写整块、Debug Lab —— 挖好了空等你填Fill-in-the-blank, write-a-block, debug labs
写得对Write itCodingCoding25文件、依赖、测试都给好了Files, deps and tests are handed to you
空手做Build it blind考场Arena7空文件夹、计时、没有提示按钮Empty folder, timed, no hint button

这四档到底怎么选How to pick a tier

往右一格，帮你的东西就少一样。只有最右边那格对准真实考试—— 前三格跑绿了不代表空手能做出来。两套模拟考就在考场的 7 道里。Each step right takes one crutch away. Only the rightmost one matches a real assessment. The two mock exams live inside the arena — 2 of its 7.

已筛到你正在学的《地基 · 项目与语言》。想看全部就点上面的「全部」。Filtered to Foundations · project and language — the course you are on. Use “All” above to see everything.

练习Exercises

筛出 2 个练习（共 148 个）。Showing 2 of 148.

来自From 数组与对象：不可变更新三件套Arrays and objects: three ways to update without changing the original · 地基 · 项目与语言Foundations · project and language

L2Debug LabDebug LabDebug Lab · 数据加进去了，界面没反应Debug Lab · the data went in, the screen did not move

这一类 bug 最难查，因为它不报错。先看现象，判断类型，再找病灶 —— 别跳步。

This kind of bug is the hardest to find, because it reports no error. Read the symptom, classify it, then locate it. Do not skip a step.

第 1 步 · 先看现象和代码，别急着改Step 1 · read the symptom and the code before you touch anything

# 没有任何报错。控制台干净。 # 现象：填好表单点 Add，表格里什么都不出现。 # 在 handleSubmitNote 里 console.log(notes) —— 长度确实在增加。 notes.length before: 0 notes.length after : 1 ← 数据真的进去了（但 <NoteTable /> 渲染出来的行数始终是 0）# No error at all. The console is clean. # Symptom: fill in the form, click Add, and nothing shows up in the table. # Add console.log(notes) inside handleSubmitNote — the length really does grow. notes.length before: 0 notes.length after : 1 ← the data really did go in (But <NoteTable /> always renders 0 rows.)

TSX有问题的写法The broken version示意Illustrative

1const handleSubmitNote = (submittedNote: Note) => {

2 notes.push(submittedNote);

3 setNotes(notes);

4};

第 2 步 · 这是什么类型的错误Step 2 · what kind of error is this

来自From ESM:import / export 与那些莫名其妙的报错ESM: import / export, and the errors that look strange at first · 地基 · 项目与语言Foundations · project and language

L2Debug LabDebug LabDebug Lab · ERR_MODULE_NOT_FOUNDDebug Lab · ERR_MODULE_NOT_FOUND

你在 node-subgraph/ 里跑 npm start, 服务器起不来。报错很长，但关键信息只有两行。

You run npm start inside node-subgraph/ and the server does not come up. The error is long, but only two lines of it matter.

第 1 步 · 先看现象和代码，别急着改Step 1 · read the symptom and the code before you touch anything

$ npm start node:internal/modules/esm/resolve:274 Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/Users/me/node-subgraph/src/dataSources/orderDataSource' imported from /Users/me/node-subgraph/src/index.js at finalizeResolution (node:internal/modules/esm/resolve:274:11) Did you mean to import "./dataSources/orderDataSource.js"?

JavaScriptsrc/index.js（第 2 行有问题）src/index.js (line 2 is the problem)示意Illustrative

1import { resolvers } from './resolvers/orderResolvers.js';

2import { OrderDataSource } from './dataSources/orderDataSource';

第 2 步 · 这是什么类型的错误Step 2 · what kind of error is this