附录 C 练习题

附录 C 练习题

共十四题，按基础、进阶、思考三档排列，覆盖第 06 到 11 章并回扣第 02、03 章。每题给出考察目标与提示，不给答案；基础题与进阶题建议在本书各节的示例代码上续写，思考题写成短文与他人讨论更有价值。

第一档 基础（动手即得）

第 1 题（公式解析）

给第 6.1 节的 formula_parser.js 补一个测试用例集，至少覆盖 =2^3^2、=-(1+2)*3、=SUM(A1:A3,5) 三种形态；再写一个函数把任意 AST 打印成缩进树，肉眼可读。

• 考察：递归下降解析的优先级与结合性是否真正理解。
• 提示：幂运算的右结合已在 parsePower 里处理，验证它而不是相信它。

第 2 题（循环引用定位）

第 6.1 节的引擎把整条污染链都标成错误值。改造它：在污染子图中区分「真正的环成员」与「环外但被波及的格子」，前者标循环错误，后者标依赖了循环引用。

• 考察：Kahn 残料的语义、深度优先搜索找环。
• 提示：环成员的定义是「从它出发能回到它自己」。

第 3 题（不等高滚动）

给第 6.2 节的 RowLocator 增加 scrollToIndex(index, align) 方法：把指定行滚到视口顶部、底部或居中三种对齐，返回应设置的 scrollTop。

• 考察：前缀和与绝对坐标法的综合运用。
• 提示：顶部对齐用 offsetOf 直接算，居中要减去半个视口高再夹紧到合法范围。

第 4 题（混合模式实验）

用第 7.2 节的 compositor 制作一张对照图：同一组三层文档分别以 source-over、multiply、screen、overlay 合成，导出四张 PNG 肉眼比对，再各取同一坐标像素读值验证公式。

• 考察：globalCompositeOperation 的语义与验证方法论。
• 提示：multiply 明显压暗、screen 明显提亮；读值用 getImageData 对比红通道即可。

第 5 题（剪贴板降级链）

在第 7.1 节的画图骨架上实现「复制选区图像到剪贴板」：优先 ClipboardItem 写 PNG，失败退 execCommand 方案，两端都失败给出明确提示。至少在两个浏览器实测。

• 考察：剪贴板安全模型、手势约束与降级设计。
• 提示：异步 API 必须在用户手势的同步段发起；execCommand 需要一个隐藏的可编辑元素。

第二档 进阶（组合两章以上）

第 6 题（选区统计分帧）

第 6.3 节的选区统计（求和、平均、计数）在大选区下会卡。把它接入第 10.1 节的任务队列：分片计算、进度回传、选区变化时取消旧任务；状态栏显示「已统计 N 格，当前合计 X」。

• 考察：任务队列四能力（优先级、取消、进度、并发）的实战使用。
• 提示：任务键用选区矩形的哈希；取消时机在 pointermove 更新矩形时。

第 7 题（tile 滤镜 × 任务队列）

把第 7.3 节的 tile_pipeline 从直连 Worker 改造为经 task_queue 提交：tile 按与视口的距离定优先级，用户滚动时 cancel 视口外的待执行 tile。用第 10.3 节的 PerfMonitor 记录改造前后的帧时间。

• 考察：视口优先级语义与「先量后改」的纪律。
• 提示：同一操作序列的 P95 帧时间是前后对比的唯一凭证。

第 8 题（图层文档存档）

给第 7.2 节的 LayerDocument 实现存档与恢复：保存到第 8.2 节的 VFS（Blob 直存），采用第 11.2 节的信封格式加版本号与图层元数据；再写一个 v1 到 v2 的迁移函数（例如把 blend 从数字枚举改为字符串）并测试旧档打开。

• 考察：信封格式四纪律与迁移管道的落地。
• 提示：大件存 Blob 引用不进 JSON；迁移测试必须覆盖「旧文件缺新字段」。

第 9 题（桌面环境集成）

把第 09 章的 mini-WebIDE 注册为第 08 章桌面环境的一个应用：启动时从 VFS 的 /Projects 打开上次会话文件，挂起时序列化打开的文件路径与光标位置，完整实现 serialize 与 deserialize。

• 考察：应用生命周期、服务注入与状态序列化的配合。
• 提示：Monaco 的光标位置可通过 editor.getSelection 与 editor.setSelection 存取。

第 10 题（存储分层改造）

把第 8.2 节 VFS 的持久层从 IndexedDB 换成 OPFS（在 Worker 里用同步访问句柄），对外接口保持不变。用几十 MB 级图像文件对比两种后端的保存耗时与内存水位，写出一段选型结论。

• 考察：11.1 节三轴选型法的实证能力。
• 提示：树模型不动只换引擎；OPFS 句柄的生命周期要跟随队列任务。

第三档 思考（写成短文）

第 11 题（虚拟化边界）

什么规模以下的列表不值得虚拟化？从行数、单元格复杂度、目标机型三个维度给出你的判断线，并论证：虚拟化引入的复杂度（不等高、锚定、无障碍）在什么条件下超过它省下的成本。

• 考察：对第 02 章范式成本模型与第 6.3 节选型判断的融会。
• 提示：复杂度的账要算「隐性」那部分——锚定跳转、滚动条手感、屏幕阅读器支持。

第 12 题（WASM 立项答辩）

假设你的表格应用全表重算在十万行场景下 P95 耗时两秒。写一页纸立项答辩：先用第 10.2 节四闸门检查，再给「脏区闭包优化」「分帧加进度」「WASM 求值器」三个方案排序，附量化依据。

• 考察：性能决策的证据链与表达。
• 提示：两秒先拆构成——解析、建图、求值、写回各占多少？没拆之前任何排序都是猜。

第 13 题（复刻的边界审计）

选一个你常用的桌面软件，列出它的二十项交互特性，逐项标注「思想层（可复刻）」或「表达层（不可碰）」；对灰色项（标志性动效、布局比例这类介于两者之间者）写出你的处理原则。

• 考察：第 11.3 节法律边界框架的应用与细化。
• 提示：灰色项判据可以是「去掉商标后，普通用户是否仍会误认为原产品」。

第 14 题（路线复盘）

本书六章做了六类应用。回答：哪一类最适合纯前端复刻路线长期演进？哪一类最先撞到纯前端的天花板（从执行环境、文件系统、性能三方面想）？若只允许把其中一类做成产品，你选哪个，商业分层画在哪条线上？

• 考察：全书视角的工程判断。
• 提示：把第 9.3 节的路线对照表当评分卡，逐格填分再下结论。

练习环境与自评

• 环境：任一现代浏览器加本地静态服务器即可；涉及 Worker 与 OPFS 的题目务必通过 http 或 https 访问页面，file 协议下行为不完整。
• 自评清单：基础题全部通过；进阶题至少完成三题且各有一次度量记录；思考题至少写两篇短文并收到一条他人反馈。达标者，本书的工程方法已经属于你。