Functional Programming Fundamentals in JS & PHP

Learn
Functional Programming
(by implementing a SQL DSL)
in JavaScript and PHP
@KrisJordan
Tuesday, January 24, 12

View Slide

Who am I?
• Kris Jordan
• Founder at New Media Campaigns
• Ping me via...
• Twitter: @KrisJordan
• GitHub: KrisJordan
• Email: [email protected]
• KrisJodan.com
@KrisJordan

View Slide

Main Street, Carrboro
N E W M E D I A C A M P A I G N S

View Slide

Objectives
1. Grok functional programming fundamentals
2. Familiarity with underscore.(js|php)
3. Transfer SQL knowledge to FP
@KrisJordan

View Slide

Why should you care
about
Functional Programming?
@KrisJordan

View Slide

$(“p”).each(function(){
$(this).wrap(“”);
});
1. We already use
functional programming
techniques
@KrisJordan

View Slide

2. Our code consumes data.
@KrisJordan

View Slide

with fewer bugs
and think differently
3. You’ll write less code
about programming.
@KrisJordan

View Slide

So, what is
Functional Programming?
@KrisJordan

View Slide

λ Church
@KrisJordan

View Slide

(McCarthy)
@KrisJordan

View Slide

Functions are data.
@KrisJordan

View Slide

// JavaScript here
// php here
Title here.

View Slide

Functions are data.
var logMessage = function(){
console.log(“Hello, world.”);
};
logMessage();
$logMessage = function(){
echo(“Hello, world.”);
};
$logMessage();

View Slide

Functions can be passed to
Executor functions.
var executor = function(aFunction){
aFunction();
}
executor(logMessage);
$executor = function($aFunction){
$aFunction();
};
$executor($logMessage);

View Slide

jQuery’s API is awesome thanks to
Executor functions.
$(‘h1’).click(function(){
console.log(“Hello, world”);
});
@KrisJordan
$(“p”).each(function(){
$(this).wrap(“”);
});

View Slide

underscore.(js|php)
60-some classic functions
@KrisJordan

View Slide

@KrisJordan

View Slide

map(
3
2
1
, function(item){
return item * item;
}
);
@KrisJordan

View Slide

map(
3
2
1
, function(item){
return item * item;
}
);
9
@KrisJordan

View Slide

map(
3
2
1
, function(item){
return item * item;
}
);
9
4
@KrisJordan

View Slide

map(
3
2
1
, function(item){
return item * item;
}
);
9
4
1
@KrisJordan

View Slide

map(
3
2
1
, function(item){
return item * item;
}
);
9
4
1
return to
caller
@KrisJordan

View Slide

map implemented
var map = function(collection, fn) {
var rv = [];
for(var i = 0; i < collection.length; i++){
var item = collection[i];
rv.push(fn(item));
}
return rv;
}
$map = function($collection, $fn) {
$rv = array();
for($i = 0; $i < count($collection); i++){
$item = $collection[$i];
$rv[] = $fn($item);
}
return $rv;
}

View Slide

filter(
3
2
1
,function(item){
return item % 2 === 1;
}
);
@KrisJordan

View Slide

filter(
3
2
1
,function(item){
}
);
true?
yes
3
@KrisJordan

View Slide

filter(
3
2
1
,function(item){
}
);
true?
no!
3
@KrisJordan

View Slide

filter(
3
2
1
,function(item){
}
);
true?
yes
3
1
@KrisJordan

View Slide

filter(
3
2
1
,function(item){
}
);
3
1
return to
caller
@KrisJordan

View Slide

pluralFn(
item
item
item
, singularFn );
@KrisJordan

View Slide

underscore.(js|php)
60-some classic functions
@KrisJordan

View Slide

pluralFn(
item
item
item
, singularFn );
executor
how can we do
better here?
@KrisJordan

View Slide

Executor Function
jQuery(‘h1’).click( );
@KrisJordan

View Slide

Executor Function
Anonymous Function
$(this).toggleClass(“selected”);
});
@KrisJordan

View Slide

Executor Function
Anonymous Function
Function Variable
var toggleSelected = function(){
};
$(‘h1’).click(toggleSelected);
@KrisJordan

View Slide

Executor Function
Anonymous Function
Function Variable
$(‘h1’).click(toggleClass(“selected”));
@KrisJordan

View Slide

