JavaScript is the lingua franca of web development for over a decade. It has evolved tremendously along with the Web and has entrenched in modern browsers, complex Web applications, mobile development, server-side programming, and in emerging platforms like the Internet of Things. Eventhough JavaScript has come a long way, a reinforced makeover to it will help build concurrent and massive systems that handle Big Data, IoT peripherals and many other complex eco systems. Functional Programming is the programming paradigm that could empower JavaScript to to enable more effective, robust, and flexible software development. These days, Functional Programming is at the heart of every new generation programming technologies. The inclusion of Functional Programming in JavaScript will lead to advanced and futuristic systems. The need of the hour is to unwrap the underlying concepts and its implementation in the software development process. The 46th edition of FAYA:80 provides a unique opportunity for the JavaScript developers and technology enthusiasts to shed light on the functional programming paradigm and on writing efficient functional code in JavaScript. Join us for the session to know more. Topics Covered: · Functional Programming Core Concepts · Function Compositions & Pipelines · Use of JS in Functional Programming · Techniques for Functional Coding in JS · Live Demo

1. Fuel Up
JavaScript (with)
Functional
Programming
FAYA:80

2. About Me
 A passionate programmer finding my way around Functional
Programming…
 Work at UST Global
 I occasionally blog at http://stoi.wordpress.com
 Author of YieldJS & SlangJS
 I recently co-authored a book with my colleague, friend and
mentor called “.NET Design Patterns” by PACKT
Publishing

3. History
Logic
Computation
Category
Theory
David
Hilbert
Kurt
Godel
Gentzen
Alonzo
Church
Alan
Turing
Haskell
Curry
William
Howard

4. Leap ( A projectile at 90 degrees)
Computing Paradigm
 <Functional>
 Imperative Paradigms with OOP
 Domain Driven Design
 Design Patterns
 Object Functional
 Reactive Programming
 <Functional> Reactive
Computing Platform
 Single Core
 Multi-core
 Many-core
 Clusters/Load-Balancers
 Hypervisors
 Virtual Machines
 Cloud 100 Years

5. JS Evolution (A snap-shot)
Client Side
 DHTML/Dom Manipulation
 XMLHTTP/AJAX
 jQuery (John Resig)
 Web Frameworks
 YUI, JQuery UI, Backbone, Knockout,
Angular, Bootstrap etc.
 Libraries
 RxJs, Underscore, Prototype, Immutable,
Redux, Lodash, Ramda etc.
 Trans-compilers
 Coffescript, Typescript, Flow etc.
 Mobile Application Platforms
 Hybrid – Sencha/Cordova based
Server Side
 Node.js (Ryan Dahl)
 Node Modules
 JS Libraries

6. Being Functional
Algorithm composition to be dealt on the same lines
as mathematical function evaluations
 Referential Transparency
 Predictable
 Transparent
 Declarative
 Composable
 Modular

7. Lambda (λ) calculus
Alonzo Church Definition
Lambda calculus (also written as λ-calculus) is a
formal system in mathematical logic for expressing
computation based on function abstraction and
application using variable binding and substitution
var AddOperation = (x, y) => x + y;
Lambda Abstraction : λx.x+y [f(x,y) = x + y]
Variables : x & y
Lambda Term : x + y
Simplifications
1. Anonymous functions
2. Uses functions of a single input

8. Lambda (λ) calculus - Continued
 The following three rules give an inductive definition that can be applied
to build all syntactically valid lambda terms:
 A variable x, is itself a valid lambda term
 If t is a lambda term, and x is a variable, then (λx.t) is a lambda term (called a
lambda abstraction);
 if t and s are lambda terms, then (ts) is a lambda term (called an application)

9. Lambda (λ) calculus - Consequences
λ
Referential
Transparency
Anonymous
Functions
First-Class
Functions
Higher-Order
Functions
Closures
Currying &
Partial
Application
Recursion
Memoization

10. Referential Transparency
Code Motivation
Now since state of i is not guaranteed mutation-free
AddOneRO (x) <> AddOneRO (y)
if x = y, this further implies
AddOneRO (x) - AddOneRO (x) <> 0
thus invalidating the fundamental mathematical
identity
x – x = 0

11. Closures
Code Motivation
Now since state of i is not guaranteed mutation-free
AddOneRO (x) <> AddOneRO (y)
if x = y, this further implies
AddOneRO (x) - AddOneRO (x) <> 0
thus invalidating the fundamental mathematical
identity
x – x = 0

