The document discusses various topics related to JavaScript including scope, closures, currying, inheritance, and design patterns. It notes that JavaScript has function scope but not block scope. Closures allow capturing variables in outer scopes. Currying transforms functions that take multiple params into functions that take them one at a time. Inheritance in JavaScript can be either classical or prototypal, with prototypal inheritance involving objects inheriting from other objects. The module pattern is presented as a way to create private variables and public APIs in JavaScript.

1. by tommymontgomery § may 21 2010How to Not Suck at JavaScript

2. Why you should love JavaScript

3. Why you should love JavaScriptIt’s everywhere

4. Why you should love JavaScriptIt’s everywhereYou have to

5. Why you should love JavaScriptIt’s everywhereYou have to

6. The most important thing

7. The most important thingScopeJavaScript has no block scopeJavaScript has lots of lexical scopeJavaScript has function scope

9. JavaScript does not have block scope

10. Firebug Confirms

11. What about var?var PREVENTS global scope inside functionsScoping 

14. Lexical ScopeLanguage parsing happens in phases:Phase 1: Lexing (tokenizing)Phase 2: ParsingPhase 3: Other stuff, like compiling to machine code, etc.

15. Lexical ScopeVariables declared in the current lexical environment are in lexical scopeE.g. function parameters are usually only available inside a function (function scope)Also known as static scope, because it only requires static analysisE.g. the runtime value of the variable is irrelevant

16. Dynamic ScopeRemember when we didn’t use varthat one time? That’s called dynamic scope.Global stack of variablesAny time a variable is referenced, it pushes (or pops) the global stack, always using the most recent value of the variable

17. ClosuresLexical scope allows us to use closures

18. ClosuresA closure is:

19. ClosuresA closure is: difficult to explain

20. ClosuresA closure is: difficult to explain

21. Closure Example

22. …

23. Closure ExampleHow can this be more awesome?

24. Closure ExampleHow can this be more awesome?Problem: the symbols variable is global

25. Closure ExampleHow can this be more awesome?Problem: the symbols variable is globalSolution: be awesome

26. Closure Example

27. Closure Examplesymbols is no longer global because it’s scope is limited to the function

28. CurryingCurrying is:

29. CurryingCurrying is: difficult to explain

30. Currying ExampleSo, I totally thought I had an example of where I used currying, but I was actually uncurrying. But it’s still awesome.

32. Triple your fun…

33. Triple your fun…

34. Solution #1

35. Solution #1Still a lot of duplicated codeLooks stupid

36. Solution #2: Uncurrying

37. CurryingCurrying is when you have a function that takes two parameters, and you turn it into a function that takes one parameter, lexically binding one of them, and return that lexically bound function (closure).

38. Currying (and uncurrying)Currying is when you have a function that takes two parameters, and you turn it into a function that takes one parameter, lexically binding one of them, and return that lexically bound function (closure).Uncurrying is exactly the opposite

39. lolcat

40. The Module PatternCoined by Douglas Crockford of JSON/Yahoo! fameA JavaScript design pattern for creating private variablesAwesome

41. The Module PatternMakes heavy use of the fact that functions are the only way to create lexical scopeCreates public APIs that use internal, private variables

42. The Module Pattern

43. The Module Pattern

44. The Module PatternThat’s all there is to itBut always remember…

45. DON’T EVER POLLUTE THE GLOBAL NAMESPACE.

46. InheritanceInheritance is tricky in JavaScriptThere are two types:Classical (like Java)Prototypal (not like Java)

47. Classical InheritanceClassical inheritance is hard in JavaScriptThere is no extendsThere is no implementsThe constructor is hiddenThe constructor doesn’t do what you think it willThe new keyword doesn’t do what you think it willThe this keyword is not always in the scope you think it is

48. Classical Inheritance

49. Classical InheritanceIf you don’t use prototype, then evict is not defined on our Cat instanceThink of it as a static method, and you can’t execute a static method non-statically

51. Classical Inheritance

52. Classical InheritanceWhat’s missing?Access to super/base/parentPrivate/protected membersInterfaces

53. Classical InheritanceDon’t ever do it yourselfUse John Resig’s implementationhttp://ejohn.org/blog/simple-javascript-inheritance/

54. The Juiciest Part

55. Prototypal InheritanceScaryUnknownSounds cool

56. Prototypal InheritanceInherit from object, rather than classes

57. Prototypal Inheritance

58. Prototypal InheritanceObject.create() from Douglas CrockfordEverybody uses itBecause JavaScript’s new keyword is eft up

59. InheritanceClassicalClasses inherit from classesPrototypalObjects inherit from objects