stevenocchipinti/JavaScriptFundamentals.md

## JavaScriptFundamentals.md

      
    Raw
  

              JavaScriptFundamentals.md
            
          
    JavaScript Crash Course

A list of things to learn / talk about in order to learn the fundamentals of
JavaScript and modern tools for dev
History


Initially released in 1995
Based on Scheme, bent to look like Java (because it was cool at the time)
Standardized as ECMAScript, by TC39
JavaScript is a language implementation based on the ECMAScript standard
Now its everywhere!

Basic JavaScript


Everything is an object

Objects (not classes)


Functions

Also object, use console.dir on a function to see


Advanced JavaScript


this keyword (assigned at runtime)

window (browsers) / global (node)
object definition
callback (setTimeout for example)
function() {}.bind()


new keyword (constructor functions)

Binds a new object ({}) to this
Sets the __proto__ of that object to the functions prototype object
Implicitly returns that new object


Prototypal inheritance

All objects have a __proto__ to lookup when a property is not found
Functions also have a prototype object for constructors


ES6 classes (more on that later)

Constructors are JavaScripts version of classes


Modularizing (without modules)


Using a <script> tag
Modularizing by using many <script> tags
Poluting the global namespace, use a window object namespace instead

Order matters!


Actual modules


NodeJS uses CommonJS: module.exports and require

module.exports: default vs named
There is also AMD, UMD and RequireJS


Modules in the browser would good... theres a package for that

Packages


NPM
Yarn

Bundling


Using browserify to use modular code in the browser

Uses closures to keep the namespace clean
Browserify uses transforms


Using webpack instead of browserify

Webpack uses loaders
Does more: code splitting, more specific config, etc.


Transpiling


ES5
ES6/ES2015, ES7/ES2016, ESNext

Primer

Var, let, const
Template strings
Concise object methods
Arrow functions
Destructuring
Modules (instead of CommonJS)


Babel

REPL, browserify tranform, webpack loader


React


create-react-app
Functional components
JSX
Props
Stateful components with ES6 classes
Immutable State