diff options
Diffstat (limited to 'js/scripting-lang/docs/baba-yaga/0.0.1/tutorial-02_Function_Composition.html')
-rw-r--r-- | js/scripting-lang/docs/baba-yaga/0.0.1/tutorial-02_Function_Composition.html | 167 |
1 files changed, 167 insertions, 0 deletions
diff --git a/js/scripting-lang/docs/baba-yaga/0.0.1/tutorial-02_Function_Composition.html b/js/scripting-lang/docs/baba-yaga/0.0.1/tutorial-02_Function_Composition.html new file mode 100644 index 0000000..314ce86 --- /dev/null +++ b/js/scripting-lang/docs/baba-yaga/0.0.1/tutorial-02_Function_Composition.html @@ -0,0 +1,167 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width,initial-scale=1"> + <title>02_Function_Composition - Documentation</title> + + <script src="scripts/prettify/prettify.js"></script> + <script src="scripts/prettify/lang-css.js"></script> + <!--[if lt IE 9]> + <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> + <![endif]--> + <link type="text/css" rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"> + <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css"> + <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css"> +</head> +<body> + +<input type="checkbox" id="nav-trigger" class="nav-trigger" /> +<label for="nav-trigger" class="navicon-button x"> + <div class="navicon"></div> +</label> + +<label for="nav-trigger" class="overlay"></label> + +<nav> + <li class="nav-link nav-home-link"><a href="index.html">Home</a></li><li class="nav-heading">Tutorials</li><li class="nav-item"><a href="tutorial-00_Introduction.html">00_Introduction</a></li><li class="nav-item"><a href="tutorial-01_Function_Calls.html">01_Function_Calls</a></li><li class="nav-item"><a href="tutorial-02_Function_Composition.html">02_Function_Composition</a></li><li class="nav-item"><a href="tutorial-03_Table_Operations.html">03_Table_Operations</a></li><li class="nav-item"><a href="tutorial-04_Currying.html">04_Currying</a></li><li class="nav-item"><a href="tutorial-05_Pattern_Matching.html">05_Pattern_Matching</a></li><li class="nav-item"><a href="tutorial-06_Immutable_Tables.html">06_Immutable_Tables</a></li><li class="nav-item"><a href="tutorial-07_Function_References.html">07_Function_References</a></li><li class="nav-item"><a href="tutorial-08_Combinators.html">08_Combinators</a></li><li class="nav-item"><a href="tutorial-09_Expression_Based.html">09_Expression_Based</a></li><li class="nav-item"><a href="tutorial-10_Tables_Deep_Dive.html">10_Tables_Deep_Dive</a></li><li class="nav-item"><a href="tutorial-11_Standard_Library.html">11_Standard_Library</a></li><li class="nav-item"><a href="tutorial-12_IO_Operations.html">12_IO_Operations</a></li><li class="nav-item"><a href="tutorial-13_Error_Handling.html">13_Error_Handling</a></li><li class="nav-item"><a href="tutorial-14_Advanced_Combinators.html">14_Advanced_Combinators</a></li><li class="nav-item"><a href="tutorial-15_Integration_Patterns.html">15_Integration_Patterns</a></li><li class="nav-item"><a href="tutorial-16_Best_Practices.html">16_Best_Practices</a></li><li class="nav-item"><a href="tutorial-README.html">README</a></li><li class="nav-heading"><a href="global.html">Globals</a></li><li class="nav-item"><span class="nav-item-type type-member">M</span><span class="nav-item-name"><a href="global.html#callStackTracker">callStackTracker</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#debugError">debugError</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#debugLog">debugLog</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#executeFile">executeFile</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#initializeStandardLibrary">initializeStandardLibrary</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#interpreter">interpreter</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#lexer">lexer</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#main">main</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#parser">parser</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#readFile">readFile</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="global.html#run">run</a></span></li> +</nav> + +<div id="main"> + + <h1 class="page-title">02_Function_Composition</h1> + + + <section> + +<header> + +</header> + +<article> + <h1>Function Composition</h1> +<h2>What is the <code>via</code> Operator?</h2> +<p>The <code>via</code> operator is a function composition operator that combines functions from right to left.</p> +<pre class="prettyprint source lang-plaintext"><code>/* f via g = compose(f, g) */ +/* f via g via h = compose(f, compose(g, h)) */ +</code></pre> +<p>The <code>via</code> operator is right-associative and matches mathematical notation where <code>(f ∘ g ∘ h)(x) = f(g(h(x)))</code>.</p> +<pre class="prettyprint source lang-plaintext"><code>/* Define simple functions */ +double : x -> x * 2; +increment : x -> x + 1; +square : x -> x * x; + +/* Using via composition */ +result1 : double via increment 5; +/* Result: 12 (5+1=6, 6*2=12) */ + +/* Chained via composition */ +result2 : double via increment via square 3; +/* Result: 20 (3^2=9, 9+1=10, 10*2=20) */ +</code></pre> +<p>The key insight is that <code>via</code> groups from right to left.</p> +<pre class="prettyprint source lang-plaintext"><code>/* This expression: */ +double via increment via square 3 + +/* Groups as: */ +double via (increment via square) 3 + +/* Which translates to: */ +compose(double, compose(increment, square))(3) + +/* With the execution order of: */ +/* 1. square(3) = 9 */ +/* 2. increment(9) = 10 */ +/* 3. double(10) = 20 */ +</code></pre> +<h2>Precedence rules and <code>via</code></h2> +<p>The <code>via</code> operator has higher precedence than function application:</p> +<pre class="prettyprint source lang-plaintext"><code>/* via binds tighter than juxtaposition */ +double via increment 5 + +/* This is parsed as: */ +(double via increment) 5 +</code></pre> +<h2>More examples</h2> +<pre class="prettyprint source lang-plaintext"><code>/* Data processing pipeline */ +data : {1, 2, 3, 4, 5, 6, 7, 8, 9, 10}; +is_even : x -> x % 2 = 0; +double : x -> x * 2; +sum : x -> reduce add 0 x; + +/* Pipeline using via */ +process_pipeline : sum via map double via filter is_even; +result : process_pipeline data; +/* Reads: sum via (map double via filter is_even) */ +/* Result: 60 */ +</code></pre> +<p>You'll note that we don't need to use <code>@</code> here -- <code>via</code> is kinda special-cased because it is an ergonomic feature. It can work with function names directly because it's specifically for function composition. Higher-order functions like <code>map</code>, <code>filter</code>, and <code>reduce</code> require explicit function references using <code>@</code> because they need a way to distinguish between calling a function immediately vs passing it as an argument while <code>via</code> only ever takes in functions.</p> +<p>A goal with the <code>via</code> operator is to align with mathematical function composition:</p> +<pre class="prettyprint source lang-plaintext"><code>/* Mathematical: (f ∘ g ∘ h)(x) = f(g(h(x))) */ +/* Baba Yaga: f via g via h x = f(g(h(x))) */ +</code></pre> +<h2>When to Use <code>via</code></h2> +<p><strong>Use <code>via</code> when you want:</strong></p> +<ul> +<li>Natural reading: <code>f via g via h</code> reads as "f then g then h"</li> +<li>Mathematical notation: Matches <code>(f ∘ g ∘ h)</code> notation</li> +<li>Concise syntax: Shorter than nested <code>compose</code> calls</li> +<li>Right-to-left flow: When you think of data flowing right to left</li> +</ul> +<p><strong>Don't use <code>via</code> when:</strong></p> +<ul> +<li>You need left-to-right composition (use <code>pipe</code>)</li> +<li>You want explicit mathematical style (use <code>compose</code>)</li> +<li>You're working with simple function calls (use juxtaposition)</li> +<li>If you don't wanna</li> +</ul> +<h2>Common Patterns</h2> +<pre class="prettyprint source lang-plaintext"><code>/* Data transformation pipeline */ +data : {1, 2, 3, 4, 5, 6, 7, 8, 9, 10}; +is_even : x -> x % 2 = 0; +double : x -> x * 2; +sum : x -> reduce add 0 x; + +/* Pipeline: filter → map → reduce */ +process_pipeline : sum via map double via filter is_even; +result : process_pipeline data; +/* Result: 60 (filter evens: {2,4,6,8,10}, double: {4,8,12,16,20}, sum: 60) */ + +/* Validation chain */ +validate_positive : x -> x > 0; +validate_even : x -> x % 2 = 0; +validate_small : x -> x < 10; + +/* Chain validations */ +all_validations : validate_small via validate_even via validate_positive; +result : all_validations 6; /* 6 > 0, 6 % 2 = 0, 6 < 10 */ +/* Result: true */ +</code></pre> +<h2>Debugging <code>via</code> Chains</h2> +<p>To understand execution order, break down the chain:</p> +<pre class="prettyprint source lang-plaintext"><code>/* Complex chain: */ +result : square via double via increment via square 2; + +/* Break it down: */ +/* 1. square(2) = 4 */ +/* 2. increment(4) = 5 */ +/* 3. double(5) = 10 */ +/* 4. square(10) = 100 */ +/* Result: 100 */ +</code></pre> +</article> + +</section> + +</div> + +<br class="clear"> + +<footer> + Generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 4.0.4</a> on Tue Jul 29 2025 23:15:00 GMT-0400 (Eastern Daylight Time) using the Minami theme. +</footer> + +<script>prettyPrint();</script> +<script src="scripts/linenumber.js"></script> +</body> +</html> \ No newline at end of file |