Javascript
Functional Programming
ES6
Design Pattern
closures
prototypes
ECMAScript: It was created to standardize JavaScript, so as to foster multiple independent implementations. JavaScript has remained the best-known implementation of ECMAScript since the standard was first published, with other well-known implementations including JScript and ActionScript.[3]
ES6, ES2015, ECMAScript 2015: sixth edition of the ECMA-262 standard
Babel: A transpiler that can convert ES6 code to ES5 code
JavaScript runtime: different JavaScript runtimes can share the same JavaScript engine. V8, for example, is the JavaScript engine used in both Google Chrome and Node.js — two very different environments.
JavaScript engine
Concepts
Functions as Units of Behaviour
Functions as Units of Abstraction
comparator is a higher-order function (because it takes a function and returns a new function)
Data as Abstraction
very often the data needs of a JavaScript application are much simpler than is served by classes.
Historically, functional programming has centered around building functions that work to achieve higher-level behaviors and work on very simple data constructs. keep the data needs as simple as possible and build abstract functions that operate on them. Constraining myself to functions operating on simple data, interestingly enough, increases my flexibility.
Modelling
OO: the interactions between objects cause internal change to each object, leading to an overall system state that is the amalgamation of many smaller, potentially subtle state changes. These interrelated state changes form a conceptual “web of change” that, at times, can be confusing to keep in your head.
FP: A functional system, on the other hand, strives to minimize observable state modification. Therefore, adding new features to a system built using functional principles is a matter of understanding how new functions can operate within the context of localized, nondestructive (i.e., original data is never changed) data transformations.
Whereas the object-oriented approach tends to break problems into groupings of “nouns,” or objects, a functional approach breaks the same problem into groupings of “verbs,” or functions.
Functions as First-Class Things
Multiple Paradigms
Functional Programming:
does very little on its own.
Functional programming is about pulling programs apart and reassembling them from the same parts, abstracted behind function boundaries.
allows you to separate out domain logic
The Two Pillars of JavaScript Part 2
https://medium.com/@cscalfani/goodbye-object-oriented-programming-a59cda4c0e53
Imperative Programming:
Because imperative code operates at such a precise level of detail, they are often one-shot implementations or at best, difficult to reuse. Further, imperative languages are often restricted to a level of detail that is good for their compilers rather than for their programmers
Prototype-based object-oriented programming
JavaScript instances use existing objects to serve as prototypes for specialized instances. Object specialization, together with a built-in dispatch logic that routes calls down what’s called a prototype chain, is far more low-level than class-oriented pro‐ gramming, but is extremely elegant and powerful.
In most programming languages offering both functional and object-oriented styles, a trade-off is made in the way that self-reference is handled.
you’ll notice a fundamental tension between an object-oriented style and a functional style
Metaprogramming
Applicative Programming
Collection-Centric Programming
The point of a collection-centric view, as advocated by Underscore and functional programming in general, is to establish a consistent processing idiom so that we can reuse a comprehensive set of functions.
Definition
a closure is a function that captures the external bindings (i.e., not its own arguments) contained in the scope in which it was defined for later use (even after that scope has completed).
Accessing variables outside of the immediate lexical scope creates a closure.
Returning the nested function allows you to maintain access to the local variables, arguments, and inner function declarations of its outer function. This encapsulation allows us to hide and preserve the execution context from outside scopes while exposing a public interface and thus is subject to further manipulation.
Variable Retention: local variables are not the only things that can be captured. Function arguments can be captured as well. This variable retention is precisely the definition of a closure.
Usage
module pattern 1 - allows you to emulate public, private, and privileged members. encapsulation and data hiding: JavaScript’s object system does not provide a way to hide data directly, so data is hidden using something called closures
module pattern 2 - This is an increasingly common practice, employed by many popular JavaScript libraries (jQuery, Node.js, etc.). This technique creates a closure around the entire contents of the file which, perhaps most importantly, creates a private namespace and thereby helps avoid potential name clashes between different JavaScript modules and libraries.
Higher-order functions - capture other functions are a very powerful technique for building abstractions. #. Allow you to create functions based solely on some “configuration” captured at creation time
IIFE
(...)()
: useful when attempting to preserve the global namespace as any variables declared within the function body will be local to the closure but will still live throughout runtime. This is a popular means of encapsulating source code for applications and frameworks, typically exposing a single global interface in which to interact with.
High Order Function (with example)
RXJS
Subject: the most basic fire-and-forget variety -- if you were not subscribed when the event happened, then you do not see it.
BehaviorSubject: represents a "value that can change". It stores the latest value emitted to its consumers, and whenever a new Observer subscribes, it will immediately receive the "current value" from the BehaviorSubject.
AsyncSubject: get nothing until the observable completes at which time you will get the final value (and continue to get the final value if you subscribe again). This is the true Rx analog of Promises, since it produces nothing until it "resolves" (i.e. completes), and afterwards always gives the value to anyone that subscribes.
ReplaySubject: similar to a BehaviorSubject in that it can send old values to new subscribers, but it can also record a part of the Observable execution. Use new Rx.ReplaySubject(5) and you'll get the 5 most recent values as soon as you subscribe
Flow-Based programming
Chaining
_.chain(obj).xxx().tap().yyy().value()
_(obj).xxx().yyy()
The “magic” that allows method chains is that each method in the chain returns the same host object reference (Stefanov 2010)
method chaining is the act of writing object methods to all return a common this
reference so common methods can be called in sequence
🚩 implement a lazy chain
- _target
- _calls: array of thunk (A function that wraps some behavior for later execution)
Pipeline (similar to lazy chain)
Pipelines, unlike chains, work against data such as arrays and objects rather than a common reference.
pipelines are meant to be pure—no data was harmed by running it through
Immutability
Interview
Coding Practice
Typescript
Books
Editor
Scope: the lifetime of a variable
Global Scope
* variable without
var
. Any one can access and change it.* Any object is wide open for change (mutable by default)
Lexical Scope
* variable lookup starts at the closest binding context and expands outward until it finds a binding
Dynamic Scope:
* could simulate with a global table of named values (binding)
* Problem: the value of any given binding cannot be known until the caller of any given function is known - which may be too late
*
this/call/apply/
: the value of thethis
reference is directly manipulable through the use of apply or call*
Bind/_.BindAll
: lock thethis
reference from changing
the calling by function B of a function A, supplied as an argument to function B originally, e.g. map, reduce, and filter
String in JavaScript are immutable eliminates a whole class of nasty problems
https://medium.com/javascript-scene/the-dao-of-immutability-9f91a70c88cd)
Mutation hides change. Hidden change manifests chaos. Therefore, the wise embrace history
Logic is thought. Effects are action. Therefore the wise think before acting, and act only when the thinking is done.
discipline in design: in functional programming, the ideal situation is that there is never mutation, and if you start with a policy of im‐ mutability, you’d be surprised how far you can get.
trade off: implementation details are irrelevant as long as they do not “leak out.”
Object#freeze
- cause subtle errors to occur
- shallow
Policies for Controlling Change: If you absolutely need to manage state, then the ideal situation is to isolate it within a single place
CommonJS modules - require
ES modules - importimport X from Y = import { default as X } from Y