- Common js (sync loading using
require('xyz.js')
- AMD (async with dependent modules declaration)
- AMD eg: almond.js (stripped down of require.js)
- Common Js not used on front end due to obvious reason.
-
Standard way to define modules to make it compatible with both AMD and Common Js
-
Handles amd & common js & vanilla js
//Boilerplate code here
---
#### Browserify - using Common Js structured js on frontend
- helps in using common js everywhere.
- reads `require`'s and clubs into one file b4 delivering to front end
---
## Structuring
- IIFE (immediately invoked fn expr) based module structure. Helps prevent variable collisions.
- Each module in IIFE takes foll eg: format
Events = (function(){ var config1, config2, imp_variables; return { f1: f1, f2: f2 };
var crapVars;
function f1() { … }
function f2() { … }
function otherfn() { … }
}())
#### Functions
- break larger functions into small meaningfull ones
- Fn compositions: make new fn with mix of 2 or more fns
- Composer fn to produce third function
fn compose(f,g){ return fn(){ return f(g.apply(null, arguments)) } }
- eg: http://scott.sauyet.com/Javascript/Talk/Compose/2013-05-22/#slide-5
- compose works for 2 fn. what about 3 fn?
- soln : `folds` - kind of `reduce`
var f_ = [f, g, h].reduce(compose)
- `reduce` or `reduceRight` is same.
- `f.(g.h) === (f.g).h`
- Alternatively in js we can modify the function prototype itself
Function.prototype.compose = function(g) { var fn = this; return function() { return fn.call(this, g.apply(this, arguments)); }; };
var f = mult2.compose(square).compose(add1);
- `currying` : pass certain args, and not pass others
https://medium.com/brigade-engineering/setting-up-webpack-with-rails-c62aea149679
One eg of higher order fns using
forEach
instead of calling an algo over each item inarray
: