Fix Function Composition implementation issues

Author: myoshi2891

JavaScript/2629. Function Composition/Claude Code Sonnet 4.6 extended/FunctionComposition_TS.ipynb

@@ -41,9 +41,16 @@
                 "\n",
                 "---\n",
                 "\n",
-                "## 4. 実装コード\n",
-                "\n",
-                "```typescript\n",
+                "## 4. 実装コード"
+            ]
+        },
+        {
+            "cell_type": "code",
+            "execution_count": null,
+            "id": "implementation",
+            "metadata": {},
+            "outputs": [],
+            "source": [
                 "// Analyze Complexity\n",
                 "// Runtime 56 ms\n",
                 "// Beats 55.84%\n",
@@ -66,24 +73,25 @@
                 "    };\n",
                 "}\n",
                 "\n",
-                "/**\n",
-                " * const fn = compose([x => x + 1, x => 2 * x])\n",
-                " * fn(4) // 9\n",
-                " */\n",
-                "```\n",
+                "// 動作確認\n",
+                "const fn1 = compose([x => x + 1, x => x * x, x => 2 * x]);\n",
+                "console.log(\"Example 1 (x=4): 2*4=8 -> 8*8=64 -> 64+1=65 :\", fn1(4));\n",
                 "\n",
-                "**動作確認（コメントで検証）:**\n",
-                "```typescript\n",
-                "// Example 1: [x+1, x*x, 2*x], x=4\n",
-                "// 2*4=8 → 8*8=64 → 64+1=65 ✓\n",
+                "const fn2 = compose([x => 10 * x, x => 10 * x, x => 10 * x]);\n",
+                "console.log(\"Example 2 (x=1): 10 -> 100 -> 1000 :\", fn2(1));\n",
                 "\n",
-                "// Example 2: [10x, 10x, 10x], x=1\n",
-                "// 10 → 100 → 1000 ✓\n",
-                "\n",
-                "// Example 3: [], x=42\n",
-                "// reduceRight の初期値 42 がそのまま返る → 42 ✓\n",
-                "```\n",
+                "const fn3 = compose([]);\n",
+                "console.log(\"Example 3 (x=42): 42 :\", fn3(42));\n",
                 "\n",
+                "// Interactive checks\n",
+                "compose([x => x + 1, x => 2 * x])(4)"
+            ]
+        },
+        {
+            "cell_type": "markdown",
+            "id": "points",
+            "metadata": {},
+            "source": [
                 "**ポイント:**\n",
                 "- `functions` を `readonly F[]` とすることで入力配列の不変性を型レベルで保証。\n",
                 "- `reduceRight` の初期値 `x` が空配列時の恒等関数の役割を自然に担うため、空配列の特別処理が不要。\n",
@@ -101,7 +109,7 @@
             "file_extension": ".ts",
             "mimetype": "text/typescript",
             "name": "typescript",
-            "version": "5.3.3"
+            "version": "5.9.3"
         }
     },
     "nbformat": 4,

JavaScript/2629. Function Composition/Claude Code Sonnet 4.6 extended/README.md