12. Currying Concept
 Transforms a function that takes
multiple arguments into a
chain of functions each with a
singleargument. a
f (a,b,c)
a
b
c

13. Currying Implementation – ES5
Augmenting Types Closures Apply Invocation

14. Currying Implementation – ES6
Closures Apply Invocation

15. Partial Application – ES6
Transforms a function that take multiple
arguments into afunction that accepts a
fixed number of arguments,
which in turn yields yet another
function that accepts the
remaining arguments.

16. Recursion
 Recursions are leveraged in functional
programming to accomplish
iteration/looping.
 Recursive functions invoke
themselves, performing an operation
repeatedly till the base case is reached
 Recursion typically involves adding
stack frames to the call stack, thus
growing the stack
 You can run out of stack space during
deep recursions

17. Tail-Call Optimization
 In this case, no state, except for the
calling function's address, needs to be
saved either on the stack or on the
heap
 Call stack frame for fIterator is reused
for storage of the intermediate results.
 Another thing to note is the addition
of an accumulator argument (product
in this case)

18. Monads
 Monad is a design pattern used to
describe computations as a series of
steps.
 Monads wrap types giving them
additional behavior like the automatic
propagation of empty value (Maybe
monad) or simplifying asynchronous
code (Continuation monad).
 Identity Monad
 Wraps Itself
 Maybe Monad
 It can represent the absence of any
value
 List Monad
 Represents a lazily computed list of
values
 Continuation monad
 Binds the context

19. JS Language Features That Aid
Functional Programming
ES5
 First-class functions
 Function objects
 Lexical scoping
 Function scope
 Closures
 Prototypal Inheritance
 Augmenting Types
 Function Invocation
 Controlling context (with Apply & Call)
 Array Methods
 map, reduce, filter
ES6
 Arrow Functions
 function*
 yield, yield* expressions
 Map object

20. Scenario1
 How do you add Exception Handling
to your code-base without
extensive code-change?

21. Scenario2
 You tend to write algorithms that
operate more often on a sequence of
items than on a single item.
 More likely, you’ll perform several
transformations between the source
collection and the ultimate result.

22. Scenario2 – Solution A
 Iterating the collection once for every
transformation (n iterations for n
transformations)
 Increases the execution time for
algorithms with many transformations
 Increases the application’s memory
footprint as it creates interim
collections for very transformation
END
Output List -> Interim List2
Transformation2 (Square)
Interim List2 -> [1, 9, 25]
Transformation1 (Filter Odds)
Interim List1 -> [1, 3, 5]
START
Input List -> [1, 2, 3, 4, 5]

23. Scenario2 – Solution B
 Create one method that processes
every transformation (1 iteration for n
transformations)
 Final Collection is produced in one
iteration. This improves performance
 Lowers the application’s memory
footprint as it doesn’t create interim
collections for every transformation
 Sacrifices Reusability (of individual
transformations)
END
Output List -> Interim List1
Transformation1 (Filter Odds + Square)
Interim List1 -> [1, 9, 25]
START
Input List -> [1, 2, 3, 4, 5]

24. Scenario2 – Solution C
 Iterators
 Enables you to create methods that operate on a sequence
 Iterator methods do not need to allocate storage for the entire sequence of
elements
 Process and return each element as it is requested (Deferred Execution)

25. Step in
 A JavaScript library for creating
Iterators, Generators and Continuation
methods for Arrays.
 The Iterator would be a method
getIterator() that augments the Array
data type and would have the
following interfaces:
 moveNext (method)
 current (property)
 reset (method)
ITERATOR
• Input List [1,2,3,4,5]
MoveNEXT
• 1 <- Square(FilterODD(1))-> OutputList [1]
MoveNEXT
• 2 <- FilterODD(2)-> MoveNEXT
• 3 <- Square(FilterODD(3))-> OutputList [1,9]
MoveNEXT
• 4 <- FilterODD(4)-> MoveNEXT
• 5 <- Square(FilterODD(5))-> OutputList [1,9,25]

26. ES6 – Generators & Iterators
 function*
 The function* declaration (function
keyword followed by an asterisk)
defines a generator function, which
returns a Generator object.
 Generator Object
 The Generator object is returned by a
generator function and it conforms to
both the iterable protocol and the
iterator protocol.
 Generators are functions which can be
exited and later re-entered. Their
context (variable bindings) will be
saved across re-entrances.

27. Concluding
 The proof is in the pudding!!!