Page 0: Page 1: Metaprogramming JavaScript Dan Webb (dan@danwebb.net) Page 2: “ What? the writing of computer programs that write or manipulate other programs (or themselves) as their data” Page 3: With JavaScript?! ★ Small and fiesty but widely misunderstood ★ Relies on few but powerful constructs ★ You can work with functions, arguments, built-ins types and mechanisms like inheritance at runtime ★ Techniques underpin many JS libraries Page 4: JavaScript Exposed: Objects Out Of Control! Page 5: Play along! Page 6: 4 building blocks Page 7: (Nearly) everything is a hash Page 8: number string boolean undefined Page 9: everything else is an Object Page 10: Page 11: This works with any object Page 12: Page 13: Expandos: a special case Page 14: Page 15: Page 16: Page 17: Inspecting objects Page 18: Page 19: Page 20: Inspecting types Page 21: Page 22: Page 23: Page 24: Wha?! Page 25: Page 26: First typeof then instanceof Page 27: Functions are Objects Page 28: Page 29: 'Methods' are just functions that are assigned to a property of an object Page 30: Page 31: Page 32: Page 33: Page 34: Page 35: Page 36: Page 37: Page 38: arguments Page 39: Page 40: Page 41: Page 42: Functions can return other functions Page 43: Page 44: Page 45: Closure Page 46: “ Back to wikipedia... A closure occurs when a function is defined within another function, and the inner function refers to local variables of the outer function. Page 47: Page 48: Page 49: Why is that useful? Page 50: Page 51: Page 52: Page 53: Functions can be used to make objects Page 54: Page 55: Constructor functions are just functions Page 56: The magic is in the new operator Page 57: Page 58: Page 59: Page 60: inheritance Page 61: Page 62: Page 63: Page 64: Page 65: Page 66: Page 67: The point is: its all just functions, objects and properties Page 68: We can hack it all. Page 69: So what can you do with this stuff? Page 70: Patch holes in bad implementations Page 71: Page 72: Page 73: Self optimising code Page 74: Page 75: Page 76: Pretty APIs Page 77: Page 78: Page 79: Domain Specific Languages Page 80: DOMBuilder http://danwebb.net/lowpro Page 81: Page 82: Page 83: Page 84: DIY language features Page 85: John Resig's method overloading http://ejohn.org/blog/javascript-method-overloading/ Page 86: Page 87: Page 88: Page 89: Prototype 1.6 Classes http://prototypejs.org/learn/class-inheritance Page 90: Page 91: Page 92: and a lot more... Page 93: Looking back... ★ JavaScript is small but totally flexible ★ A handful of techniques provide everything you need ★ It's all about objects, properties and functions ★ Don't worry if its not all sunk in. Have a play around. Slides will be available. Page 94: Coming Soon... Page 95: