Feat: Document unified iteration and control flow

index.html

@@ -10,7 +10,7 @@
 
     <!-- Google Fonts -->
     <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link rel="preconnect" href="https://fonts.gstatic" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
     
     <!-- Markdown & Highlighting Styles -->
@@ -200,12 +200,21 @@ _(grade) // Prints "C"
 ## Data Structures
 
 ### Arrays
-Arrays are 0-indexed lists of values.
+Arrays are 0-indexed lists of values. They support random access via \`[]\` and are iterable.
 
 \`\`\`javascript
 primes: [2, 3, 5, 7]
-primes[0] = 1        // Mutation
-_(primes)              // [1, 3, 5, 7]
+_(primes[0]) // Random access: 2
+primes[0] = 1        
+_(primes)     // Mutation: [1, 3, 5, 7]
+\`\`\`
+
+### Strings
+Strings are sequences of characters. They are immutable but support random access and iteration.
+
+\`\`\`javascript
+greeting: "Hi"
+_(greeting[1]) // "i"
 \`\`\`
 
 ## Destructuring
@@ -236,29 +245,52 @@ _(y) // -5
 
 ## Repetition
 
-Loops are initiated with the \`*\` operator following a standard three-part condition or a simple boolean expression.
+Repetition is handled by a unified iteration protocol: \`(source -> pattern) * { ... }\`. This single, concise syntax adapts to iterate over any collection type.
 
-- \`>>\` is used for **continue**.
-- \`^\` is used for **return/break**.
+### Iterating Collections
+The \`->\` operator extracts elements from a source into a pattern.
 
 \`\`\`javascript
-// for-style loop
-(i: 0; i < 3; i = i + 1) * {
-  _("Iteration: " + i)
-}
+// Iterate over an Array's values
+(["a", "b"] -> item) * { _(item) }
 
-// while-style loop
-active: !0
-(active) * {
-  _("Looping..."); active = 0
-}
+// Iterate over an Array with index and value
+(["a", "b"] -> [i, item]) * { _(i + ": " + item) }
 
-// Loop Control
-(i: 0; i < 10; i = i + 1) * {
-  (i == 5) ? { ^ } // Break at 5
+// Iterate over a Block's key-value pairs
+({ id: 1 } -> [k, v]) * { _(k + " is " + v) }
+
+// Iterate over a String's characters
+("Hi" -> char) * { _(char) }
+
+// Destructure directly in the loop signature
+users: [{ name: "Orion" }]
+(users -> { name }) * { _("User: " + name) }
+\`\`\`
+
+### Numeric Ranges
+The \`..\` operator creates an iterable numeric range for concise, traditional loops.
+
+\`\`\`javascript
+// A range from 0 up to (but not including) 3
+(0..3 -> i) * {
+  _("Iteration: " + i) // Prints 0, 1, 2
+}
+\`\`\`
+
+### Loop Control
+Control flow within loops is managed by distinct symbols:
+- \`.\`: **Break**. Immediately terminates the loop.
+- \`>>\`: **Continue**. Skips to the next iteration.
+- \`^\`: **Return**. Exits the parent block, not just the loop.
+
+\`\`\`javascript
+(0..10 -> i) * {
+  (i == 2) ? { >> } // Skip 2
+  (i == 5) ? { . }  // Break at 5
   _("i is " + i)
 }
-// Prints i is 0 through 4
+// Prints: i is 0, i is 1, i is 3, i is 4
 \`\`\`
 
 ## Imports