1. JavaScript Patterns and Node Idioms by Rob Richardson https://robrich.org/ @rob_rich #ITDEVCON @rob_rich

2. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich About Me Rob Richardson is a local software craftsman building web properties in ASP.NET and Node. He's a Microsoft MVP, published author, frequent speaker at conferences, user groups, and community events, and a diligent teacher and student of high quality software development. You can find this and other talks on his blog at http://robrich.org/presentations and follow him on twitter at @rob_rich. #ITDEVCON @rob_rich

3. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich What can client-side JavaScript programmers learn from Node? #ITDEVCON @rob_rich

4. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich The most ubiquitous language in the world You probably have a JavaScript runtime in your pocket -- maybe 2 or 3 Every browser since Netscape 4 and IE 4 can run it What is JavaScript #ITDEVCON @rob_rich

5. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich Everything in the browser: HTML: content CSS: pretty JavaScript: everything else Why JavaScript #ITDEVCON @rob_rich

6. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich We generally see curly braces and just use JavaScript … without learning it #ITDEVCON @rob_rich

7. NODE

8. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich Server-side JavaScript Built on Chrome’s V8 engine Asynchronous to a fault There is no Thread.sleep(); So we use the callback pattern What is Node #ITDEVCON @rob_rich

9. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich Promises are built in with ES v. 6, but it’s a higher-level concept and it isn’t the dominant pattern so there’s friction when training others *promises #ITDEVCON @rob_rich

10. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich mylib(in, data, function (err, arg, results) { if (err) { return; // handle error } // handle success }); The Callback Pattern #ITDEVCON @rob_rich

11. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich The Callback Pattern Benefits Elegant asynchrony Simplest solution Any number of arguments Single result function Drawbacks No run state / handle The airplane wing of nested callbacks #ITDEVCON @rob_rich

12. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich lib1(arg1, function (err, cb) { lib2(arg2, function (err, cb) { lib3(arg3, function (err, cb) { lib4(arg4, function (err, cb) { // done }); The Airplane Wing #ITDEVCON @rob_rich

13. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich \ \ \ ===================> / / / // weeeeee...... The Airplane Wing #ITDEVCON @rob_rich

14. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich var indata = {some:'data'}; var url = '/path/to/service'; $.getJSON(url, indata, function (outdata) { if (outdata.some !== indata.some) { // take action } }); The Callback Pattern #ITDEVCON @rob_rich

15. NODE

16. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich The Callback Pattern Small modules orchestrated together Package manager: npm Culture of Testing Lessons from Node #ITDEVCON @rob_rich

17. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich Single purpose: asynchronously process things Single result: one callback when it’s done Browser and node tests The async module #ITDEVCON @rob_rich https://npmjs.org/async https://github.com/caolan/async

18. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich async.parallel([ lib1.bind(null, arg1), lib2.bind(null, arg2), lib3.bind(null, arg3), lib4.bind(null, arg4) ], function (err, results) { if (err) { return; // one of them errored, log, handle } // all of them succeeded }); The async module #ITDEVCON @rob_rich

19. JAVASCRIPT

20. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich.prop or ["prop"] Property: a value in the dictionary Method: a function in the dictionary Dictionaries have no private keys Every object is a Dictionary #ITDEVCON @rob_rich

21. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich Think delegate in C#, function pointer in C/C++ Functions define scope, curly braces don’t Every function is an object #ITDEVCON @rob_rich

22. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich function myfunc() { console.log(myfunc.data); }; myfunc.data = 2; Every function is an object #ITDEVCON @rob_rich

23. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich missing parameters are undefined arguments holds extra parameters Every parameter is optional #ITDEVCON @rob_rich

24. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich Truthy / Falsey falsey 0 false "" null undefined NaN truthy everything else … thus === #ITDEVCON @rob_rich

25. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich JavaScript differences Object is Dictionary Every function is an object Functions define scope Every function parameter is optional Truthy / Falsey #ITDEVCON @rob_rich

26. PROTECT THE GLOBAL SCOPE

27. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich window is a dictionary too What if we both name it calendar ? What if we both name it i ? Why Protect Global Scope? #ITDEVCON @rob_rich

28. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich 0. Head in the sand #ITDEVCON @rob_rich http://theprofoundprogrammer.com/post/28552672458/text-maybe-a-clean-build-will-fix-it

29. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich var YAHOO = {}; YAHOO.dept = {}; YAHOO.dept.product = {}; //... if (theirVar === YAHOO.dept.product.feature.someEnum.value) { 1. Nested objects #ITDEVCON @rob_rich

30. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich (function () { // <-- no name, out of dict. // functions define scope // therefore "private" variables }()); // <-- execute it right away 2. IIFE #ITDEVCON @rob_rich

31. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich var myModule = (function () { // private variables return { the: interface }; }()); 3. Revealing Module Pattern #ITDEVCON @rob_rich

32. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich CommonJS: node, browserify AMD: requirejs ES6 modules: angular 2 4. Module loaders #ITDEVCON @rob_rich

33. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich 4. Module loaders #ITDEVCON @rob_rich https://xkcd.com/927/

34. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich 0. Head in the Sand 1. Nested objects 2. IIFE 3. Revealing Module Pattern 4. Module loaders Protect Global Scope #ITDEVCON @rob_rich

35. JAVASCRIPT PATTERNS AND NODE IDIOMS by Rob Richardson @rob_rich JavaScript has come of age We can learn from Node #ITDEVCON @rob_rich

36. QUESTIONS? @rob_rich https://robrich.org/

37. Rate This Session Now! Rate with Mobile App: Select the session from the Agenda or Speakers menus Select the Actions tab Click Rate Session Rate with Website: Register at www.devconnections.com/logintoratesession Go to www.devconnections.com/ratesession Select this session from the list and rate it Tell Us What You Thought of This Session Be Entered to WIN Prizes! #ITDEVCON @rob_rich