Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Functional programming in TypeScript

1,358 views

Published on

The slides introduces the support TypeScript provides for Functional Programming.

Published in: Software
  • Be the first to comment

Functional programming in TypeScript

  1. 1. Functional Programming in TypeScript : @binDebug binDebug WorkSpace hello@binDebug.io
  2. 2. Agenda What is Functional Programming? 3 Tenets of Functional Programming Features for Functional Programming in TypeScript
  3. 3. What is Functional Programming?
  4. 4. The Functional Paradigm Buzzwords  Immutability, or Purity.  Higher Order Functions, or Functions as First-class citizens.  Pipelining.  Map-Reduce  Expressions.  Tail-call optimizations (available in ECMA 2015).  Parallelization.  Lazy evaluation.  Determinism, or Predictability.
  5. 5. “ ” OO makes code understandable by encapsulating moving parts. FP makes code understandable by minimizing moving parts. https://twitter.com/mfeathers/status/29581296216 - Michael Feathers
  6. 6. What exactly are “moving parts” here?  The disposition of a functional system is to change its state. If a system is functional, then its state, for the most part, is changing.  Managing the state of an application while structuring it is one of the more difficult things in software development. This is especially true when the application can execute code asynchronously.  There are two parts to code we write –  Code that computes results (Business Logic)  Code that performs actions (Persistence Logic)  Any and every code that contributes towards the changing of state is a “moving” part.
  7. 7. And how have we dealt with them?  In the beginning of time there was the procedural world, where everything was mixed.  The Objected oriented paradigm brought attention to the individuality of entities, and thus focused on encapsulation of the “moving” parts.  Functional Programming, which is in many ways a form of Declarative Programming, encourages us to focus on computing results rather than performing actions, thus minimizing the number of “moving” parts, i.e. the parts that cause the state of the system to change.
  8. 8. A Guide Rope  Immutable data, first class functions and tail call optimization are language features that aid functional programming.  Mapping, reducing, pipelining, recursing, currying and the use of higher order functions are programming techniques used to write functional code.  Parallelization, lazy evaluation and determinism are advantageous properties of functional programs.
  9. 9. The idea is…  Absence of side effects, i.e. our code doesn’t rely on data outside the current function, and it doesn’t change data that exists outside the current function.  Make our code more readable, and thus more maintainable. Further reading: Mary Rose Cook: A practical introduction to Functional Programming. http://bit.ly/2hDmuEs
  10. 10. Three Tenets
  11. 11. Tame Side Effects In Software parlance a side effect is anything that happens to the state of the system when invoking a function. The state of a system is shared. So be careful. Side effects imply dependency, thus difficult to test. That is why mocks exist. Purely Functional are those functions not allowed to alter state. System thus becomes predictable. Unit testing is all that much easier. A natural corollary of pure functions is that since state isn’t being changed, they are conducive for parallel processing.
  12. 12. Expressions and Statements Anything that evaluates to a value is referred to as an expression. 2+2 is an expression. 10 > 4 is an expression. 1 === 1 is an expression. All expressions in JavaScript will return a value and that value will have a type. A value’s type tells us what kind of thing it is. A statement is any set of expressions that has an impact on the program in such that it alters the state. For e.g. assigning a value to a variable, updating the database, writing to a log file. Statements are executed to cause some effect. Expressions are executed for their result. Statements usually update the state. Expressions return a value.
  13. 13. Higher Order Function Function that does at least one of the following: accept another function(s) as parameter(s), and return a function as a result. Higher order functions enable composition of functionality not through complex inheritance structures, but through substituting behaviour according to a strict definition – the function signature.
  14. 14. Suppose we want to double the numbers in an array, and throw away the even numbers. (Code source: http://bit.ly/2ptSnaV) The non-functional way: The functional way:
  15. 15. Purity of Function https://staltz.com/is-your-javascript-function-actually-pure.html
  16. 16. Is this pure or impure?
  17. 17. Understanding ES5, ES2015 and TypeScript  ES5 is what most of us have used for years.  The new version of JavaScript is ES2015, also known as “ES6”, and offers a multitude of new features around scoping, modules, arrow functions etc. ES6 is not widely supported in today's browsers, so it needs to be transpiled to ES5.  TypeScript is a superset of ES6, which means all ES6 features are part of TypeScript, but not all TypeScript features are part of ES6.
  18. 18. Evolution of TypeScript  In the 4 years since it went from an internal to a public open source, open design project, the combination of static type checking, transpiling and tooling in TypeScript has become something of a behind-the-scenes success, especially on large projects.  Like with C# and the .NET framework, one would expect Microsoft projects like Visual Studio Code (and the Office Online apps) to be written in TypeScript. But now, even frameworks like Angular and Ionic have been written in TypeScript.
  19. 19. Features for Functional Programming in TypeScript
  20. 20. The Functional TypeScript TypeScript itself is written entirely in functional style code with no classes at all.  Spread/Rest Operators.  Lambda expressions (also introduced in ES2015).  Tagged Union Types.  Type Safety (duh!).  Type Inference.
  21. 21. Spread/Rest Operator A Spread syntax allows in-place expansion of an expression for the following cases: 1. Array 2. Function call 3. Multiple variable destructuring Rest parameters works in the opposite direction of the spread syntax, it collects an indefinite number of comma separated expressions into an array.
  22. 22. Spread/Rest Operator: Syntax function add(...numbers) { return numbers[0] + numbers[1]; } add(3, 2);
  23. 23. Angular 2 Pipes: PipeTransform Interface
  24. 24. Angular 2 Pipes: A Pipe Implementation
  25. 25. Lambda expressions Or the fat arrow. “=>” JavaScript does offer anonymous functions, but then we do have to write the function keyword a lot. Lambda concentrates on the expressions at the soul of a function, thus making the code more readable. So what was Is now
  26. 26. Union Type A union type specifies several valid types for a value. If we have a value that has a union type, we can only access members that are common to all types in the union. For example, Car | Plane | Tank can only be a car or a plane or a tank. This offers a typesafe alternative to every time we use the any keyword when we do not know the type of a variable at design time. We use the vertical bar (|) to separate each type. Essentially, function MyCar(): Car | Plane | Tank { //Can be a car or a Plane or a Tank. //Who am I kidding, it can only be a car. }
  27. 27. Tagged Union Types  Tagged Union Types, which in other functional programming languages are referred to as Discriminant Union Types, is a Union Type whose member types all define a discriminant property of a literal type.
  28. 28. Type Inference  TypeScript does not need you to explicitly describe types at every possible opportunity.  TypeScript has a rich type inference system that will "fill in the blanks" for us. let numbers = [2, 3, 5, 7, 11]; numbers = ['this will generate a type error'];  Type inference can also work through context, which is handy with callbacks.
  29. 29. You, the developer! Last, but not the least, we are the biggest feature as far as Functional aspects go. Thinking of in terms of what to do, of composability, of computing, and abstracting out persistence is really an approach. Languages merely offer the tools.
  30. 30. And that is a wrap! Q&A

×