Executor Function
Anonymous Function
Function Variable
Generator Function
var toggleClass = function(klass){
return function(){
$(this).toggleClass(klass);
};
};

View Slide

Functions can be returned
by Generator functions.
var genMessageFn = function(msg) {
return function(){console.log(msg);};
};
jQuery(‘h1’).click(genMessageFn(“Hi!”));
$genMessageFn = function($msg) {
return function()use($msg){echo($msg);};
};
$executor($genMessageFn(“Hi!”));

View Slide

Something smells ﬁshy,
var genMessageFn = function(msg) {
return function(){console.log(msg);};
};
$(‘h1’).click(genMessageFn(“Hi!”));
$genMessageFn = function(msg) {
return function()use($msg){echo($msg);};
};
$executor($genMessageFn(“Hi!”));
doesn’t `msg` pop off the stack?

View Slide

Functions can be closures.
They “trap” var refs into a fn’s scope.
JS closures are implicit.
PHP closures are explicit.
function() use($msg) {...}

View Slide

Executor Function
Anonymous Function
return function(){
};
};
Function Variable
Generator Function
“Trapped” in
Scope by
Closure

View Slide

Closures in OOP terms:
native, minimal
Command pattern
class MsgCommand {
private $_msg;
function __construct($msg) {
$this->$_msg = $msg;
}
function exec() {
echo $this->_msg;
}
}
$cmd = new MsgCommand(“OOP”);
$cmd->exec();
$msgCommand = function($msg) {
return function()use($msg) {
echo $msg;
};
};
$cmd = $msgCommand(“FP”);
$cmd();
OOP FP
@KrisJordan

View Slide

Refactor to Generator
@KrisJordan
Anonymous
Function
Function
Variable
Generator
Function
refactor for
reuse
refactor for
parameters

View Slide

var toggleClassSelected = function(){
};
$(‘h1’).click(toggleClassSelected);
});
return function(){
};
};
Anon
Function
Function
Variable
Generator
Function
refactor for
reuse
refactor for
parameters
refactor for
reuse
refactor for
parameters

View Slide

Let’s Implement a SQL DSL
SELECT p.first,
p.last,
p.games,
p.points
FROM players AS p
WHERE p.games = 19
ORDER BY p.last
@KrisJordan

View Slide

Let’s Implement a SQL DSL
SELECT p.first,
p.last,
p.games,
p.points
FROM players AS p
WHERE p.games = 19
ORDER BY p.last
_.filter
_.sortBy
_.map
_.map
@KrisJordan

View Slide

Our Goal
select([“p.first”,
“p.last”,
“p.games”,
“p.points”],
orderBy(“p.last”,
where(equals(c(“p.games”),19),
from(“players”,”p”,tables))));
@KrisJordan

View Slide

Live coding.

View Slide

Recap
• Functions are data
• Closures “trap” variable references in scope,
useful for generating functions
• Write singular function generators, leverage
with plural executor functions
• Underscore provides great executor functions
for processing data
@KrisJordan

View Slide


View Slide

any(
3
2
1
,function(item){
}
);

View Slide

any(
3
2
1
,function(item){
}
);
true? yes
true

View Slide

any(
3
2
1
,function(item){
}
);
true? yes
true
return to
caller

View Slide

reject(
3
2
1
,function(item){
}
);

View Slide

reject(
3
2
1
,function(item){
}
);
2
return to
caller

View Slide

reduce(
3
2
1
,
function(memo,item){
return memo + item;
}
);
, 0

View Slide

reduce(
3
2
1
,
return memo + item;
}
);
0
, 0
memo

View Slide

reduce(
3
2
1
, );
0
, 0
memo
return 0+3;
}

View Slide

reduce(
3
2
1
, );
3
, 0
memo
return 0+3;
}

View Slide

reduce(
3
2
1
, );
3
, 0
memo
return 3+2;
}

View Slide

reduce(
3
2
1
, );
5
, 0
memo
return 3+2;
}

View Slide

reduce(
3
2
1
, );
5
, 0
memo
return 5+1;
}

View Slide

reduce(
3
2
1
, );
6
, 0
memo
return 5+1;
}

View Slide

reduce(
3
2
1
,
return memo + item;
}
);
6
, 0
memo
return to
caller

View Slide

Functional Programming Fundamentals in JS & PHP

Functional Programming Fundamentals in JS & PHP

krisjordan

Other Decks in Programming

Featured

Transcript