Files
learning-hour-maker/ideas/split-loop-with-lambda/storyboard/svg/01-extract-lambda.svg
T
Your Name 231f6aa72f Add storyboard handout for split-loop-with-lambda mechanics
Step-by-step refactoring instructions as a single markdown handout with
one diagram per step (legend + steps 0-3, overload inset, pure test,
debrief slides for the dead call and the drift anti-pattern). Derived
from the pattern draft, the learning hour plan, and the rehearsal
findings; slide-ready for later.
2026-09-27 18:04:33 +00:00

49 lines
3.4 KiB
XML

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 760 460" font-family="Helvetica, Arial, sans-serif">
<defs>
<marker id="arrR" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
<path d="M0,0 L10,5 L0,10 z" fill="#dc2626"/>
</marker>
</defs>
<rect width="760" height="460" fill="#ffffff"/>
<text x="24" y="34" font-size="20" font-weight="bold" fill="#0f172a">Step 1 — extract the dependency-using code into a lambda</text>
<text x="24" y="56" font-size="13" fill="#dc2626" font-weight="bold">Both scorer calls go inside the lambda — the void one too. The invocation stays in the loop.</text>
<!-- method -->
<rect x="60" y="74" width="340" height="356" rx="10" fill="#f8fafc" stroke="#64748b" stroke-width="1.5"/>
<text x="76" y="98" font-size="14" font-weight="bold" fill="#0f172a">longRangeForecast()</text>
<!-- reset loop -->
<rect x="80" y="112" width="300" height="56" rx="8" fill="#eef2ff" stroke="#818cf8"/>
<text x="94" y="134" font-size="11" font-family="Menlo, Consolas, monospace" fill="#1e1b4b">for (IceCream flavour : IceCream.values())</text>
<text x="94" y="154" font-size="11" font-family="Menlo, Consolas, monospace" fill="#1e1b4b"> result.put(flavour, 0);</text>
<!-- weather loop -->
<rect x="80" y="184" width="300" height="144" rx="8" fill="#eef2ff" stroke="#818cf8"/>
<text x="94" y="204" font-size="11" font-family="Menlo, Consolas, monospace" fill="#1e1b4b">for (Instant interestingDate : DATES)</text>
<!-- lambda (inside loop, where the code used to be) -->
<rect x="94" y="214" width="256" height="74" rx="8" fill="#faf5ff" stroke="#9333ea" stroke-width="1.5"/>
<text x="106" y="234" font-size="12" font-weight="bold" fill="#9333ea">λ dayOffsetToWeather</text>
<text x="106" y="254" font-size="11" font-family="Menlo, Consolas, monospace" fill="#dc2626">scorer.updateSelection();</text>
<text x="106" y="272" font-size="11" font-family="Menlo, Consolas, monospace" fill="#dc2626">return scorer.lookupWeather(days);</text>
<!-- invocation -->
<circle cx="90" cy="308" r="4" fill="#9333ea"/>
<text x="102" y="312" font-size="11" font-family="Menlo, Consolas, monospace" font-weight="bold" fill="#6b21a8">expectedWeather.add(λ.apply(daysForward));</text>
<!-- scoring loop -->
<rect x="80" y="344" width="300" height="80" rx="8" fill="#eef2ff" stroke="#818cf8"/>
<text x="94" y="368" font-size="11" font-family="Menlo, Consolas, monospace" fill="#1e1b4b">for (flavour : keySet) result += 10</text>
<text x="94" y="388" font-size="11" font-family="Menlo, Consolas, monospace" fill="#1e1b4b">+5 / +2 ifs, unchanged</text>
<text x="94" y="410" font-size="10" fill="#64748b">scoring loop</text>
<!-- Scorer -->
<rect x="580" y="200" width="150" height="80" rx="8" fill="#fef2f2" stroke="#dc2626" stroke-width="1.5"/>
<text x="655" y="230" font-size="14" font-weight="bold" fill="#dc2626" text-anchor="middle">Scorer</text>
<text x="655" y="250" font-size="11" fill="#7f1d1d" text-anchor="middle">still called —</text>
<text x="655" y="266" font-size="11" fill="#7f1d1d" text-anchor="middle">but only via the λ now</text>
<line x1="354" y1="244" x2="572" y2="228" stroke="#dc2626" stroke-width="1.5" stroke-dasharray="5 4" marker-end="url(#arrR)"/>
<line x1="354" y1="272" x2="572" y2="256" stroke="#dc2626" stroke-width="1.5" stroke-dasharray="5 4" marker-end="url(#arrR)"/>
</svg>