<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Functional Javascript</title>
<script type="text/javascript" src="/javascripts/jquery-1.2.1.min.js"></script>
<script type="text/javascript" src="/javascripts/jquery.scrollTo-min.js"></script>
<script type="text/javascript" src="../collection-utils.js"></script>
<script type="text/javascript" src="../gradients.js"></script>
<script type="text/javascript" src="functional.min.js"></script>
<script type="text/javascript" src="../protodoc/Base.js"></script>
<script type="text/javascript" src="../protodoc/protodoc.js"></script>
<script type="text/javascript" src="../protodoc/protodoc.viewer.js"></script>
<script type="text/javascript" src="evaluator.js"></script>
<script type="text/javascript" src="index.js"></script>
<link rel="stylesheet" type="text/css" href="../protodoc/protodoc.css"/>
<link rel="stylesheet" type="text/css" href="styles.css"/>
<link rel="stylesheet" type="text/css" href="evaluator.css"/>
</head>
<body>
<h1>Functional Javascript</h1>
<div class="navbar">
<input type="checkbox" id="header-toggle" value="on" checked="checked"/> header
| <a href="http://osteele.com/archives/2007/07/functional-javascript">announcement</a>
| <a href="http://code.google.com/p/functional-javascript/">project page</a>
| download:
<a href="functional.min.js.gz">compressed (<3K min gz)</a>
| <a href="functional-1.0.2.tgz">source</a>
</div>
<div id="ie-warning" style="display:none">
<a class="close" href="#">close</a>
<p>Sorry, this page doesn't look too hot in Internet Explorer!
The <em>Functional</em> library works in IE6, at least, but this
documentation page is poorly formatted for that browser. Use <a
href="http://www.mozilla.org/products/firefox/">Mozilla
Firefox</a> or <a
href="http://www.apple.com/safari/download/">Safari 2.0</a> for
better viewing.</p>
</div>
<div id="header">
<div id="intro">
<p><dfn>Functional</dfn> is a library for functional programming
in JavaScript. It defines the standard higher-order functions
such as <code>map</code>, <code>reduce</code> (aka
<code>foldl</code>), and <code>select</code> (aka
<code>filter</code>). It also defines functions such as
<code>curry</code>, <code>rcurry</code>, and
<code>partial</code> for partial function application; and
<code>compose</code>, <code>guard</code>, and <code>until</code>
for <a
href="http://en.wikipedia.org/wiki/Function-level_programming">function-level
programming</a>. And all these functions accept strings, such
as <code>'x -> x+1'</code>, <code>'x+1'</code>, or
<code>'+1'</code> as synonyms for the more verbose
<code>function(x) {return x+1}</code>.</p>
<p>Ports: <a href="http://weblog.raganwald.com/2007/10/stringtoproc.html">String#to_proc</a> (Ruby; Reginald Braithwaite), <a href="http://debasishg.blogspot.com/2007/11/erlang-string-lambdas.html">Erlang</a> (Debasish Ghosh), <a href="http://redesign.dojotoolkit.org/">Dojo</a> (<a href="http://lazutkin.com/blog/2008/jan/12/functional-fun-javascript-dojo/">Eugene Lazutkin</a>).<br/>
Related: <a href="/sources/javascript/sequentially">Sequentially</a>, <a href="/sources/javascript/fluently">Fluently</a>, <a href="/sources/javascript/concurrent">MVars</a>.</p>
</div>
<div style="float:left; margin-right:5em">
<p><dfn>Functional</dfn> supports <a href="http://en.wikipedia.org/wiki/Higher-order_programming">higher-order programming</a>:</p>
<pre class="example">
<kbd>map('x*x', [1,2,3,4])</kbd>
<samp>→ [1, 4, 9, 16]</samp>
<kbd>select('>2', [1,2,3,4])</kbd>
<samp>→ [3, 4]</samp>
<kbd>reduce('x*2+y', 0, [1,0,1,0])</kbd>
<samp>→ 10</samp>
<kbd>map(guard('2*', not('%2')), [1,2,3,4])</kbd>
<samp>→ [1, 4, 3, 8]</samp>
</pre>
</div>
<div style="float:left">
<p>…as well as <a href="http://en.wikipedia.org/wiki/Function-level_programming">function-level</a> (or <a href="http://haskell.org/haskellwiki/Pointfree#Problems_with_pointfree">pointless</a>) style:</p>
<pre class="example">
<kbd>until('>100', 'x*x')(2)</kbd>
<samp>→ 256</samp>
<kbd>var squareUntil = until.partial(_, 'x*x');</kbd>
<kbd>var square2Until = squareUntil.uncurry().flip().curry(2);</kbd>
<kbd>var firstSquare2Over = compose(square2Until, 'n -> i -> i > n');</kbd>
<kbd>firstSquare2Over(100)</kbd>
<samp>→ 256</samp>
</pre>
</div>
<div style="clear:left"> </div>
<div id="evaluator" style="display:none">
<p>Try it! Enter an expression below, or click on a line of
code (from the examples above or the documentation below) to
copy it here.</p>
<div class="content">
<div class="input-column">
<pre class="transcript"></pre>
<textarea class="current" rows="1" cols="40">map('1+', [2, 3])</textarea><br/>
</div>
<div class="eval-column">
<button class="eval-button">→ </button>
</div>
<div class="output-column">
<pre class="transcript"></pre>
<pre class="current">(click the arrow button)</pre><br/>
</div>
<div style="clear:left"> </div>
<div class="transcript-controls">
History:
<input class="toggle" type="checkbox"/>show <span class="count"> </span>
<input class="clear" type="button" value="clear"/>
</div>
</div>
</div>
<hr/>
</div>
<div id="noscript">
<span class="initial">You either have JavaScript turned off or
you're using an unsupported browser. Either way, </span>
you're missing out on the rest of the page content, which is
generated from the source code. Try <a
href="http://www.mozilla.org/products/firefox/">Mozilla
Firefox</a> or <a
href="http://www.apple.com/safari/download/">Apple Safari 3.0</a>.
</div>
<table>
<tr>
<td valign="top">
<h2>API Documentation <span class="download">(<a href="functional.js">source</a>)</span></h2>
<div id="docs" class="protodoc docs">Documentation failed to load.</div>
</td>
<td valign="top">
<h2>Usage <span class="download">(<a href="examples.js">source</a>)</span></h2>
<div id="examples" class="protodoc examples">Examples failed to load.</div>
<button id="e1">1. Event.observe</button>
<button id="e2">2. onclick</button>
<button id="e3">3. specialized alert fn</button>
</td>
</tr>
</table>
<div id="footer">
Copyright 2007 by <a href="http://osteele.com">Oliver Steele</a>. This work is licensed under the <a href="MIT-LICENSE">MIT license</a>.
<a href="#" id="write-tests">View</a>/<a href="#" id="run-tests">run</a> tests.
<a href="functional.js" target="_blank">View source</a>.
</div>
</body>
</html>
) is private.