@@ -8,7 +8,7 @@
 - [正しさのスケッチ](#correctness)
 - [計算量](#complexity)
 - [TypeScript 実装](#impl)
-- [TypeScript / V8 最適化ポイント](#cpython)
+- [TypeScript / V8 最適化ポイント](#typescript-v8)
 - [エッジケースと検証観点](#edgecases)
 - [FAQ](#faq)
 
@@ -49,11 +49,9 @@ compose([f, g, h])(x) = f(g(h(x)))
 
 ```mermaid
 flowchart TD
-  Start[compose called with functions array] --> Empty{functions.length is 0?}
-  Empty -- Yes --> Identity[Return identity x equals x]
-  Empty -- No --> RetFn[Return closure fn x]
+  Start[compose called] --> RetFn[Return closure fn x]
   RetFn --> Call[fn x is called]
-  Call --> RR[reduceRight over functions]
+  Call --> RR[Start reduceRight with initial value x]
   RR --> Step{More functions?}
   Step -- Yes --> Apply[Apply current fn to acc]
   Apply --> Step
@@ -157,7 +155,7 @@ function compose(functions: readonly F[]): F {
 
 ---
 
-<h2 id="cpython">TypeScript / V8 最適化ポイント</h2>
+<h2 id="typescript-v8">TypeScript / V8 最適化ポイント</h2>
 
 | 観点                        | 内容                                                                                      |
 | --------------------------- | ----------------------------------------------------------------------------------------- |

JavaScript/2629. Function Composition/Claude Code Sonnet 4.6 extended/README_react.html

@@ -4,8 +4,8 @@
         <meta charset="UTF-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>LeetCode 2629 - Function Composition</title>
-        <script src="https://unpkg.com/react@18/umd/react.development.js"></script>
-        <script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
+        <script src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
+        <script src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
         <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
         <script src="https://cdn.tailwindcss.com"></script>
         <link
@@ -167,6 +167,17 @@ <h3 class="text-lg font-bold text-[#e53170] mb-3">入出力例</h3>
                                 </div>
                                 <div class="text-[#e53170] font-bold mono mt-1">Output: 65</div>
                             </div>
+                            <div class="bg-[#0f0e17] rounded-2xl p-4 border border-white/5">
+                                <div class="text-xs text-[#a7a9be] mb-2 mono">Example 2</div>
+                                <div class="mono text-sm text-[#e7c7d4]">
+                                    functions = [x=&gt;10*x, x=&gt;10*x, x=&gt;10*x]
+                                </div>
+                                <div class="mono text-sm text-[#a7a9be]">x = 1</div>
+                                <div class="mono text-sm text-[#fffffe] mt-2">
+                                    // 10*1=10 → 10*10=100 → 10*100=1000
+                                </div>
+                                <div class="text-[#e53170] font-bold mono mt-1">Output: 1000</div>
+                            </div>
                             <div class="bg-[#0f0e17] rounded-2xl p-4 border border-white/5">
                                 <div class="text-xs text-[#a7a9be] mb-2 mono">Example 3</div>
                                 <div class="mono text-sm text-[#e7c7d4]">functions = []</div>
@@ -885,6 +896,8 @@ <h3 class="text-lg font-bold text-[#e53170] mb-3">入出力例</h3>
                     <svg
                         viewBox="0 0 580 220"
                         style={{ maxWidth: '100%', height: 'auto', marginTop: '24px' }}
+                        role="img"
+                        aria-label={`Step visualization: ${label || 'Initial state'}. Accumulator is ${acc}.`}
                     >
                         <defs>
                             <marker
@@ -1125,7 +1138,7 @@ <h3 class="text-lg font-bold text-[#e53170] mb-3">入出力例</h3>
                                     fontFamily="DM Mono"
                                     fontWeight="900"
                                 >
-                                    4
+                                    {acc}
                                 </text>
                             </g>
                         )}
@@ -1138,6 +1151,12 @@ <h3 class="text-lg font-bold text-[#e53170] mb-3">入出力例</h3>
                 const [isPlaying, setIsPlaying] = useState(false);
                 const timerRef = useRef(null);
 
+                useEffect(() => {
+                    if (window.Prism) {
+                        window.Prism.highlightAll();
+                    }
+                }); // Run on every render to ensure code blocks are highlighted
+
                 useEffect(() => {
                     if (isPlaying) {
                         if (activeStep > stepsData.length) {
@@ -1278,10 +1297,6 @@ <h3 className="text-lg font-bold text-[#fffffe] mt-0 mb-2">
 
             const root = ReactDOM.createRoot(document.getElementById('react-root'));
             root.render(<StepViz />);
-
-            setTimeout(() => {
-                Prism.highlightAll();
-            }, 300);
         </script>
     </body>
 </html>